LobotomyLabs/classquiz-ai
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🐛 Fixed wrong div

Browse Source
This commit is contained in:
Mawoka
2022-04-14 16:33:34 +02:00
parent d27d4bfe5f
commit 88e63e63fa
1 changed files with 45 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/landing/landing-promo.svelte
+33 -35
View File
@@ -1,4 +1,4 @@
<script lang="ts"> <script lang='ts'>
/* /*
import AdminOverviewScreenshot from '$lib/assets/landing/admin_overview.png'; import AdminOverviewScreenshot from '$lib/assets/landing/admin_overview.png';
import SelectScreenshot from '$lib/assets/landing/select.webp'; import SelectScreenshot from '$lib/assets/landing/select.webp';
@@ -14,29 +14,29 @@
let teacherTab = false; let teacherTab = false;
</script> </script>
<div class="grid grid-cols-1 overflow-hidden h-fit"> <div class='grid grid-cols-1 overflow-hidden h-fit'>
{#if teacherTab} {#if teacherTab}
<div class="h-fit"> <div class='h-fit'>
<!-- <h1 class='text-5xl marck-script text-center pt-4'>Teacher</h1>--> <!-- <h1 class='text-5xl marck-script text-center pt-4'>Teacher</h1>-->
<div class="grid lg:grid-cols-2 grow pt-4 transition ease-in-out"> <div class='grid lg:grid-cols-2 grow pt-4 transition ease-in-out'>
<h1 class="text-center text-3xl marck-script">1: Create or Import</h1> <h1 class='text-center text-3xl marck-script'>1: Create or Import</h1>
<h1 class="text-center text-3xl marck-script hidden lg:block"> <h1 class='text-center text-3xl marck-script hidden lg:block'>
2: See all your quizzes 2: See all your quizzes
</h1> </h1>
<!-- <h1 class='text-center text-3xl marck-script'>3: See how many were right or wrong</h1>--> <!-- <h1 class='text-center text-3xl marck-script'>3: See how many were right or wrong</h1>-->
<div class="flex justify-center"> <div class='flex justify-center'>
<img src={ImportSelectMockup} class="w-4/6 align-top" alt="Select answer" /> <img src={ImportSelectMockup} class='w-4/6 align-top' alt='Select answer' />
</div> </div>
<h1 class="text-center text-3xl marck-script lg:hidden block"> <h1 class='text-center text-3xl marck-script lg:hidden block'>
2: See all your quizzes 2: See all your quizzes
</h1> </h1>
<div class="flex justify-center"> <div class='flex justify-center'>
<img <img
src={OverviewMockup} src={OverviewMockup}
class="w-4/6 align-top" class='w-4/6 align-top'
alt="See right and wrong solutions" alt='See right and wrong solutions'
/> />
</div> </div>
<!-- <div class='flex justify-center'>--> <!-- <div class='flex justify-center'>-->
@@ -49,51 +49,49 @@
</div> </div>
</div> </div>
{:else} {:else}
<div class="h-fit"> <div class='h-fit'>
<!-- <h1 class='text-5xl marck-script text-center pt-4'>Student</h1>--> <!-- <h1 class='text-5xl marck-script text-center pt-4'>Student</h1>-->
<div class="grid lg:grid-cols-3 grow pt-4 transition ease-in-out"> <div class='grid lg:grid-cols-3 grow pt-4 transition ease-in-out'>
<h1 class="text-center text-3xl marck-script">1: Answer</h1> <h1 class='text-center text-3xl marck-script'>1: Answer</h1>
<h1 class="text-center text-3xl marck-script lg:block hidden"> <h1 class='text-center text-3xl marck-script lg:block hidden'>
2: See what was right or wrong 2: See what was right or wrong
</h1> </h1>
<h1 class="text-center text-3xl marck-script lg:block hidden"> <h1 class='text-center text-3xl marck-script lg:block hidden'>
3: See how many were right or wrong 3: See how many were right or wrong
</h1> </h1>
<div class="flex justify-center"> <div class='flex justify-center'>
<img src={SelectMockup} class="w-4/6 align-top" alt="Select answer" /> <img src={SelectMockup} class='w-4/6 align-top' alt='Select answer' />
</div> </div>
<h1 class="text-center text-3xl marck-script lg:hidden block"> <h1 class='text-center text-3xl marck-script lg:hidden block'>
3: See how many were right or wrong 3: See how many were right or wrong
</h1> </h1>
<div class="flex justify-center"> <div class='flex justify-center'>
<div class="flex justify-center">
<img <img
src={SolutionMockup} src={SolutionMockup}
class="w-4/6 align-top" class='w-4/6 align-top'
alt="See right and wrong solutions" alt='See right and wrong solutions'
/> />
</div> </div>
<h1 class="text-center text-3xl marck-script lg:hidden block"> <h1 class='text-center text-3xl marck-script lg:hidden block'>
3: See how many were right or wrong 3: See how many were right or wrong
</h1> </h1>
<div class="flex justify-center"> <div class='flex justify-center'>
<img <img
src={ResultsMockup} src={ResultsMockup}
class="w-4/6 align-top" class='w-4/6 align-top'
alt="See results in comparison with other players" alt='See results in comparison with other players'
/> />
</div> </div>
</div> </div>
</div> </div>
</div>
{/if} {/if}
<div class="w-full h-fit pt-4"> <div class='w-full h-fit pt-4'>
<div class="flex justify-center"> <div class='flex justify-center'>
<div class="flex justify-evenly lg:w-2/6"> <div class='flex justify-evenly lg:w-2/6'>
{#if teacherTab} {#if teacherTab}
<button <button
class="border border-blue-600 p-2 border-2 rounded hover:bg-gray-700 text-2xl" class='border border-blue-600 p-2 border-2 rounded hover:bg-gray-700 text-2xl'
on:click={() => { on:click={() => {
teacherTab = true; teacherTab = true;
}} }}
@@ -101,7 +99,7 @@
</button> </button>
{:else} {:else}
<button <button
class="border border-black p-2 border-2 rounded hover:bg-gray-700 text-base" class='border border-black p-2 border-2 rounded hover:bg-gray-700 text-base'
class:border-black={!teacherTab} class:border-black={!teacherTab}
class:text-base={!teacherTab} class:text-base={!teacherTab}
on:click={() => { on:click={() => {
@@ -111,7 +109,7 @@
</button> </button>
{/if} {/if}
<button <button
class="border border-black p-2 border-2 rounded hover:bg-gray-700" class='border border-black p-2 border-2 rounded hover:bg-gray-700'
class:border-blue-600={!teacherTab} class:border-blue-600={!teacherTab}
class:text-2xl={!teacherTab} class:text-2xl={!teacherTab}
on:click={() => { on:click={() => {