diff --git a/public/assets/scss/app.scss b/public/assets/scss/app.scss index c00641b..66bcb88 100644 --- a/public/assets/scss/app.scss +++ b/public/assets/scss/app.scss @@ -1,22 +1,22 @@ /*--------------------------------------------- Template Name: EduBlink - Online Learning React Education Template -Template URL: +Template URL: Description: This template is built with React NextJS. Author: DevsBlink Author URL: https://1.envato.market/YgGJbj Version: 1.0.0 -=============================================== +=============================================== STYLESHEET INDEXING | |___ Default Styles | |___ Variables -| |___ Shortcode +| |___ Shortcode | |___ Reset Styels | |___ Typography | |___ Forms Styles -| |___ Common -| |___ Animation +| |___ Common +| |___ Animation | |___ Elements Styles | |___ Accordion Style @@ -25,11 +25,11 @@ STYLESHEET INDEXING | |___ Button | |___ Countdown | |___ Course Widget -| |___ Pagination Styles -| |___ Sal Styels +| |___ Pagination Styles +| |___ Sal Styels | |___ Section Title -| |___ Slick Styles -| |___ Social Share Style +| |___ Slick Styles +| |___ Social Share Style | |___Template Styles | |___ About Styles @@ -132,7 +132,7 @@ STYLESHEET INDEXING /*======================================================================= -4.Blocks Styles +4.Blocks Styles =========================================================================*/ @import 'header/header'; @import 'header/nav'; @@ -143,7 +143,7 @@ STYLESHEET INDEXING @import "footer/footer"; /*======================================================================= -5.Blog Styles +5.Blog Styles =========================================================================*/ @import "blog/blog"; @import "blog/blog-details"; @@ -156,4 +156,7 @@ STYLESHEET INDEXING @import "default/spacing"; @import "default/react_specific"; @import "default/dark"; -@import "default/rtl"; \ No newline at end of file +@import "default/rtl"; + + +@import "components/writing-evaluation-form"; diff --git a/public/assets/scss/components/_writing-evaluation-form.scss b/public/assets/scss/components/_writing-evaluation-form.scss new file mode 100644 index 0000000..3901592 --- /dev/null +++ b/public/assets/scss/components/_writing-evaluation-form.scss @@ -0,0 +1,106 @@ + +.content-box { + background: #eaeaea; + padding: 100px 100px; + margin: -5px 0px 25px -15px; +} + + +.incorrect, .delete { + text-decoration: line-through; + border-bottom: 2px solid #c38181; + color: #d5bbbb !important; + padding: 0 3px; +} + +.corrected { + border-bottom: 2px solid #9ec59e; + padding-left: 3px; + font-weight: 600; +} + +.space { + background: pink; + border: 1px solid pink; + padding-left: 3px; +} + +.addition { + color: #ff6700; + background: #ffd7b5; + border: 1px solid #ff6700; + padding: 0 3px; +} + +.hovertextp { + position: relative; + display: inline-block; +} + +.hovertextp .hovertext:before { + content: "Feedback: " attr(data-hover); + visibility: hidden; + background-color: rgba(0, 0, 0, 0.8); + color: #fff; + text-align: center; + border-radius: 6px; + padding: 5px 0; /* Position the tooltip */ + position: absolute; + display: block; + z-index: 9999; + top: auto; /* Reset the top property */ + overflow: visible; + width: max-content; + max-width: 200px; +} + +.hovertextp .hovertext:hover:before { + opacity: 1; + visibility: visible; +} + +.nopaque { + opacity: 0.2; +} + +.opaque { + opacity: 1.0; +} + + +.waf-menu.waf-menu { + + li { + &:hover { + background-color: #f0f0f0; + } + } + + a { + display: block; + cursor: pointer; + padding: 5px; + } + + .waf-submenu { + display: none; + list-style-type: none; + padding: 0 0 20px 20px; + + &.active { + display: block; + } + } +} + + + +.sentences { + display: none; +} + +.waf-textarea { + textarea { + background: #f5f4f4; + } +} diff --git a/src/components/course-details/course-details-area.jsx b/src/components/course-details/course-details-area.jsx index 9477f28..c333b35 100644 --- a/src/components/course-details/course-details-area.jsx +++ b/src/components/course-details/course-details-area.jsx @@ -3,7 +3,7 @@ import CourseDetailsSidebar from '../common/sidebar/course-details-sidebar'; import CommentFormCourse from '../forms/comment-form-course'; import SingleComment from './single-comment'; import SingleProgressbar from './single-progressbar'; -import WritingEvaluationForm from "../forms/writing-evalution-form"; +import WritingEvaluationForm from "../forms/writing-evaluation-form"; const CourseDetailsArea = ({course}) => { const { diff --git a/src/components/forms/writing-evalution-form.jsx b/src/components/forms/writing-evaluation-form.jsx similarity index 71% rename from src/components/forms/writing-evalution-form.jsx rename to src/components/forms/writing-evaluation-form.jsx index 97b4418..bcb6c50 100644 --- a/src/components/forms/writing-evalution-form.jsx +++ b/src/components/forms/writing-evaluation-form.jsx @@ -1,5 +1,4 @@ import React, {useState} from 'react'; -import './writing-evaluation-form.module.css'; const WritingEvaluationForm = () => { const [essay, setEssay] = useState(''); @@ -14,17 +13,17 @@ const WritingEvaluationForm = () => { setLoading(true); - console.log(essay, task) - const response = await fetch('https://Mayanktstprep-tstprep-writing.hf.space/get_passage_html', { + const response = await fetch('https://TSTPrep-tstprep-writing.hf.space/get_passage_html', { method: 'POST', headers: { 'Content-Type': 'application/json', - Authorization: 'Bearer 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' + Authorization: 'Bearer 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' }, body: JSON.stringify({ essay, - task + task, + demo: true }) }); if (!response.ok) throw new Error(response.statusText); @@ -47,7 +46,19 @@ const WritingEvaluationForm = () => { } const toggleSubmenu = (e) => { - console.log('clicked', e); + e.preventDefault(); + let el = e.target; + + while (el && el !== e.currentTarget && el.tagName !== "A") { + el = el.parentNode; + } + if (el && el.tagName === "A") { + // ...do your state change... + + console.log(el.nextSibling.classList.toggle('active')); + + + } } return ( @@ -57,6 +68,7 @@ const WritingEvaluationForm = () => { {response &&
{error}
} @@ -66,7 +78,7 @@ const WritingEvaluationForm = () => {