added card view to learning page
This commit is contained in:
Patryk Hegenberg
parent
a19e40f205
commit
4991e28180
4 changed files with 116 additions and 69 deletions
|
|
@ -1,3 +1,9 @@
|
|||
<?php
|
||||
$heading = "Learn";
|
||||
require "views/learn.view.php";
|
||||
$heading = "Learn";
|
||||
|
||||
session_start();
|
||||
if(!isset($_SESSION["username"])){
|
||||
header("Location: /");
|
||||
exit;
|
||||
}
|
||||
require "views/learn.view.php";
|
||||
|
|
|
|||
|
|
@ -1,9 +1,5 @@
|
|||
<?php
|
||||
$heading = "profile";
|
||||
$username = "MatheApp";
|
||||
$password = "password";
|
||||
$config = require('config.php');
|
||||
$db = new Database($config['database'], $username, $password);
|
||||
|
||||
session_start();
|
||||
if(!isset($_SESSION["username"])){
|
||||
|
|
|
|||
|
|
@ -1,68 +1,113 @@
|
|||
<?php require('partials/head.php') ?>
|
||||
<?php require('partials/nav.php') ?>
|
||||
<?php require('partials/banner.php') ?>
|
||||
<main>
|
||||
<div class="isolate bg-white my-10">
|
||||
<main>
|
||||
<div class="relative px-6 lg:px-8 min-h-screen">
|
||||
<div class="mx-auto max-w-7xl py-6 sm:px-6 lg:px-8">
|
||||
<div class="p-10 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-4 gap-5">
|
||||
|
||||
<!--Card 1-->
|
||||
<div class="rounded overflow-hidden shadow-lg">
|
||||
<img class="w-full" src="images/michal-matlon-4ApmfdVo32Q-unsplash.jpg" alt="Addieren">
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2">Addition</div>
|
||||
<p class="text-gray-700 text-base">
|
||||
Übe das Addieren.
|
||||
</p>
|
||||
<a href="/addition">
|
||||
<button type="button" class=" inline-block px-6 py-2.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">Los geht's</button>
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 1</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="px-6 pt-4 pb-2">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 2-->
|
||||
<div class="rounded overflow-hidden shadow-lg">
|
||||
<img class="w-full" src="/images/annie-spratt-Y-JCyxFMXbc-unsplash.jpg" alt="Subtrahieren">
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2">Subtraktion</div>
|
||||
<p class="text-gray-700 text-base">
|
||||
Übe das Subtrahieren.
|
||||
</p>
|
||||
<button type="button" class=" inline-block px-6 py-2.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">Los geht's</button>
|
||||
</div>
|
||||
<div class="px-6 pt-4 pb-2">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 2</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 3-->
|
||||
<div class="rounded overflow-hidden shadow-lg">
|
||||
<img class="w-full" src="/images/gayatri-malhotra-4wF66_KWJxA-unsplash.jpg" alt="Multiplikation">
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2">Multiplikation</div>
|
||||
<p class="text-gray-700 text-base">
|
||||
Übe das Multiplizieren.
|
||||
</p>
|
||||
<button type="button" class=" inline-block px-6 py-2.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">Los geht's</button>
|
||||
</div>
|
||||
<div class="px-6 pt-4 pb-2">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 3</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded overflow-hidden shadow-lg">
|
||||
<img class="w-full" src="/images/annie-spratt-ORDz1m1-q0I-unsplash.jpg" alt="Division">
|
||||
<!--Card 4-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2">Division</div>
|
||||
<p class="text-gray-700 text-base">
|
||||
Übe das Dividieren.
|
||||
</p>
|
||||
<button type="button" class=" inline-block px-6 py-2.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">Los geht's</button>
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 4</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="px-6 pt-4 pb-2">
|
||||
</div>
|
||||
|
||||
<!--Card 5-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 5</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 6-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 6</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 7-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 7</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 8-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 8</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 9-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 9</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Card 10-->
|
||||
<div class="nes-container rounded ">
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2 text-center">1 x 10</div>
|
||||
<a href="/1x1">
|
||||
<button type="button" class="nes-btn is-primary inline-block px-6 py-2.5 ">Los geht's</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
<?php require('partials/footer.php') ?>
|
||||
</main>
|
||||
<?php require('partials/footer.php') ?>
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="nes-container with-title flex-col mt-10 space-y-4">
|
||||
<div class="nes-container with-title mt-10 space-y-4">
|
||||
<span class="title">Dein Fortschritt <?php $_SESSION['xp'] ?> </span>
|
||||
|
||||
<span>Du bist aktuell Level: <?php echo $_SESSION['level'] ?> </span>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue