ulivargas/classroomio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dark mode improvements

Browse Source
This commit is contained in:
Rotimi Best
2023-09-16 22:44:20 +01:00
parent e1114b6f2f
commit 70326f2281
43 changed files with 77 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/error.html
+1 -1
View File
@@ -3,7 +3,7 @@
</script>
<div
class="error-container m-auto flex flex-col-reverse lg:flex-row md:flex-col-reverse items-center justify-center h-screen w-screen py-10 dark:bg-gray-800">
class="error-container m-auto flex flex-col-reverse lg:flex-row md:flex-col-reverse items-center justify-center h-screen w-screen py-10 dark:bg-black">
<div class="md:w-full p-2 lg:w-2/4">
<h2 class="w-full text-lg lg:text-3xl font-medium lg:font-normal">
Something unexpected occured.
src/lib/components/Apps/components/Poll/components/Poll.svelte
+2 -2
View File
@@ -46,7 +46,7 @@
}
</script>
<div class="p-4 bg-white dark:bg-gray-800 border-2 rounded-md mb-3">
<div class="p-4 bg-white dark:bg-black border-2 rounded-md mb-3">
{#if selectedOptionToView}
<div>
<div class="flex items-center mb-5">
@@ -140,7 +140,7 @@
{:else}
{#each poll.options as option, index}
<button
class="bg-white dark:bg-gray-800 rounded-md border-2 border-gray-500 {didUserSelect(
class="bg-white dark:bg-black rounded-md border-2 border-gray-500 {didUserSelect(
option
) &&
'focus:border-primary-700 border-primary-700'} text-black p-2 w-full mb-3 text-left relative"
src/lib/components/Apps/components/Poll/index.svelte
+25 -29
View File
@@ -13,33 +13,33 @@
{
label: 'Rich Harris',
value: 'rich-harris',
avatar: 'https://i.pravatar.cc/150?img=1',
avatar: 'https://i.pravatar.cc/150?img=1'
},
{
label: 'Linus Torvalds',
value: 'linus-torvalds',
avatar: 'https://i.pravatar.cc/150?img=2',
avatar: 'https://i.pravatar.cc/150?img=2'
},
{
label: 'Elon Musk',
value: 'elon-musk',
avatar: 'https://i.pravatar.cc/150?img=3',
avatar: 'https://i.pravatar.cc/150?img=3'
},
{
label: 'Satoshi Nakamoto',
value: 'satoshi-nakamoto',
avatar: 'https://i.pravatar.cc/150?img=4',
},
avatar: 'https://i.pravatar.cc/150?img=4'
}
];
const tabs = [
{
label: 'My polls',
value: 0,
value: 0
},
{
label: 'Other polls',
value: 1,
},
value: 1
}
];
let selectedTab = 0;
@@ -54,7 +54,7 @@
options: [
{
label: 'Dan Abrahmov',
selectedBy: [],
selectedBy: []
},
{
label: 'Evan You',
@@ -62,25 +62,25 @@
{
label: 'Rich Harris',
value: 'rich-harris',
avatar: 'https://i.pravatar.cc/150?img=1',
avatar: 'https://i.pravatar.cc/150?img=1'
},
{
label: 'Linus Torvalds',
value: 'linus-torvalds',
avatar: 'https://i.pravatar.cc/150?img=2',
},
],
avatar: 'https://i.pravatar.cc/150?img=2'
}
]
},
{
label: 'Rich Harris',
selectedBy: [],
selectedBy: []
},
{
label: 'Yehuda Katz',
selectedBy: [],
},
],
},
selectedBy: []
}
]
}
];
function handleCreatePoll() {
@@ -92,9 +92,9 @@
polls = [
{
...poll,
author: users.find((u) => u.value === userId),
author: users.find((u) => u.value === userId)
},
...polls,
...polls
];
}
@@ -122,16 +122,12 @@
// Select if already selected
option.selectedBy = [
...option.selectedBy,
users.find((user) => user.value === userId),
users.find((user) => user.value === userId)
];
}
} else if (
option.selectedBy.find((user) => user.value === userId)
) {
} else if (option.selectedBy.find((user) => user.value === userId)) {
// This makes the user to select only one option
option.selectedBy = option.selectedBy.filter(
(user) => user.value !== userId
);
option.selectedBy = option.selectedBy.filter((user) => user.value !== userId);
}
return option;
@@ -139,7 +135,7 @@
}
return poll;
}),
})
];
};
}
@@ -186,7 +182,7 @@
{/if}
{:else}
<div
class="bg-gray-100 dark:bg-gray-700 border rounded-md h-60 flex items-center justify-center"
class="bg-gray-100 dark:bg-neutral-800 border rounded-md h-60 flex items-center justify-center"
>
<h2 class="text-xl font-bold">No polls to display</h2>
</div>
src/lib/components/AuthUI/index.svelte
+1 -1
View File
@@ -35,7 +35,7 @@
</script>
<div class="root w-full min-h-screen flex items-center justify-center">
<div class="container border border-gray bg-white dark:bg-gray-800">
<div class="container border border-gray bg-white dark:bg-black">
<div class="flex items-center flex-col p-2 lg:px-8 lg:py-3">
{#if !showOnlyContent || showLogo}
<div class="flex flex-col items-center justify-center w-full pt-2">
src/lib/components/Course/components/Ceritficate/Design.svelte
+1 -1
View File
@@ -99,7 +99,7 @@
</div>
</section>
<section
class="bg-gray-100 dark:bg-gray-700 flex justify-center items-center rounded-md w-full lg:w-3/5"
class="bg-gray-100 dark:bg-neutral-800 flex justify-center items-center rounded-md w-full lg:w-3/5"
>
<div class="certificate-container flex justify-center items-center h-5/6">
{#if $course.certificate_theme === 'professional'}
src/lib/components/Course/components/Lesson/AddLessonModal.svelte
+1 -1
View File
@@ -60,7 +60,7 @@
modalHeading="Add New Lesson"
>
<div
class="sm:min-h-[245px] md:min-h-[100px] lg:min-h-[190px] relative m-auto rounded-md border-2 border-gray-200 py-2 md:py-3 px-2 md:px-5 mb-2 md:mb-4 flex flex-wrap items-center dark:bg-gray-700"
class="sm:min-h-[245px] md:min-h-[100px] lg:min-h-[190px] relative m-auto rounded-md border-2 border-gray-200 py-2 md:py-3 px-2 md:px-5 mb-2 md:mb-4 flex flex-wrap items-center dark:bg-neutral-800"
>
<div class="mr-5">
<TextChip
src/lib/components/Course/components/Lesson/Exercise/MarkExerciseModal.svelte
+1 -1
View File
@@ -108,7 +108,7 @@
</div>
<div class="border border-gray-300 rounded-md mt-2">
<div
class="hover:bg-gray-100 dark:bg-gray-700 border-b border-t-0 border-l-0 border-r-0 border-gray-300 p-3"
class="hover:bg-gray-100 dark:bg-neutral-800 border-b border-t-0 border-l-0 border-r-0 border-gray-300 p-3"
>
<p class="dark:text-white font-bold text-lg">
Details
src/lib/components/Course/components/Lesson/Exercises/index.svelte
+1 -1
View File
@@ -157,7 +157,7 @@
<div class="flex flex-wrap">
{#each $lesson.exercises as exercise}
<a
class="w-52 bg-gray-100 dark:bg-gray-700 px-4 py-7 mr-4 mb-4 rounded-lg"
class="w-52 bg-gray-100 dark:bg-neutral-800 px-4 py-7 mr-4 mb-4 rounded-lg"
href="{path}/{exercise.id}"
on:click={gotoEdit}
>
src/lib/components/Course/components/Navigation/index.svelte
+1 -1
View File
@@ -154,7 +154,7 @@
$menu.hidden
? '-translate-x-[100%] absolute md:translate-x-0 md:relative z-[40]'
: 'translate-x-0 absolute md:relative z-[40]'
} transition w-[350px] min-w-[350px] md:max-w-[350px] bg-gray-100 dark:bg-gray-800 h-[calc(100vh-48px)] overflow-y-auto border border-l-0 border-t-0 border-b-0 border-r-1`}
} transition w-[350px] min-w-[350px] md:max-w-[350px] bg-gray-100 dark:bg-black h-[calc(100vh-48px)] overflow-y-auto border border-l-0 border-t-0 border-b-0 border-r-1`}
>
<div class="h-full flex flex-col">
<ul class="my-5">
src/lib/components/CourseLandingPage/components/Editor/Container.svelte
+1 -1
View File
@@ -9,7 +9,7 @@
<section class="root z-10">
{#if show}
<div class="relative h-full bg-white dark:bg-gray-800">
<div class="relative h-full bg-white dark:bg-black">
<slot />
</div>
{/if}
src/lib/components/CourseLandingPage/components/Editor/index.svelte
+1 -1
View File
@@ -121,7 +121,7 @@
<aside
class={`${
show ? '-translate-x-[100%] fixed z-[9999]' : 'translate-x-0 fixed z-[9999]'
} left-0 transition w-[280px] min-w-[280px] bg-gray-100 dark:bg-gray-800 h-full border border-l-0 border-t-0 border-b-0 border-r-1`}
} left-0 transition w-[280px] min-w-[280px] bg-gray-100 dark:bg-black h-full border border-l-0 border-t-0 border-b-0 border-r-1`}
>
<div class="toggler rounded-full shadow-lg absolute">
<IconButton
src/lib/components/CourseLandingPage/index.svelte
+2 -2
View File
@@ -91,7 +91,7 @@
<title>{get(courseData, 'title', '')}</title>
</svelte:head>
<div class="w-full bg-white dark:bg-gray-800 flex flex-col items-center">
<div class="w-full bg-white dark:bg-black flex flex-col items-center">
<!-- Header Section -->
<header id="header" class="banner w-full flex items-center justify-center p-">
<div class="md:w-5/6 w-full flex items-center justify-between flex-col-reverse md:flex-row">
@@ -160,7 +160,7 @@
</header>
<PricingSection className="md:hidden" {courseData} {editMode} bind:startCoursePayment />
<!-- Body -->
<div class="bg-white dark:bg-gray-800 w-full">
<div class="bg-white dark:bg-black w-full">
<div
class="py-8 lg:w-11/12 w-full m-2 lg:m-auto flex flex-col-reverse lg:flex-row items-center lg:items-start justify-between max-w-[1200px]"
>
src/lib/components/Courses/components/Card/Loader.svelte
+1 -1
View File
@@ -3,7 +3,7 @@
</script>
<div
class="root w-72 border bg-gray-100 dark:bg-gray-800 mr-4 mb-4 rounded-md transition ease-in-out relative"
class="root w-72 border bg-gray-100 dark:bg-black mr-4 mb-4 rounded-md transition ease-in-out relative"
>
<SkeletonPlaceholder style="width: 100%; height: 10rem;" />
<div class="p-3 pb-0">
src/lib/components/Dropdown/index.svelte
+1 -1
View File
@@ -42,7 +42,7 @@
{#if open}
<div
class="dropdown whitespace-nowrap bg-white dark:bg-gray-800 border border-grey rounded-lg mt-2 py-3 absolute"
class="dropdown whitespace-nowrap bg-white dark:bg-black border border-grey rounded-lg mt-2 py-3 absolute"
>
{#each options as option, index}
<button
src/lib/components/Expandable/index.svelte
+1 -1
View File
@@ -20,7 +20,7 @@
}
</script>
<div {id} class="w-full bg-white dark:bg-gray-800 {rootClass}">
<div {id} class="w-full bg-white dark:bg-black {rootClass}">
<button
class="w-full relative flex items-center justify-between {!disableContainerPadding && 'p-5'}"
tabindex="0"
src/lib/components/Form/Select.svelte
+1 -1
View File
@@ -28,7 +28,7 @@
class:customColor={!!selectClassName}
>
{#each options as option}
<option class="bg-white dark:bg-gray-800 text-black" value={option}>
<option class="bg-white dark:bg-black text-black" value={option}>
{option[labelKey]}
</option>
{/each}
src/lib/components/LMS/SideBar.svelte
+1 -1
View File
@@ -55,7 +55,7 @@
$menu.hidden
? '-translate-x-[100%] absolute md:translate-x-0 md:relative z-40'
: 'translate-x-0 absolute md:relative z-40'
} overflow-y-auto transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-gray-700 h-[calc(100vh-48px)]`}
} overflow-y-auto transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-black h-[calc(100vh-48px)]`}
>
<div class="h-full flex flex-col">
<div class="border-b border-gray-200 pt-5 px-4">
src/lib/components/LMS/components/Learning.svelte
+1 -1
View File
@@ -15,7 +15,7 @@
<section class="h-full mt-10 mb-20 xl:mt-2">
<p class="text-base font-semibold text-[#040F2D] pb-3 dark:text-white">Currently Learning</p>
<div
class="flex items-center flex-col border border-[#EAEAEA] dark:bg-gray-700 gap-2 rounded w-full h-fit xl:h-[516px] p-3"
class="flex items-center flex-col border border-[#EAEAEA] dark:bg-neutral-800 gap-2 rounded w-full h-fit xl:h-[516px] p-3"
>
{#if courseInProgress.length > 0}
<div class="w-full h-full xl:h-[516px] flex flex-col justify-start">
src/lib/components/LMS/components/Student.svelte
+1 -1
View File
@@ -31,7 +31,7 @@
<p class="text-base font-semibold text-[#040F2D] pb-3 dark:text-white">Your Schedule</p>
<div
class="flex items-center flex-col border border-[#EAEAEA] dark:bg-gray-700 rounded w-full h-fit xl:h-[516px] p-3"
class="flex items-center flex-col border border-[#EAEAEA] dark:bg-neutral-800 rounded w-full h-fit xl:h-[516px] p-3"
>
<div class="w-full h-fit hidden xl:flex items-center justify-center">
<InlineCalendar bind:store {theme} />
src/lib/components/Modal/index.svelte
+1 -1
View File
@@ -31,7 +31,7 @@
<div
class="{maxWidth || 'container'} {size === 'sm'
? 'small'
: ''} bg-white dark:bg-gray-800 mx-auto {width} shadow-lg p-5 pt-2 rounded-md"
: ''} bg-white dark:bg-black mx-auto {width} shadow-lg p-5 pt-2 rounded-md"
on:click={(e) => e.stopPropagation()}
role="presentation"
>
src/lib/components/Org/Community/Loader.svelte
+1 -1
View File
@@ -3,7 +3,7 @@
</script>
<div
class="h-[70px] w-full border border-gray-100 dark:bg-gray-700 mr-4 mb-4 mt-2 rounded-md transition ease-in-out relative flex pt-3 px-3"
class="h-[70px] w-full border border-gray-100 dark:bg-neutral-800 mr-4 mb-4 mt-2 rounded-md transition ease-in-out relative flex pt-3 px-3"
>
<div class="w-10 flex justify-evenly flex-col px-1 mr-2 rounded-md">
<SkeletonPlaceholder style="width: 100%; height: 40%; border-radius: 4px;" />
src/lib/components/Org/Community/index.svelte
+1 -1
View File
@@ -62,7 +62,7 @@
</script>
<div
class="flex items-center justify-center lg:justify-start flex-wrap my-4 m-auto border-c rounded bg-gray-100 dark:bg-gray-700"
class="flex items-center justify-center lg:justify-start flex-wrap my-4 m-auto border-c rounded bg-gray-100 dark:bg-neutral-800"
>
{#if isLoading}
<CommunityLoader />
src/lib/components/Org/Quiz/Loader.svelte
+1 -1
View File
@@ -3,7 +3,7 @@
</script>
<div
class="root w-full border border-gray-100 dark:bg-gray-700 mr-4 mb-4 rounded-md transition ease-in-out relative flex p-3"
class="root w-full border border-gray-100 dark:bg-neutral-800 mr-4 mb-4 rounded-md transition ease-in-out relative flex p-3"
>
<SkeletonPlaceholder style="width: 20%; height: 100%;" />
<div class="w-full mx-5 flex justify-evenly flex-col">
src/lib/components/Org/Quiz/Play/ConnectToPlay.svelte
+2 -9
View File
@@ -32,10 +32,7 @@
<PlayHeader startCount={true} showCountDown={true} />
</div>
<div
slot="body"
class="w-full rounded-md bg-white dark:bg-gray-700 py-7 px-5"
>
<div slot="body" class="w-full rounded-md bg-white dark:bg-neutral-800 py-7 px-5">
<div class="mb-3">
<p>1. Visit</p>
<h3>play.classroomio.com</h3>
@@ -52,10 +49,6 @@
<div slot="footer" class="flex justify-center items-center">
<p class="font-bold mr-3">Let's go</p>
<PrimaryButton
label="View Players"
variant={VARIANTS.OUTLINED}
onClick={goToPlayersStep}
/>
<PrimaryButton label="View Players" variant={VARIANTS.OUTLINED} onClick={goToPlayersStep} />
</div>
</PlayContainer>
src/lib/components/Org/Quiz/Play/Container.svelte
+1 -1
View File
@@ -15,7 +15,7 @@
{#if $$slots.footer}
<!-- FOOTER -->
<div class="footer bg-white dark:bg-gray-700 py-6 px-2 m-auto">
<div class="footer bg-white dark:bg-neutral-800 py-6 px-2 m-auto">
<slot name="footer" />
</div>
{/if}
src/lib/components/Org/Quiz/QuizCard.svelte
+1 -1
View File
@@ -56,7 +56,7 @@
{#if quiz}
<div
class="root w-full border hover:shadow-2xl transition ease-in-out rounded-lg bg-gray-100 dark:bg-gray-800 mb-5 relative flex flex-col lg:flex-row p-3"
class="root w-full border hover:shadow-2xl transition ease-in-out rounded-lg bg-gray-100 dark:bg-black mb-5 relative flex flex-col lg:flex-row p-3"
>
<ImageLoader
src={themeImages[quiz.theme]?.card || themeImages.standard.card}
src/lib/components/Org/Quiz/QuizQuestion.svelte
+1 -1
View File
@@ -29,7 +29,7 @@
<!-- Options -->
<div class="flex justify-between w-full flex-wrap">
{#each currentQuestion.options || [] as option}
<div class="w-2/5 bg-white dark:bg-gray-700 rounded p-5 mb-5 relative">
<div class="w-2/5 bg-white dark:bg-neutral-800 rounded p-5 mb-5 relative">
<img src={optionImage[option.id]} alt={option.id} />
{#if isPreview}
src/lib/components/Org/SideBar.svelte
+1 -1
View File
@@ -63,7 +63,7 @@
$menu.hidden
? '-translate-x-[100%] absolute md:translate-x-0 md:relative z-40'
: 'translate-x-0 absolute md:relative z-40'
} overflow-y-auto transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-gray-800 h-[calc(100vh-48px)] border border-l-0 border-t-0 border-b-0 border-r-1`}
} overflow-y-auto transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-black h-[calc(100vh-48px)] border border-l-0 border-t-0 border-b-0 border-r-1`}
>
<div class="h-full flex flex-col">
<div class="border-b border-gray-200 pt-5 px-4">
src/lib/components/PageBody/index.svelte
+1 -1
View File
@@ -10,7 +10,7 @@
<div class="root mt-4 mx-auto {width} {className} relative {padding}">
{#if $$slots.header}
<div
class="head dark:bg-gray-800 flex items-center justify-between sticky right-0 w-full px-3 {headerClassName}"
class="head dark:bg-black flex items-center justify-between sticky right-0 w-full px-3 {headerClassName}"
>
<slot name="header" />
</div>
src/lib/components/PageNav/index.svelte
+2 -2
View File
@@ -20,7 +20,7 @@
</script>
<div
class="header dark:bg-gray-800 bg-white flex items-center justify-between {!disableSticky &&
class="header dark:bg-black bg-white flex items-center justify-between {!disableSticky &&
'sticky'} {paddingClass} {dynamicRootClass}"
style={overidableStyle}
>
@@ -29,7 +29,7 @@
{#if !enterEditTitleMode}
<button class="w-full" on:click={() => (enterEditTitleMode = true)}>
<h4
class="editable-title hover:bg-gray-100 dark:bg-gray-800 px-3 rounded-md overflow-ellipsis"
class="editable-title hover:bg-gray-100 dark:bg-black px-3 rounded-md overflow-ellipsis"
>
{title}
</h4>
src/lib/components/QuestionContainer/index.svelte
+1 -1
View File
@@ -25,7 +25,7 @@
<div
bind:this={ref}
class="bg-white dark:bg-gray-800 border-2 {hasError
class="bg-white dark:bg-black border-2 {hasError
? 'border-red-700'
: 'border-gray hover:border-primary-700'} rounded-md mb-6 relative root"
>
src/lib/utils/constants/reusableClass.js
+2 -2
View File
@@ -1,6 +1,6 @@
export const NavClasses = {
active:
'bg-gray-200 dark:bg-gray-700 hover:dark:text-white text-black dark:text-white transition delay-150 duration-300 ease-in-out',
'bg-gray-200 dark:bg-neutral-800 hover:dark:text-white text-black dark:text-white transition delay-150 duration-300 ease-in-out',
background: '',
item: 'hover:bg-gray-200 dark:hover:bg-gray-700 hover:text-black hover:dark:text-white rounded'
item: 'hover:bg-gray-200 dark:hover:bg-neutral-800 hover:text-black hover:dark:text-white rounded'
};
src/routes/+error.svelte
+1 -1
View File
@@ -17,7 +17,7 @@
</svelte:head>
<div
class="error-container m-auto flex flex-col-reverse lg:flex-row md:flex-col-reverse items-center justify-center h-full py-10 dark:bg-gray-800"
class="error-container m-auto flex flex-col-reverse lg:flex-row md:flex-col-reverse items-center justify-center h-full py-10 dark:bg-black"
>
<div class="md:w-full p-2 lg:w-2/4">
<h2 class="w-full text-lg lg:text-3xl font-medium lg:font-normal">
src/routes/+layout.svelte
+3 -3
View File
@@ -287,7 +287,7 @@
{:else if data.isOrgSite && !path}
<OrgLandingPage orgSiteName={data.orgSiteName} org={data.org} />
{:else}
<main class="dark:bg-gray-800">
<main class="dark:bg-black">
{#if $navigating && $delayedPreloading}
<Backdrop>
<Moon size="60" color="#1d4ed8" unit="px" duration="1s" />
@@ -315,14 +315,14 @@
{#if !isQuizPage($page.url.pathname)}
<OrgSideBar />
{/if}
<div class="org-slot bg-white dark:bg-gray-800 w-full">
<div class="org-slot bg-white dark:bg-black w-full">
<slot />
</div>
</div>
{:else if isLMSPage($page.url.pathname)}
<div class="org-root w-full flex items-center justify-between">
<LMSSideBar />
<div class="org-slot bg-white dark:bg-gray-800 w-full">
<div class="org-slot bg-white dark:bg-black w-full">
<slot />
</div>
</div>
src/routes/+page.svelte
+1 -1
View File
@@ -90,7 +90,7 @@
<div class="flex flex-col md:flex-row">
{#each areas as area, index}
<div
class="box m-3 bg-white dark:bg-gray-800 rounded-md py-3 px-12 active shadow-xl border-2 hover:border-primary-700 {animate}"
class="box m-3 bg-white dark:bg-black rounded-md py-3 px-12 active shadow-xl border-2 hover:border-primary-700 {animate}"
>
<h3 class="dark:text-white text-3xl">
{#if index === 0}
src/routes/courses/[id]/lessons/+page.svelte
+1 -1
View File
@@ -133,7 +133,7 @@
>
{#each $lessons as lesson (lesson.id)}
<div
class="sm:min-h-[245px] md:min-h-[100px] lg:min-h-[190px] relative m-auto rounded-md border-2 border-gray-200 py-3 px-5 mb-4 flex items-center dark:bg-gray-700"
class="sm:min-h-[245px] md:min-h-[100px] lg:min-h-[190px] relative m-auto rounded-md border-2 border-gray-200 py-3 px-5 mb-4 flex items-center dark:bg-neutral-800"
>
<div class="mr-5">
<TextChip
src/routes/courses/[id]/lessons/[...lessonParams]/+page.svelte
+1 -1
View File
@@ -190,7 +190,7 @@
<div
class={`flex-row ${
$apps.dropdown && $apps.open
? 'absolute lg:relative top-[85px] lg:top-0 right-14 lg:right-0 z-40 dark:bg-gray-800 p-3 lg:p-0'
? 'absolute lg:relative top-[85px] lg:top-0 right-14 lg:right-0 z-40 dark:bg-black p-3 lg:p-0'
: 'hidden'
} lg:flex items-center`}
>
src/routes/courses/[id]/submissions/+page.svelte
+2 -2
View File
@@ -248,7 +248,7 @@
<div class="flex items-center w-full overflow-x-scroll">
{#each sections as { id, title, items }, idx (id)}
<div
class="section rounded-md bg-gray-100 dark:bg-gray-800 border border-gray-50 p-3 h-80 mr-3 overflow-hidden"
class="section rounded-md bg-gray-100 dark:bg-black border border-gray-50 p-3 h-80 mr-3 overflow-hidden"
animate:flip={{ duration: flipDurationMs }}
>
<div class="flex items-center mb-2">
@@ -269,7 +269,7 @@
<div
class="border {item.isEarly
? 'border-grey-700'
: 'border-red-700'} w-full my-2 mx-0 rounded-md bg-white dark:bg-gray-800 py-3 px-3"
: 'border-red-700'} w-full my-2 mx-0 rounded-md bg-white dark:bg-black py-3 px-3"
animate:flip={{ duration: flipDurationMs }}
>
<a
src/routes/dashboard/+page.svelte
+1 -1
View File
@@ -123,7 +123,7 @@
<title>Dashboard - ClassroomIO</title>
</svelte:head>
<section class="root w-full py-10 bg-gray-100 dark:bg-gray-700">
<section class="root w-full py-10 bg-gray-100 dark:bg-neutral-800">
<div class="calendar-root flex mx-2">
{#if !$isMobile}
<div id="calendar">
src/routes/lms/+page.svelte
+1 -1
View File
@@ -49,7 +49,7 @@
<Learning />
</div>
<div
class="flex items-center justify-center border border-[#EAEAEA] dark:bg-gray-700 gap-2 rounded w-full xl:w-[400px] h-fit xl:h-[516px] overflow-y-auto p-3 xl:mt-11"
class="flex items-center justify-center border border-[#EAEAEA] dark:bg-neutral-800 gap-2 rounded w-full xl:w-[400px] h-fit xl:h-[516px] overflow-y-auto p-3 xl:mt-11"
>
<div
class="w-full h-full flex flex-col sm:flex-row xl:flex-col items-center justify-between md:items-center xl:items-start gap-5 md:justify-around"
src/routes/lms/exercises/+page.svelte
+1 -1
View File
@@ -161,7 +161,7 @@
<div class="flex items-center w-full">
{#each sections as { id, title, items, className }, idx (id)}
<div
class="min-w-[355px] max-w-[355px] h-[516px] rounded-md bg-gray-100 dark:bg-gray-800 border border-gray-50 p-3 mr-3 overflow-hidden"
class="min-w-[355px] max-w-[355px] h-[516px] rounded-md bg-gray-100 dark:bg-black border border-gray-50 p-3 mr-3 overflow-hidden"
animate:flip={{ duration: flipDurationMs }}
>
<div class="flex items-center mb-2 gap-2">
src/routes/onboarding/+page.svelte
+1 -1
View File
@@ -213,7 +213,7 @@
<!-- Loggedin Email -->
<div
class="w-64 flex items-center justify-center mb-6 py-6 bg-gray-100 dark:bg-gray-700 rounded-2xl border border-gray-300"
class="w-64 flex items-center justify-center mb-6 py-6 bg-gray-100 dark:bg-neutral-800 rounded-2xl border border-gray-300"
>
<UserProfileIcon />
<p class="dark:text-white text-sm ml-2">{$profile.email}</p>
src/routes/org/[slug]/quiz/[slug]/+page.svelte
+3 -3
View File
@@ -38,7 +38,7 @@
function activeClass(q, cq) {
if (q.id === cq.id) {
return 'bg-gray-200 dark:bg-gray-800';
return 'bg-gray-200 dark:bg-black';
}
return '';
}
@@ -196,7 +196,7 @@
<section class="w-screen h-full flex justify-between">
<!-- Questions list -->
<aside class="root w-1/5 p-4 bg-gray-100 dark:bg-gray-700 h-full">
<aside class="root w-1/5 p-4 bg-gray-100 dark:bg-neutral-800 h-full">
<div class="h-full flex flex-col">
<a
class="text-gray-500 dark:text-white text-md flex items-center"
@@ -275,7 +275,7 @@
</div>
<!-- Quiz Settings -->
<aside class="settings w-1/5 p-4 bg-gray-100 dark:bg-gray-700 h-full">
<aside class="settings w-1/5 p-4 bg-gray-100 dark:bg-neutral-800 h-full">
<div class="py-5">
<h5>Quiz settings</h5>
<PrimaryButton