diff --git a/app/core/Database.php b/app/core/DBHandle.php similarity index 97% rename from app/core/Database.php rename to app/core/DBHandle.php index 52631b1..9607c1e 100644 --- a/app/core/Database.php +++ b/app/core/DBHandle.php @@ -1,16 +1,16 @@ view('template/header', ['title' => $title]); ?> +

Hello world

This is a message from the view

-

\ No newline at end of file +

+ +view('template/footer'); ?> \ No newline at end of file diff --git a/app/view/template/footer.php b/app/view/template/footer.php index c58e1d4..56d5110 100644 --- a/app/view/template/footer.php +++ b/app/view/template/footer.php @@ -1,14 +1,11 @@ - - + + + \ No newline at end of file diff --git a/app/view/template/header.php b/app/view/template/header.php index 66ff18d..7381f3b 100644 --- a/app/view/template/header.php +++ b/app/view/template/header.php @@ -6,75 +6,34 @@ <?=htmlspecialchars($title);?> – Stafett for livet - - + -
- -
- - -
-
- Logg ut -
Inlogget som:
-
+ - -
+ -
- + + + + +
+ + -
- 0)) { - foreach ($_SESSION['alert'] as $alert) { - switch ($alert[0]) { - case 'success': - $prefix = 'Suksess –'; - break; - - case 'info': - $prefix = 'Info –'; - break; - - case 'warning': - $prefix = 'Varsel –'; - break; - - case 'danger': - $prefix = 'Error –'; - break; - - default: - $alert[0] = 'danger'; - $prefix = 'Ukjent –'; - break; - } - echo('
'.$prefix.' '.$alert[1].'
'); - } - $_SESSION['alert'] = []; - } - ?> -
+ + +
diff --git a/public/index.php b/public/index.php index cac92ce..3059008 100644 --- a/public/index.php +++ b/public/index.php @@ -12,5 +12,6 @@ $username = $model->getUsername(); // Display view with retrieved data $contr->view('index', [ + "title" => "Forside", "data" => $username ]); \ No newline at end of file diff --git a/public/static/style/main.css b/public/static/style/main.css index faab8f5..61c3fb7 100644 --- a/public/static/style/main.css +++ b/public/static/style/main.css @@ -1,124 +1,114 @@ +html, body { + height: 100%; +} body { + display: flex; + flex-flow: column; + background: #eee; color: #222; - font-size: 14px; + font-size: 1rem; font-family: "Liberation Sans", Arial, sans-serif; line-height: 1.5; margin: 0; } -h1, h2, h3, h4 { - margin: 0; +.hidden { display: none; } + +h1 { border-bottom: 1px solid #aaa; - margin-bottom: 12px; -} - -.navbar-top { - padding: 12px; - background: #472987; - /*background: linear-gradient(0deg, rgba(71,40,134,1) 0%, rgba(81,24,195,1) 100%);*/ -} -.navbar-top .inner { - max-width: 900px; - margin: 0 auto; -} -.navbar-top .inner a { - color: #f8f8f8; - text-decoration: none; -} - -.login-statusbar { - border-top: 2px solid #f8f8f8; - background: rgb(54,148,37); - background: linear-gradient(0deg, rgba(54,148,37,1) 0%, rgba(62,162,34,1) 50%, rgba(63,177,43,1) 100%); -} -.login-statusbar .inner { - max-width: 900px; - margin: 0 auto; - color: #f8f8f8; - font-weight: bold; - font-size: 12px; - padding-left: 12px; - padding-right: 12px; - padding-top: 4px; - padding-bottom: 4px; - text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); -} -.login-statusbar .inner > a { - color: #f8f8f8; -} - -.footer { - background: #d8d8d8; - border-top: 1px solid #aaa; - padding: 12px; - max-width: 888px; - margin: 0 auto; -} -.grid-container { - background: #fff; - - display: grid; - grid-template-columns: max-content auto; - grid-gap: 12px; - - max-width: 888px; - margin: 0 auto; - padding: 12px; -} - -.grid-container main img { - display: block; - max-width: 100%; - height: auto; - border: 1px solid #aaa; -} - -.grid-container .nav-links { - background: #eee; - border: 1px solid #aaa; - padding: 12px; -} -.grid-container .nav-links ul { margin: 0; - padding-left: 12px; } a { color: rgb(0, 0, 255); } -@media only screen and (max-width: 600px) { - .grid-container { - grid-template-columns: auto; +#header { + padding: 1rem; + padding-left: .75rem; + padding-right: .75rem; + background: #472987; +} +#header a { + color: #eee; + text-decoration: none; +} + +#menu { + background: #222; + color: #eee; + padding: .25rem; + padding-left: .75rem; + padding-right: .75rem; +} +#menu a { color: #eee; float: right; } +#menu span { float: left; } + +#container { + display: flex; + flex-grow: 1; +} + +#main { + padding: .75rem; + flex-grow: 1; +} +#main img { + display: block; + height: auto; + max-width: 100%; +} + +#nav { + background: #fff; + padding: .75rem; + line-height: 1.6; +} +#nav ul { + margin: 0; + padding-left: .75rem; +} + +@media only screen and (max-width: 40rem) { + #container { + flex-flow: column; } } -.alert { - padding: 8px; - margin-bottom: 8px; - border: 1px solid transparent; - border-radius: 2px; +#footer { + background: #fff; + padding: .75rem; } -.alert-info { +#footer small { + float: right; +} + +.alert { + padding: .5rem; + margin-bottom: .5rem; + border: 1px solid transparent; + border-radius: .15rem; +} +.alert.info { color: #0c5460; background-color: #d1ecf1; border-color: #62b1bd; background: linear-gradient(0deg, rgba(167,223,232,1) 0%, rgba(209,236,241,1) 100%); } -.alert-success { +.alert.success { color: #155724; background-color: #d4edda; border-color: #56bf6e; background: linear-gradient(0deg, rgba(165,227,180,1) 0%, rgba(212,237,218,1) 100%); } -.alert-danger { +.alert.danger { color: #721c24; background-color: #f8d7da; border-color: #c8848c; background: linear-gradient(0deg, rgb(249, 180, 186) 0%, rgb(248, 215, 218) 100%); } -.alert-warning { +.alert.warning { color: #856404; background: #fff3cd; border-color: #dfc678;