dwd-projects
/
bs-p2
generated from dwd/boilarplate-remix-tailwind-antd
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

s1

page3
Suvodip 2024-07-25 10:27:42 +05:30
parent 5dc331a702
commit 8b79a4d25f
2 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
app/components/KnowledgeQuest.tsx
View File

@ -617,7 +617,7 @@ const App: React.FC = () => {
<p className='pl-1 text-[18px] font-[700] whitespace-nowrap'>Knowledge Quests</p>
</div>
<div className='flex justify-center place-items-center'>
<button className='bg-[#000] py-2.5 rounded-[8px] text-[#FFF] tetx-[16px] font-[600] inline-flex justify-center place-items-center'>
<button className='bg-[#000] py-2.5 px-3 rounded-[8px] text-[#FFF] tetx-[16px] font-[600] inline-flex justify-center place-items-center'>
<img src="../../assets/ai-button-icon.svg" alt="" /> AI Generative Quiz
</button>
<Button className='border-none shadow-none bg-transparent hover:bg-transparent' onClick={showLoading}>
@ -653,7 +653,7 @@ const App: React.FC = () => {
<TabPane className='' tab="All" key="1">
<div className='flex flex-col gap-6'>
{knowledgeData.map(data => (
<div key={data.id} className='flex flex-row justify-between px-6 place-items-center'>
<div key={data.id} className='flex flex-col lg:flex-row justify-between px-6 place-items-center'>
<div className='flex flex-row justify-between gap-6'>
<img src={data.img} alt="" />
<div className='flex flex-col space-y-3'>
@ -670,13 +670,17 @@ const App: React.FC = () => {
<TabPane tab="Completed" key="2">
<div className='flex flex-col gap-6'>
{knowledgeData.map(data => (
<div key={data.id} className='flex flex-row justify-between px-6 place-items-center'>
<div key={data.id} className='flex flex-col lg:flex-row justify-between px-6 place-items-center'>
<div className='flex flex-row justify-between gap-6'>
<img src={data.img} alt="" />
<div className='flex flex-col space-y-3'>
<h2 className='text-[16px] font-[700] text-[#000]'>{data.title}</h2>
<p className='text-[14px] font-[600] text-[#525252]'>{data.challenge}</p>
<p className='text-[14px] font-[600] text-[#9D9D9D]'>{data.question}</p>
<p className='text-[14px] font-[600] text-[#9D9D9D]'>{data.question} | 200 people have taken this quiz</p>
<div className='flex flex-col md:flex-row gap-x-20'>
<p className='text-[14px] font-[600]'>Score: 9/10</p>
<p className='text-[14px] font-[600] inline-flex place-items-center'>Earned: 9 &nbsp;<img src="../../assets/points-icon.svg" alt="" /></p>
</div>
</div>
</div>
<p className='bg-[#000] text-[#FFF] rounded-[8px] px-16 py-3 h-fit text-[18px] font-[600]'>Review</p>
@ -720,7 +724,7 @@ const App: React.FC = () => {
</div>
<div className='flex flex-col'>
{sortedData.slice(3).map(data => (
<div key={data.id} className='flex flex-row justify-between place-items-center border-b-[1px] border-[#CFCFCF] p-2'>
<div key={data.id} className='flex flex-row justify-between place-items-center border-b-[1px] border-[#CFCFCF] p-2 hover:bg-[#FDF2E7] duration-700'>
<p className='text-[11px] font-[700]'># {data.rank}</p>
<img className='w-[35px] h-[35px]' src={data.avatar} alt="" />
<div>

15
app/routes/ai-quiz.tsx Normal file
View File

@ -0,0 +1,15 @@
import React, {useState} from "react";
export default function Index(){
return(
<section className='container-fluid bg-[#000]'>
<div className="flex flex-row justify-center gap-x-8 py-3">
<img src="../../assets/ai-button-icon.svg" alt="" />
<div className="flex flex-col">
<p className="text-[#FFF] text-[24px] font-[700]"> Take an AI Generative Quiz</p>
<p className="text-[#FFF] text-[16px] font-[400]">Convert any text into an interactive quiz session</p>
</div>
</div>
</section>
)
}