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

CLASSROOMIO-T-145:Made the LMS dashboard responsive

Browse Source 
CLASSROOMIO-T-145: All done and ready

CLASSROOMIO-T-145: All done and ready

CLASSROOMIO-T-145: Fixed the Z-index issue

Merge branch 'main' into CLASSROOMIO-T-145

CLASSROOMIO-T-145: Finished implementing the responsive design for the Main dashboard and LMS dashboard

Merge branch 'main' into CLASSROOMIO-T-145

CLASSROOMIO-T-144:Updating the dashboard responsiveness ooth for LMS and the Main dashboard

CLASSROOMIO-T-144:Updated the dashboard responsiveness ooth for LMS and the Main dashboard

Merge branch 'main' into CLASSROOMIO-T-145

CLASSROOMIO-T-145:Made the LMS dashboard responsive


Co-authored-by: Ifeanyi Nwosu <[email protected]>


Merge-request: CLASSROOMIO-MR-66
Merged-by: Best Admin <[email protected]>
This commit is contained in:
emmanuel
2023-09-08 09:17:05 +00:00
committed by Space Cloud
parent 7523e6c3e7
commit 536a444193
25 changed files with 275 additions and 171 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/Org/SideBar.svelte
+14 -7
View File
@@ -53,14 +53,17 @@
return pagePath.includes(itemPath);
}
const toggleSidebar = () => {
$menu.hidden = !$menu.hidden;
};
</script>
<aside
class={` ${
class={`${
$menu.hidden
? '-translate-x-[100%] top-[48px] md:top-0 absolute md:translate-x-0 md:relative '
: 'translate-x-0 absolute md:relative top-[48px] md:top-0'
} transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-gray-800 h-full border border-l-0 border-t-0 border-b-0 border-r-1`}
? '-translate-x-[100%] absolute md:translate-x-0 md:relative z-[9999]'
: 'translate-x-0 absolute md:relative z-[9999]'
} transition w-[250px] min-w-[250px] bg-gray-100 dark:bg-gray-800 h-[calc(100vh-36px)] md:h-full 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">
@@ -80,7 +83,11 @@
<ul class="my-5">
{#each menuItems as menuItem}
<a href="{$currentOrgPath}{menuItem.path}" class="text-black no-underline">
<a
href="{$currentOrgPath}{menuItem.path}"
class="text-black no-underline"
on:click={toggleSidebar}
>
<li
class="flex items-center py-3 px-4 mb-2 {NavClasses.item} {isActive(
$page.url.pathname,
@@ -110,13 +117,13 @@
</div>
<span class="flex-grow" />
<ul class="my-5 pb-5 px-4">
<a href={$currentOrgPath} class="text-black no-underline">
<a href={$currentOrgPath} class="text-black no-underline" on:click={toggleSidebar}>
<li class="flex items-center py-3 px-4 mb-2 rounded">
<HelpIcon size={20} class="carbon-icon dark:text-white" />
<p class="dark:text-white ml-2">Help</p>
</li>
</a>
<a href="{$currentOrgPath}/settings" class="text-black no-underline">
<a href="{$currentOrgPath}/settings" class="text-black no-underline" on:click={toggleSidebar}>
<li
class="flex items-center py-3 px-4 mb-2 {NavClasses.item} {isActive(
$page.url.pathname,