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

CLASSROOMIO-T-3: Mobile improvments

Browse Source
This commit is contained in:
rotimi-best
2021-09-17 07:48:26 +03:00
parent 2edfee4990
commit 984a3d5e07
5 changed files with 41 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Course/components/Navigation/index.svelte
+10 -9
View File
@@ -204,7 +204,6 @@
value="toggle"
onClick={() => goto('/courses')}
buttonClassName="mx-3"
size={$isMobile ? 'large' : 'small'}
>
<Home32 class="carbon-icon" />
</IconButton>
@@ -218,12 +217,14 @@
<IconButton
value="toggle"
onClick={() => (show = !show)}
size="small"
toolTipProps={{
title: 'Toggle sidebar',
hotkeys: ['B'],
direction: 'right',
}}
size={$isMobile ? 'large' : 'small'}
toolTipProps={$isMobile
? {}
: {
title: 'Toggle sidebar',
hotkeys: ['B'],
direction: 'right',
}}
>
{#if show}
<ChevronLeft16 class="carbon-icon" />
@@ -279,7 +280,7 @@
.navItems {
height: 82%;
overflow-y: scroll;
overflow-y: auto;
}
.toggler {
@@ -293,7 +294,7 @@
@media (max-width: 760px) {
.root {
width: 95%;
width: 98%;
min-width: unset;
max-width: unset;
}
src/components/Snackbar/index.svelte
+22 -20
View File
@@ -36,32 +36,34 @@
</script>
{#if $snackbarStore.open}
<div
transition:fly={{ y: 200, duration: 500 }}
class="root text-white rounded-md flex justify-between items-center absolute {severityColor}"
>
<div class="flex items-center">
{#if $snackbarStore.severity === SNACKBAR_SEVERITY.SUCCESS}
<CheckmarkOutline24 class="carbon-icon" />
{:else if $snackbarStore.severity === SNACKBAR_SEVERITY.WARNING}
<Warning24 class="carbon-icon" />
{:else}
<Information24 class="carbon-icon" />
{/if}
<p class="ml-2 text-lg">{$snackbarStore.message}</p>
</div>
{#key $snackbarStore.message}
<div
transition:fly={{ x: 200, duration: 500 }}
class="root text-white rounded-md flex justify-between items-center absolute {severityColor}"
>
<div class="flex items-center">
{#if $snackbarStore.severity === SNACKBAR_SEVERITY.SUCCESS}
<CheckmarkOutline24 class="carbon-icon" />
{:else if $snackbarStore.severity === SNACKBAR_SEVERITY.WARNING}
<Warning24 class="carbon-icon" />
{:else}
<Information24 class="carbon-icon" />
{/if}
<p class="ml-2 text-lg">{$snackbarStore.message}</p>
</div>
<CloseButton onClick={handleClose} contained={true} color="text-white" />
</div>
<CloseButton onClick={handleClose} contained={true} color="text-white" />
</div>
{/key}
{/if}
<style>
.root {
font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
left: 50%;
right: auto;
bottom: 24px;
transform: translateX(-50%);
right: 5%;
left: auto;
top: 24px;
transform: translateX(-5%);
min-width: 288px;
padding: 6px 16px;
flex-wrap: wrap;