More themeing improvements

This commit is contained in:
Rotimi Best
2023-08-20 20:52:52 +01:00
parent f11522d82c
commit 81ff909dca
14 changed files with 25 additions and 19 deletions
@@ -3,6 +3,7 @@
import { goto } from '$app/navigation';
import { updateCourse } from '$lib/utils/services/courses';
import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
import { VARIANTS } from '$lib/components/PrimaryButton/constants';
import TextArea from '$lib/components/Form/TextArea.svelte';
import Professional from './certificates/Professional.svelte';
import Plain from './certificates/Plain.svelte';
@@ -68,6 +69,7 @@
</p>
<PrimaryButton
label="Go to Settings"
variant={VARIANTS.OUTLINED}
className="rounded-md mt-3"
onClick={() => goto(`org/${$currentOrg.siteName}/settings`)}
/>
@@ -24,7 +24,7 @@
<div class="">
<button
class="item relative flex items-center py-3 px-4 ml-2 mb-1 rounded hover:bg-gray-200 dark:hover:bg-gray-700 {isGroupActive &&
class="item relative flex items-center py-3 px-4 ml-2 mb-1 rounded hover:opacity-80 dark:hover:bg-gray-700 {isGroupActive &&
NavClasses.active} w-[95%]"
tabindex="0"
on:click={onClick}
@@ -197,7 +197,7 @@
aria-disabled={!item.is_unlocked}
>
<div
class="flex items-center py-3 px-4 rounded hover:bg-gray-200 dark:hover:bg-gray-800 w-full {(
class="flex items-center py-3 px-4 rounded hover:opacity-80 w-full {(
path || $page.url.pathname
).includes(item.id) && NavClasses.active}"
>
+3 -3
View File
@@ -68,7 +68,7 @@
{#each sideLinks as item (item.name)}
<a href={item.link} class="text-black">
<li
class="flex items-center py-3 px-4 mb-2 rounded hover:bg-gray-200 dark:hover:bg-gray-500 {isActive(
class="flex items-center py-3 px-4 mb-2 rounded hover:opacity-80 {isActive(
$page.url.pathname,
`${item.link}`
) && NavClasses.active}"
@@ -77,7 +77,7 @@
this={item.icon}
color={isActive($page.url.pathname, `${item.link}`) ? 'black' : 'gray'}
size={24}
class="carbon-icon text-white"
class="carbon-icon "
/>
<p class="dark:text-white ml-2">{item.name}</p>
</li>
@@ -95,7 +95,7 @@
</a>
<a href="/lms/settings" class="text-black">
<li
class="flex items-center py-3 px-4 mb-2 rounded {isActive(
class="flex items-center py-3 px-4 mb-2 rounded hover:opacity-80 {isActive(
$page.url.pathname,
`/lms/settings`
) && NavClasses.active}"
@@ -38,7 +38,9 @@
{#if data.inProgress}
<div class="flex items-center gap-2">
<div class=" relative bg-[#EAEAEA] w-full h-1">
<div class={`absolute top-0 left-0 bg-[#0233BD] h-full ${data.progress} ]`} />
<div
class={`absolute top-0 left-0 bg-primary-700 h-full ${data.progress} ]`}
/>
</div>
<p class="text-xs text-[#656565] dark:text-white">{data.progressRate}%</p>
</div>
@@ -41,7 +41,9 @@
{#if data.inProgress}
<div class="flex items-center gap-2">
<div class=" relative bg-[#EAEAEA] w-full h-1">
<div class={`absolute top-0 left-0 bg-[#0233BD] h-full ${data.progress} ]`} />
<div
class={`absolute top-0 left-0 bg-primary-700 h-full ${data.progress} ]`}
/>
</div>
<p class="text-xs text-[#656565] dark:text-white">{data.progressRate}%</p>
</div>
@@ -38,7 +38,9 @@
{#if data.inProgress}
<div class="flex items-center gap-2">
<div class=" relative bg-[#EAEAEA] w-full h-1">
<div class={`absolute top-0 left-0 bg-[#0233BD] h-full ${data.progress} ]`} />
<div
class={`absolute top-0 left-0 bg-primary-700 h-full ${data.progress} ]`}
/>
</div>
<p class="text-xs text-[#656565] dark:text-white">{data.progressRate}%</p>
</div>
@@ -37,7 +37,7 @@
/>
</span>
<div class="relative bg-[#EAEAEA] w-full h-1">
<div class={`absolute top-0 left-0 bg-[#0233BD] h-full ${data.progress} ]`} />
<div class={`absolute top-0 left-0 bg-primary-700 h-full ${data.progress} ]`} />
</div>
</div>
{/each}
@@ -61,15 +61,11 @@
<p class="text-lg font-semibold text-[#262626] dark:text-white">
The essence of design collaboration
</p>
<a href="#" class="text-sm font-normal text-[#0233BD] dark:text-white"
<a href="#" class="text-sm font-normal text-primary-700 dark:text-white"
>Figma Introduction</a
>
</span>
<PrimaryButton
label="Join Call"
variant={VARIANTS.OUTLINED}
className="bg-transparent outline-1 outline-[#0233BD] text-[#0233BD] rounded-md hover:bg-[blue]"
/>
<PrimaryButton label="Join Call" variant={VARIANTS.OUTLINED} className="" />
</div>
</span>
{:else}
+1 -1
View File
@@ -21,7 +21,7 @@
}
</script>
<nav class="{navClass} flex w-full p-2 md:px-6 bg-primary-600">
<nav class="{navClass} flex w-full p-2 md:px-6 bg-primary-700">
<ul class="flex w-full items-center">
<div class="">
<a href={$page.url.pathname} title="Go to ClassroomIO Home" id="logo" class="text-lg">
+2 -2
View File
@@ -77,7 +77,7 @@
{#each menuItems as menuItem}
<a href="{$currentOrgPath}{menuItem.path}" class="text-black no-underline">
<li
class="flex items-center py-3 px-4 mb-2 rounded hover:bg-primary-200 dark:hover:bg-gray-700 {isActive(
class="flex items-center py-3 px-4 mb-2 rounded hover:opacity-80 {isActive(
$page.url.pathname,
`${$currentOrgPath}${menuItem.path}`
) && NavClasses.active}"
@@ -114,7 +114,7 @@
</a>
<a href="{$currentOrgPath}/settings" class="text-black no-underline">
<li
class="flex items-center py-3 px-4 mb-2 rounded {isActive(
class="flex items-center py-3 px-4 mb-2 rounded hover:opacity-80 {isActive(
$page.url.pathname,
`${$currentOrgPath}/settings`
) && NavClasses.active}"
+1
View File
@@ -150,6 +150,7 @@ export async function getCourseBySiteName(siteName) {
name: 'ClassroomIO',
shortName: '',
siteName: '',
theme: '',
avatar_url: '/logo-192.png'
});
currentOrg.set(org);
+1
View File
@@ -247,6 +247,7 @@
$appStore.isOrgSite = data.isOrgSite;
currentOrg.set(data.org);
setTheme(data.org.theme);
}
return () => {
+1 -1
View File
@@ -20,7 +20,7 @@
<div class="m-5">
<h1 class="text-3xl font-semibold">Dashboard</h1>
<div
class="w-full h-fit lg:h-[265px] flex md:items-center justify-between flex-col-reverse md:flex-row p-5 lg:p-10 rounded-md bg-[#042172] my-2"
class="w-full h-fit lg:h-[265px] flex md:items-center justify-between flex-col-reverse md:flex-row p-5 lg:p-10 rounded-md bg-primary-900 my-2"
>
<span>
<p class="w-full md:w-[75%] lg:w-[80%] text-white text-xs lg:text-xl font-normal mb-5">