diff --git a/app/controllers/AuthController.php b/app/controllers/AuthController.php index 658497b..d3cd20a 100644 --- a/app/controllers/AuthController.php +++ b/app/controllers/AuthController.php @@ -25,10 +25,10 @@ class AuthController extends Controller { if($result === true) { $this->redirect('/dashboard'); } else { - $this->view('auth/signin', ['error' => $result]); + $this->view('auth/signin', ['error' => $result], 'noheader'); } } else { - $this->view('auth/signin', ['title' => 'Log In']); + $this->view('auth/signin', ['title' => 'Log In'], 'noheader'); } } @@ -54,7 +54,7 @@ class AuthController extends Controller { $this->view('auth/signup', [ 'error' => 'Please correct the errors below.', 'validationErrors' => $validator->errors() ?: [], - ]); + ], 'noheader'); return; } @@ -67,13 +67,13 @@ class AuthController extends Controller { $this->view('auth/signup', [ 'error' => $result, 'validationErrors' => [], - ]); + ], 'noheader'); } } else { $this->view('auth/signup', [ 'title' => 'Register', 'validationErrors' => [], - ]); + ], 'noheader'); } } diff --git a/app/views/auth/signin.php b/app/views/auth/signin.php index 7d9dbdd..da9867b 100644 --- a/app/views/auth/signin.php +++ b/app/views/auth/signin.php @@ -25,4 +25,9 @@ + +
+

New to Habit Tracker?

+ Create an account +
diff --git a/app/views/auth/signup.php b/app/views/auth/signup.php index 68cc2f7..f8d2e4c 100644 --- a/app/views/auth/signup.php +++ b/app/views/auth/signup.php @@ -37,4 +37,9 @@ + +
+

Already have an account?

+ Sign in +
diff --git a/app/views/layouts/base.php b/app/views/layouts/base.php index 575398b..d66be7f 100644 --- a/app/views/layouts/base.php +++ b/app/views/layouts/base.php @@ -10,13 +10,23 @@ +
- Log In - Sign Up - Log Out +
+ home + +
+
+ + Log In + Sign Up + + Log Out + +
diff --git a/app/views/layouts/noheader.php b/app/views/layouts/noheader.php new file mode 100644 index 0000000..f3536c8 --- /dev/null +++ b/app/views/layouts/noheader.php @@ -0,0 +1,20 @@ + + + + + + + + + Habit Tracker | <?= $data['title'] ?> + + + + + + +
+ +
+ + diff --git a/core/Controller.php b/core/Controller.php index 5715db7..1642b49 100644 --- a/core/Controller.php +++ b/core/Controller.php @@ -16,8 +16,8 @@ class Controller { * @param string $viewName * @param array $data */ - public function view($viewName, $data = []) { + public function view($viewName, $data = [], $layout = "base") { $view = new View(); - $view->render($viewName, $data); + $view->render($viewName, $data, $layout); } } diff --git a/core/Router.php b/core/Router.php index ff4d196..5dad384 100644 --- a/core/Router.php +++ b/core/Router.php @@ -78,7 +78,7 @@ class Router { } else { http_response_code(404); $view = new View(); - $view->render('errors/404'); + $view->render('errors/404', [], 'noheader'); } } } diff --git a/public/css/dashboard.css b/public/css/dashboard.css index b3342c8..a6aa7ec 100644 --- a/public/css/dashboard.css +++ b/public/css/dashboard.css @@ -1,7 +1,6 @@ .dashboard { display: flex; flex-direction: column; - width: 100vw; align-items: center; } diff --git a/public/css/form.css b/public/css/form.css index 49909e3..78b08d0 100644 --- a/public/css/form.css +++ b/public/css/form.css @@ -3,7 +3,6 @@ flex-direction: column; align-items: center; justify-content: center; - width: 100vw; } body { @@ -59,3 +58,21 @@ select { .form small.error { width: 15rem; } + +.form .bordered { + border-radius: var(--border-radious); + border: var(--borderWidth-thin) solid var(--clr-border); + width: 17rem; + padding: 1rem; + margin-top: 1rem; + text-align: center; +} + +.form .bordered a { + text-decoration: none; + color: var(--clr-link-blue); +} + +.form .bordered a:hover { + text-decoration: underline; +} diff --git a/public/css/header.css b/public/css/header.css new file mode 100644 index 0000000..ed202db --- /dev/null +++ b/public/css/header.css @@ -0,0 +1,26 @@ +header { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 2rem; + width: 100vw; + height: 3rem; + background: var(--clr-secondary); + border-radius: var(--border-radious); + border-bottom: var(--borderWidth-thin) solid var(--clr-border); +} + +#hd-left, +#hd-right { + display: flex; + align-items: center; + gap: 1rem; +} + +header a img { + height: 2rem; +} + +header a { + text-decoration: none; +} diff --git a/public/css/main.css b/public/css/main.css index bb20eee..cf8780d 100644 --- a/public/css/main.css +++ b/public/css/main.css @@ -6,7 +6,7 @@ main { display: flex; - gap: 2rem; + flex-direction: column; margin-top: 2rem; margin-bottom: 2rem; padding: 0 var(--container-size); diff --git a/public/css/vars.css b/public/css/vars.css index 5d87cec..46fda14 100644 --- a/public/css/vars.css +++ b/public/css/vars.css @@ -6,6 +6,8 @@ --clr-green: #238636; --clr-danger-muted: #f851491a; + --clr-link-blue: #4493f8; + --border-radious: 5px; --borderWidth-thin: max(1px, 0.0625rem); --clr-border: #3d444db3;