From 2d611aaff7a32a6ce2179b896601cde0c8e3b948 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Wed, 23 Jul 2025 15:50:38 +0100
Subject: [PATCH 1/9] style: remove border from input boxes

---
 app/assets/stylesheets/form.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/form.scss b/app/assets/stylesheets/form.scss
index 5417dc0..fb42bf1 100644
--- a/app/assets/stylesheets/form.scss
+++ b/app/assets/stylesheets/form.scss
@@ -16,12 +16,12 @@
     input, select {
         height: 34px;
         width: 100%;
-        padding: 0 5px;
+        padding: 0 0.5rem;
         outline: none;
         border-radius: 5px;
         background-color: $line-color;
         color: $font-color;
-        border: 2px solid $background-color;
+        border: none;
         margin-bottom: 4px;
     }
 

From 99568af4526792b3d3ed369952daf8ff17f6cc25 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Wed, 23 Jul 2025 16:01:43 +0100
Subject: [PATCH 2/9] style: prompt users of % fields

---
 app/views/exams/_form.html.haml         |  4 +++-
 app/views/exams/_result_form.html.haml  |  4 +++-
 app/views/exams/edit.html.haml          | 17 ++++++++++-------
 app/views/uni_modules/_target_form.haml |  4 +++-
 app/views/uni_modules/edit.html.haml    |  2 +-
 app/views/years/_form.html.haml         |  4 +++-
 6 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/app/views/exams/_form.html.haml b/app/views/exams/_form.html.haml
index 8075589..9b6aeb0 100644
--- a/app/views/exams/_form.html.haml
+++ b/app/views/exams/_form.html.haml
@@ -8,7 +8,9 @@
             %li= message
 
     .field
-      = f.label :weight
+      = f.label :weight do
+        Weight
+        %span.font-secondary= " (%)"
       = f.text_field :weight
     .field
       = f.label :name
diff --git a/app/views/exams/_result_form.html.haml b/app/views/exams/_result_form.html.haml
index 4c897bb..897211c 100644
--- a/app/views/exams/_result_form.html.haml
+++ b/app/views/exams/_result_form.html.haml
@@ -2,7 +2,9 @@
   = f.hidden_field :exam_id, value: @exam.id
 
   .field
-    = f.label :score
+    = f.label :score do
+      Percentage
+      %span.font-secondary= " (%)"
     = f.text_field :score
 
   .actions
diff --git a/app/views/exams/edit.html.haml b/app/views/exams/edit.html.haml
index 212284a..bf3eab2 100644
--- a/app/views/exams/edit.html.haml
+++ b/app/views/exams/edit.html.haml
@@ -1,11 +1,14 @@
-.container
-  = link_to 'Back', uni_module_path(@uni_module), class: 'link-button'
+= link_to uni_module_exam_path(@uni_module, @exam), class:'unstyle-link font-secondary mb-1' do
+  %i.fa-solid.fa-arrow-left
+  %span="Back to #{@uni_module.code} - #{@exam.name}"
 
-  .gt-card
-    .card-heading
-      %h1 Editing exam
-      = button_to 'Delete', uni_module_exam_path(@uni_module, @exam), method: :delete, data: { confirm: 'Are you sure?' }
+.gt-card
+  .card-heading
+    %h1 Editing exam
+    = button_to 'Delete', uni_module_exam_path(@uni_module, @exam), method: :delete, data: { confirm: 'Are you sure?' }
 
-    = render 'form'
+  = render 'form'
 
+.gt-card
+  .gt-form
     = render 'result_form'
\ No newline at end of file
diff --git a/app/views/uni_modules/_target_form.haml b/app/views/uni_modules/_target_form.haml
index 8ccdbe0..08a1e94 100644
--- a/app/views/uni_modules/_target_form.haml
+++ b/app/views/uni_modules/_target_form.haml
@@ -2,7 +2,9 @@
   = f.hidden_field :uni_module_id, value: @uni_module.id
 
   .field
-    = f.label :score
+    = f.label :score do
+      Target
+      %span.font-secondary= " (%)"
     = f.text_field :score
 
   .actions
diff --git a/app/views/uni_modules/edit.html.haml b/app/views/uni_modules/edit.html.haml
index 36ab015..d06206e 100644
--- a/app/views/uni_modules/edit.html.haml
+++ b/app/views/uni_modules/edit.html.haml
@@ -6,5 +6,5 @@
 
     = render 'form'
 
-  .gt-card
+  .gt-card.gt-form
     = render 'target_form'
\ No newline at end of file
diff --git a/app/views/years/_form.html.haml b/app/views/years/_form.html.haml
index 3b85be9..e587e2a 100644
--- a/app/views/years/_form.html.haml
+++ b/app/views/years/_form.html.haml
@@ -12,7 +12,9 @@
       = f.text_field :name
 
     .field
-      = f.label :weighting
+      = f.label :weighting do
+        Weighting 
+        %span.font-secondary= " (%)"
       = f.number_field :weighting, step: 0.01, min: 0, max: 100
 
     .actions

From 1aaf5a4e2ea7ac6c2cbced603a22cd46504fa4b0 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Wed, 23 Jul 2025 16:04:15 +0100
Subject: [PATCH 3/9] fix: change reference from modules to singular module

---
 app/controllers/users_controller.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
index c1fda3b..335fe01 100644
--- a/app/controllers/users_controller.rb
+++ b/app/controllers/users_controller.rb
@@ -22,7 +22,7 @@ def show
       end
 
     @exam_type_data = Exam.joins(:uni_module)
-                          .where(uni_modules: current_user.uni_modules)
+                          .where(uni_module: current_user.uni_modules)
                           .group(:type)
                           .sum('exams.weight * uni_modules.credits / 100')
   end

From a9406512866b2c5d23009631cf1bb5ee5217ce58 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Wed, 23 Jul 2025 16:29:08 +0100
Subject: [PATCH 4/9] style: update header navbar

---
 app/assets/stylesheets/header.scss           | 12 +++++++++---
 app/views/devise/registrations/new.html.haml |  2 +-
 app/views/devise/sessions/new.html.haml      |  2 +-
 app/views/layouts/application.html.haml      |  9 +++------
 app/views/users/show.html.haml               |  2 ++
 5 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/header.scss b/app/assets/stylesheets/header.scss
index 92e651b..d735497 100644
--- a/app/assets/stylesheets/header.scss
+++ b/app/assets/stylesheets/header.scss
@@ -1,7 +1,9 @@
 @import "variables";
 
+$header-height: 60px;
+
 header {
-    height: 60px;
+    height: $header-height;
     width: 100%;
     line-height: 60px;
     background-color: $header-color;
@@ -27,11 +29,15 @@ header {
 
     .title {
         display: inline-block;
-        font-size: 32px;
+        font-size: 2rem;
     }
 
     .header-links {
+        height: $header-height;
+        line-height: $header-height;
         float: right;
-        margin-right: 20px;
+        font-size: 2rem;
+        display: flex;
+        align-items: center;
     }
 }
\ No newline at end of file
diff --git a/app/views/devise/registrations/new.html.haml b/app/views/devise/registrations/new.html.haml
index 2d7875a..6f9759b 100644
--- a/app/views/devise/registrations/new.html.haml
+++ b/app/views/devise/registrations/new.html.haml
@@ -1,7 +1,7 @@
 .login-container
   .gt-card.gt-form.login
     .center
-      %h2 Sign Up to GradeTracker
+      %h2 Sign Up to ModuleMate
     = form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f|
       = render "devise/shared/error_messages", resource: resource
       .field
diff --git a/app/views/devise/sessions/new.html.haml b/app/views/devise/sessions/new.html.haml
index 976cdd6..790e144 100644
--- a/app/views/devise/sessions/new.html.haml
+++ b/app/views/devise/sessions/new.html.haml
@@ -1,7 +1,7 @@
 .login-container
   .gt-card.gt-form.login
     .center
-      %h2 Sign In to GradeTracker
+      %h2 Sign In to ModuleMate
 
       - if devise_mapping.omniauthable?
         - resource_class.omniauth_providers.each do |provider|
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index 9170f28..6171377 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -15,13 +15,10 @@
         .title= link_to "ModuleMate", root_path
         .header-links
           - if user_signed_in?
-            = link_to "Profile", user_path(current_user)
-            %span=  "|"
-            = button_to "Logout", destroy_user_session_path, method: :delete
+            = link_to user_path(current_user) do
+              %i.fa-solid.fa-circle-user
           - else
-            = link_to "Login", new_user_session_path
-            %span= "|"
-            = link_to "Sign Up", new_user_registration_path
+            = link_to "Sign In", new_user_session_path, style: "font-size: 20px;"
 
     %main
       - if user_signed_in?
diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml
index 8de5062..c45481d 100644
--- a/app/views/users/show.html.haml
+++ b/app/views/users/show.html.haml
@@ -7,6 +7,8 @@
     %b Joined:
     = @user.created_at.strftime("%d %B, %Y")
 
+  = button_to "Logout", destroy_user_session_path, method: :delete, class: 'link-button'
+
 .gt-card
   %h1.section-heading Assessments
   %h2 All Assessments

From ae93dd6b581eadb18db19614a8148aa41950acba Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Wed, 23 Jul 2025 16:54:58 +0100
Subject: [PATCH 5/9] style: update status bar

---
 app/assets/stylesheets/home.scss        | 20 ++++++++++++++++++++
 app/views/layouts/application.html.haml | 25 ++++++++-----------------
 2 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/home.scss
index 7c21275..7649873 100644
--- a/app/assets/stylesheets/home.scss
+++ b/app/assets/stylesheets/home.scss
@@ -294,4 +294,24 @@ main {
     &::after {
         margin-left: 10px;
     }
+}
+
+.alert-bar {
+    width: 100%;
+    padding: 0.5rem;
+    text-align: center;
+    margin: 0;
+}
+
+.ab-notice {
+    background-color: #99cc33;
+}
+
+.ab-danger {
+    background-color: #B00020;
+
+}
+
+.ab-warning {
+    background-color: #facc15;
 }
\ No newline at end of file
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index 6171377..24cdf1b 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -19,31 +19,22 @@
               %i.fa-solid.fa-circle-user
           - else
             = link_to "Sign In", new_user_session_path, style: "font-size: 20px;"
-
+    %div 
+      - flash.each do |key, message|
+        - bootstrap_class = case key
+          - when 'notice' then 'alert-bar ab-notice'
+          - when 'alert' then 'alert-bar ab-danger'
+          - else 'alert-bar ab-warning'
+        %p{class: bootstrap_class}= message
     %main
       - if user_signed_in?
         .sidebar
           = render 'layouts/sidebar'
 
         .main-content
-          .container
-            - flash.each do |key, message|
-              - bootstrap_class = case key
-                - when 'notice' then 'alert alert-info'
-                - when 'alert' then 'alert alert-danger'
-                - else 'alert alert-warning'
-              %p{class: bootstrap_class}= message
           = yield
       - else
-        .container
-          - flash.each do |key, message|
-            - bootstrap_class = case key
-              - when 'notice' then 'alert alert-info'
-              - when 'alert' then 'alert alert-danger'
-              - else 'alert alert-warning'
-            %p{class: bootstrap_class}= message
-
-          = yield
+        = yield
 
     %footer
       = link_to "GradeTracker", root_path

From d0ca4eaeadf72fede06871e16f00756f796cab58 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Thu, 24 Jul 2025 17:02:12 +0100
Subject: [PATCH 6/9] style: introduce new colour scheme

---
 app/assets/stylesheets/_variables.scss | 35 +++++++++++++++++++-------
 app/assets/stylesheets/home.scss       |  6 ++---
 2 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/app/assets/stylesheets/_variables.scss b/app/assets/stylesheets/_variables.scss
index 4bc575f..6ca7604 100644
--- a/app/assets/stylesheets/_variables.scss
+++ b/app/assets/stylesheets/_variables.scss
@@ -1,15 +1,32 @@
-$header-color: #000103;
-$background-color: #333138;
-$line-color: #515052;
-$font-color: #fffffa;
-$font-secondary-color: #878787;
-$highlight-color: #00538F;
-$link-hover-color: #cccccc;
-$delete-color: rgb(200, 0, 0);
+$bg-dark: hsl(250, 2, 10);
+$bg: hsl(250, 2, 15);
+$bg-light: hsl(250, 2, 25);
+
+$brand: hsl(210, 80, 30);
+
+$text-bold: hsl(0, 0, 95);
+$text: hsl(0, 0, 90);
+$text-muted: hsl(0, 0, 60);
+
+$success: hsl(120, 80%, 30%);
+$warning: hsl(50, 80%, 30%);
+$danger: hsl(0, 80, 30);
+
 $font-size: 20px;
 $roundness: 10px;
 
 $breakpoint-sm: 576px;
 $breakpoint-md: 768px;
 $breakpoint-lg: 992px;
-$breakpoint-xl: 1200px;
\ No newline at end of file
+$breakpoint-xl: 1200px;
+
+/* Deprecated styles to be fazed out */
+
+$header-color: $bg-dark;
+$background-color: $bg;
+$line-color: $bg-light;
+$font-color: $text;
+$font-secondary-color: $text-muted;
+$highlight-color: $brand;
+$link-hover-color: #cccccc;
+$delete-color: $danger;
\ No newline at end of file
diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/home.scss
index 7649873..8d3ed66 100644
--- a/app/assets/stylesheets/home.scss
+++ b/app/assets/stylesheets/home.scss
@@ -304,14 +304,14 @@ main {
 }
 
 .ab-notice {
-    background-color: #99cc33;
+    background-color: $success;
 }
 
 .ab-danger {
-    background-color: #B00020;
+    background-color: $danger;
 
 }
 
 .ab-warning {
-    background-color: #facc15;
+    background-color: $warning;
 }
\ No newline at end of file

From aa3287690a93e1e08286c8ba530858335d7545bd Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Thu, 24 Jul 2025 23:40:28 +0100
Subject: [PATCH 7/9] fix: stops completion_percentage always returning 0

---
 app/models/uni_module.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/models/uni_module.rb b/app/models/uni_module.rb
index bae613b..a4cde69 100644
--- a/app/models/uni_module.rb
+++ b/app/models/uni_module.rb
@@ -45,7 +45,7 @@ def achieved_score(user)
 
   # Gets the percentage completion of the module based on the exams taken
   def completion_percentage(user)
-    return 0 if exams.exists?
+    return 0 unless exams.exists?
 
     exams_with_results(user).sum(:weight)
   end

From 364d4f662c2f5873e011a68d5f95564531a64af0 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Fri, 25 Jul 2025 12:00:10 +0100
Subject: [PATCH 8/9] style: move header to sidebar

---
 app/assets/stylesheets/_variables.scss  |  2 +
 app/assets/stylesheets/footer.scss      |  7 +++
 app/assets/stylesheets/header.scss      | 60 ++++++++++----------
 app/assets/stylesheets/home.scss        | 74 ++++++++++++++-----------
 app/views/layouts/_sidebar.html.haml    | 10 ++++
 app/views/layouts/application.html.haml | 39 +++++--------
 6 files changed, 107 insertions(+), 85 deletions(-)

diff --git a/app/assets/stylesheets/_variables.scss b/app/assets/stylesheets/_variables.scss
index 6ca7604..8c548a1 100644
--- a/app/assets/stylesheets/_variables.scss
+++ b/app/assets/stylesheets/_variables.scss
@@ -15,6 +15,8 @@ $danger: hsl(0, 80, 30);
 $font-size: 20px;
 $roundness: 10px;
 
+$max-page-width: 1400px;
+
 $breakpoint-sm: 576px;
 $breakpoint-md: 768px;
 $breakpoint-lg: 992px;
diff --git a/app/assets/stylesheets/footer.scss b/app/assets/stylesheets/footer.scss
index ea2ba52..f95873e 100644
--- a/app/assets/stylesheets/footer.scss
+++ b/app/assets/stylesheets/footer.scss
@@ -7,10 +7,17 @@ footer {
     gap: 1rem;
     justify-content: center; // or center / flex-start as needed
     align-items: center;
+    width: calc(100% - 400px); 
+    margin-left: 400px;
 
     a {
         margin: 0 0.5rem;
         text-decoration: none;
         color: inherit;
     }
+
+    @media (max-width: $breakpoint-lg) {
+        width: 100%; 
+        margin: 0;
+    }
 }
\ No newline at end of file
diff --git a/app/assets/stylesheets/header.scss b/app/assets/stylesheets/header.scss
index d735497..aea7cb3 100644
--- a/app/assets/stylesheets/header.scss
+++ b/app/assets/stylesheets/header.scss
@@ -1,43 +1,45 @@
 @import "variables";
 
-$header-height: 60px;
-
 header {
-    height: $header-height;
-    width: 100%;
-    line-height: 60px;
-    background-color: $header-color;
-    border-bottom: 1px solid $line-color;
+    background-color: $bg-dark;
+    max-width: 400px;
+    border-right: 1px solid $bg-light;
+    flex-shrink: 0;
+    padding: 1rem;
+    height: 100vh;
+    overflow-y: auto;
+    position: fixed;
+    top: 0;
+    flex-shrink: 0;  
 
-    a {
-        color: $font-color;
-        text-decoration: none;
-    }
+    .side-heading {
+        .title {
+            font-size: 2.5rem;
+            line-height: 2.5rem;
+        }
 
-    form {
-        display: inline;
-    }
+        .account {
+            margin-bottom: 0.5rem;
+        }
 
-    button {
-        height: 50px;
-        border: none;
-        background-color: $header-color;
+        border-bottom: 1px solid $bg-light;
+        margin-bottom: 0.5rem;
+    }
+    a {
         color: $font-color;
         text-decoration: none;
-        display: inline;
     }
 
-    .title {
-        display: inline-block;
-        font-size: 2rem;
+    .due-date {
+        color: $font-secondary-color;
+        font-style: italic;
     }
 
-    .header-links {
-        height: $header-height;
-        line-height: $header-height;
-        float: right;
-        font-size: 2rem;
-        display: flex;
-        align-items: center;
+    @media (max-width: $breakpoint-lg) {
+        width: 100%;
+        max-width: 100%;
+        border-right: none;
+        position: relative;
+        height: fit-content;
     }
 }
\ No newline at end of file
diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/home.scss
index 8d3ed66..40a5b9d 100644
--- a/app/assets/stylesheets/home.scss
+++ b/app/assets/stylesheets/home.scss
@@ -1,33 +1,65 @@
 @import "variables";
 
 html, body {
-  height: 100%;
-  margin: 0;
+    height: 100%;
+    margin: 0;
+    color: $font-color;
+    font-family: Roboto, sans-serif;
+    font-size: $font-size;
 }
 
 body {
     background-color: $background-color;
-    color: $font-color;
-    font-family: Roboto, sans-serif;
-    font-size: $font-size;
     display: flex;
-    flex-direction: column;
+    flex-direction: row;
+
+    @media (max-width: $breakpoint-lg) {
+        flex-direction: column;
+    }
 }
 
 main {
+    width: calc(100% - 400px); 
+    margin-left: 400px;
     flex: 1;
     display: flex;
+    flex-direction: column;
+    flex-grow: 1;
 
     @media (max-width: $breakpoint-lg) {
         flex-direction: column;
+        width: 100%; 
+        margin: 0;
     }
 }
 
+.not-header {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+}
+
+h1, h2, h3 {
+    color: $text-bold;
+}
+
+h1 {
+    font-size: 2rem;
+}
+
+h2 {
+    font-size: 1.5rem;
+}
+
 .main-content {
     display: flex;
     flex-direction: column;
     flex-grow: 1;
     padding: 1rem;
+    width: 100%;
+    max-width: $max-page-width;
+    margin: 0 auto;
 }
 
 .module-list {
@@ -36,6 +68,10 @@ main {
         color: $font-color;
         text-decoration: none;
     }
+
+    .card-heading {
+        margin-bottom: 0.5rem;
+    }
 }
 
 .gt-card {
@@ -43,7 +79,7 @@ main {
     border-radius: $roundness;
     //background-color: $line-color;
     border: 1px solid $line-color;
-    margin: 0 0 10px;
+    margin: 0 0 0.5rem;
     max-width: 100%;
     //box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.2);
 }
@@ -183,30 +219,6 @@ main {
     font-size: 40px;
 }
 
-.sidebar {
-    max-width: 400px;
-    border-right: 1px solid $line-color;
-    flex-shrink: 0;
-    padding: 1rem;
-
-    a {
-        color: $font-color;
-        text-decoration: none;
-    }
-
-    .due-date {
-        color: $font-secondary-color;
-        font-style: italic;
-    }
-
-    @media (max-width: $breakpoint-lg) {
-        width: 100%;
-        max-width: 100%;
-        border-right: none;
-
-    }
-}
-
 .col.mod-code {
     width: 100px !important;
     flex: 0 0 100px;
diff --git a/app/views/layouts/_sidebar.html.haml b/app/views/layouts/_sidebar.html.haml
index 0e791f0..dda87c8 100644
--- a/app/views/layouts/_sidebar.html.haml
+++ b/app/views/layouts/_sidebar.html.haml
@@ -1,3 +1,13 @@
+.side-heading
+  .title= link_to "ModuleMate", root_path
+  .account
+    - if user_signed_in?
+      = link_to user_path(current_user), class: 'font-secondary unstyle-link' do
+        %i.fa-solid.fa-circle-user
+        %span= current_user.email
+    - else
+      = link_to "Sign In", new_user_session_path, style: "font-size: 20px;"
+
 -# Quick-add time
 .gt-card.quicklog
   %h2 Quicklog
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index 24cdf1b..21f5384 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -11,31 +11,20 @@
     = javascript_importmap_tags
   %body
     %header
-      .mx-0.px-3
-        .title= link_to "ModuleMate", root_path
-        .header-links
-          - if user_signed_in?
-            = link_to user_path(current_user) do
-              %i.fa-solid.fa-circle-user
-          - else
-            = link_to "Sign In", new_user_session_path, style: "font-size: 20px;"
-    %div 
-      - flash.each do |key, message|
-        - bootstrap_class = case key
-          - when 'notice' then 'alert-bar ab-notice'
-          - when 'alert' then 'alert-bar ab-danger'
-          - else 'alert-bar ab-warning'
-        %p{class: bootstrap_class}= message
-    %main
-      - if user_signed_in?
-        .sidebar
-          = render 'layouts/sidebar'
-
+      = render 'layouts/sidebar'
+    
+    .not-header
+      %main
+        %div 
+          - flash.each do |key, message|
+            - bootstrap_class = case key
+              - when 'notice' then 'alert-bar ab-notice'
+              - when 'alert' then 'alert-bar ab-danger'
+              - else 'alert-bar ab-warning'
+            %p{class: bootstrap_class}= message
         .main-content
           = yield
-      - else
-        = yield
 
-    %footer
-      = link_to "GradeTracker", root_path
-      = link_to "Created by Ryan Turner", "https://github.com/Turnlings", target: "_blank", rel: "noopener"
\ No newline at end of file
+      %footer
+        = link_to "GradeTracker", root_path
+        = link_to "Created by Ryan Turner", "https://github.com/Turnlings", target: "_blank", rel: "noopener"
\ No newline at end of file

From 3e8313b7fa500c2c34718817c39ef00969ee39c8 Mon Sep 17 00:00:00 2001
From: Ryan Turner <100864486+Turnlings@users.noreply.github.com>
Date: Fri, 25 Jul 2025 15:54:25 +0100
Subject: [PATCH 9/9] style: fix login page

---
 app/assets/stylesheets/footer.scss           |  4 +-
 app/assets/stylesheets/header.scss           |  2 +-
 app/assets/stylesheets/home.scss             | 44 ++++++++----
 app/views/devise/registrations/new.html.haml | 76 +++++++++++---------
 app/views/devise/sessions/new.html.haml      | 54 +++++++-------
 app/views/layouts/application.html.haml      |  7 +-
 config/environments/development.rb           | 16 +++--
 7 files changed, 115 insertions(+), 88 deletions(-)

diff --git a/app/assets/stylesheets/footer.scss b/app/assets/stylesheets/footer.scss
index f95873e..4e34e96 100644
--- a/app/assets/stylesheets/footer.scss
+++ b/app/assets/stylesheets/footer.scss
@@ -5,10 +5,8 @@ footer {
     padding: 10px;
     display: flex;
     gap: 1rem;
-    justify-content: center; // or center / flex-start as needed
+    justify-content: center;
     align-items: center;
-    width: calc(100% - 400px); 
-    margin-left: 400px;
 
     a {
         margin: 0 0.5rem;
diff --git a/app/assets/stylesheets/header.scss b/app/assets/stylesheets/header.scss
index aea7cb3..211c0dd 100644
--- a/app/assets/stylesheets/header.scss
+++ b/app/assets/stylesheets/header.scss
@@ -2,7 +2,7 @@
 
 header {
     background-color: $bg-dark;
-    max-width: 400px;
+    width: 400px;
     border-right: 1px solid $bg-light;
     flex-shrink: 0;
     padding: 1rem;
diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/home.scss
index 40a5b9d..e069363 100644
--- a/app/assets/stylesheets/home.scss
+++ b/app/assets/stylesheets/home.scss
@@ -19,8 +19,6 @@ body {
 }
 
 main {
-    width: calc(100% - 400px); 
-    margin-left: 400px;
     flex: 1;
     display: flex;
     flex-direction: column;
@@ -28,12 +26,18 @@ main {
 
     @media (max-width: $breakpoint-lg) {
         flex-direction: column;
-        width: 100%; 
-        margin: 0;
     }
 }
 
 .not-header {
+    width: calc(100% - 400px); 
+    margin-left: 400px;
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+}
+
+.not-header-login {
     width: 100%;
     display: flex;
     flex-direction: column;
@@ -239,17 +243,23 @@ h2 {
 }
 
 .login-container {
-    max-width: 400px;
-    width: 100%;
-    height: 100%;
-    margin: 5% auto 0;
+  flex: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .login {
-    h2 {
-        margin-bottom: 20px;
+    width: fit-content;
+    .gt-card {
+        padding: 1rem;
+    }
+
+    h1 {
+        margin-bottom: 1rem;
     }
     .omniauth {
+        width: 100%;
         color: $font-color;
         background: none;
         border: 1px solid $line-color;
@@ -262,12 +272,13 @@ h2 {
     }
 
     .field {
+        border-radius: $roundness;
         margin-bottom: 10px;
     }
 
     #user_remember_me {
         width: 20px;
-        margin: 0 0.5rem 0 0;
+        margin: 0;
     }
 
     .checkbox-container {
@@ -275,6 +286,10 @@ h2 {
         align-items: center;
         gap: 0.5rem; 
     }
+
+    input[type="submit"] {
+        margin: 0.5rem 0 !important;
+    }
 }
 
 .center {
@@ -290,7 +305,7 @@ h2 {
     text-align: center;
     color: $font-secondary-color;
     font-size: 0.9rem;
-    margin: 20px 0 10px;
+    margin: 0.5rem 0;
 
     &::before,
     &::after {
@@ -321,9 +336,12 @@ h2 {
 
 .ab-danger {
     background-color: $danger;
-
 }
 
 .ab-warning {
     background-color: $warning;
+}
+
+.text-danger {
+    color: $danger;
 }
\ No newline at end of file
diff --git a/app/views/devise/registrations/new.html.haml b/app/views/devise/registrations/new.html.haml
index 6f9759b..7035efd 100644
--- a/app/views/devise/registrations/new.html.haml
+++ b/app/views/devise/registrations/new.html.haml
@@ -1,39 +1,45 @@
 .login-container
-  .gt-card.gt-form.login
-    .center
-      %h2 Sign Up to ModuleMate
-    = form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f|
-      = render "devise/shared/error_messages", resource: resource
-      .field
-        = f.label :email
-        %br/
-        = f.email_field :email, autofocus: true, autocomplete: "email"
-      .field
-        = f.label :password
-        - if @minimum_password_length
-          %em.font-secondary
-            (#{@minimum_password_length} characters minimum)
-        %br/
-        = f.password_field :password, autocomplete: "new-password"
-      .field
-        = f.label :password_confirmation
-        %br/
-        = f.password_field :password_confirmation, autocomplete: "new-password"
-      .actions
-        = f.submit "Sign up"
+  .login
+    .gt-card.gt-form
+      .center
+        %h1 Sign up to ModuleMate
+      = form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f|
+        .field
+          = f.label :email
+          %br/
+          = f.email_field :email, autofocus: true, autocomplete: "email"
+          - if resource.errors[:email].any?
+            %span.font-secondary.text-danger= resource.errors.full_messages_for(:email).first
+        .field
+          = f.label :password
+          - if @minimum_password_length
+            %em.font-secondary
+              (#{@minimum_password_length} characters minimum)
+          %br/
+          = f.password_field :password, autocomplete: "new-password"
+          - if resource.errors[:password].any?
+            %span.font-secondary.text-danger= resource.errors.full_messages_for(:password).first
+        .field
+          = f.label :password_confirmation
+          %br/
+          = f.password_field :password_confirmation, autocomplete: "new-password"
+          - if resource.errors[:password_confirmation].any?
+            %span.font-secondary.text-danger= resource.errors.full_messages_for(:password_confirmation).first
+        .actions
+          = f.submit "Sign up"
 
-    .divider
-      %span or
+      .divider
+        %span or
 
-    .center
-      - if devise_mapping.omniauthable?
-        - resource_class.omniauth_providers.each do |provider|
-          - if provider == :google_oauth2
-            = button_to omniauth_authorize_path(resource_name, :google_oauth2), data: { turbo: false }, class: 'omniauth' do
-              %i.fa-brands.fa-google
-              %span Sign in with Google
-          - else
-            = button_to "Sign in with #{OmniAuth::Utils.camelize(provider)}", omniauth_authorize_path(resource_name, provider), data: { turbo: false }, class: 'omniauth'
+      .center
+        - if devise_mapping.omniauthable?
+          - resource_class.omniauth_providers.each do |provider|
+            - if provider == :google_oauth2
+              = button_to omniauth_authorize_path(resource_name, :google_oauth2), data: { turbo: false }, class: 'omniauth' do
+                %i.fa-brands.fa-google
+                %span Sign in with Google
+            - else
+              = button_to "Sign in with #{OmniAuth::Utils.camelize(provider)}", omniauth_authorize_path(resource_name, provider), data: { turbo: false }, class: 'omniauth'
 
-  .center
-    = link_to "Sign in", new_session_path(resource_name), class: 'unstyle-link font-secondary center'
+    .center
+      = link_to "Sign in", new_session_path(resource_name), class: 'unstyle-link font-secondary center'
diff --git a/app/views/devise/sessions/new.html.haml b/app/views/devise/sessions/new.html.haml
index 790e144..24ca6e2 100644
--- a/app/views/devise/sessions/new.html.haml
+++ b/app/views/devise/sessions/new.html.haml
@@ -1,7 +1,28 @@
 .login-container
-  .gt-card.gt-form.login
-    .center
-      %h2 Sign In to ModuleMate
+  .login
+    .gt-card.gt-form
+      .center
+        %h1 Sign in to ModuleMate
+
+      = form_for(resource, as: resource_name, url: session_path(resource_name)) do |f|
+        .field
+          = f.label :email
+          %br/
+          = f.email_field :email, autofocus: true, autocomplete: "email"
+        .field
+          = f.label :password
+          = link_to "Forgot your password?", new_password_path(resource_name), class: 'unstyle-link font-secondary'
+          %br/
+          = f.password_field :password, autocomplete: "current-password"
+        - if devise_mapping.rememberable?
+          .field.checkbox-container
+            = f.check_box :remember_me
+            = f.label :remember_me
+        .actions
+          = f.submit "Sign in"
+
+      .divider
+        %span or
 
       - if devise_mapping.omniauthable?
         - resource_class.omniauth_providers.each do |provider|
@@ -11,27 +32,8 @@
               %span Sign in with Google
           - else
             = button_to "Sign in with #{OmniAuth::Utils.camelize(provider)}", omniauth_authorize_path(resource_name, provider), data: { turbo: false }, class: 'omniauth'
-
-    .divider
-      %span or
-
-    = form_for(resource, as: resource_name, url: session_path(resource_name)) do |f|
-      .field
-        = f.label :email
-        %br/
-        = f.email_field :email, autofocus: true, autocomplete: "email"
-      .field
-        = f.label :password
-        = link_to "Forgot your password?", new_password_path(resource_name), class: 'unstyle-link font-secondary'
-        %br/
-        = f.password_field :password, autocomplete: "current-password"
-      - if devise_mapping.rememberable?
-        .field.checkbox-container
-          = f.check_box :remember_me
-          = f.label :remember_me
-      .actions
-        = f.submit "Log in"
-  %div
-    .center
-      = link_to "Sign up", new_registration_path(resource_name), class: 'unstyle-link font-secondary center'
+    
+    %div
+      .center
+        = link_to "Sign up", new_registration_path(resource_name), class: 'unstyle-link font-secondary center'
 
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index 21f5384..94177f1 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -10,10 +10,11 @@
     = stylesheet_link_tag "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css", rel: "stylesheet", crossorigin: "anonymous"
     = javascript_importmap_tags
   %body
-    %header
-      = render 'layouts/sidebar'
+    - if user_signed_in?
+      %header
+        = render 'layouts/sidebar'
     
-    .not-header
+    %div{class: (user_signed_in? ? "not-header" : "not-header-login")}
       %main
         %div 
           - flash.each do |key, message|
diff --git a/config/environments/development.rb b/config/environments/development.rb
index 44a2bc3..ce76abd 100644
--- a/config/environments/development.rb
+++ b/config/environments/development.rb
@@ -80,11 +80,13 @@
   config.action_controller.raise_on_missing_callback_actions = true
 
   # Bullet configuration
-  config.after_initialize do
-    Bullet.enable = true
-    Bullet.alert = true            # pop up a JavaScript alert in the browser
-    Bullet.bullet_logger = true    # log to the Bullet log file
-    Bullet.rails_logger = true     # log to the Rails log
-    Bullet.add_footer = true       # add alerts to the bottom of pages
-  end
+  # config.after_initialize do
+  #   Bullet.enable = true
+  #   Bullet.alert = true            # pop up a JavaScript alert in the browser
+  #   Bullet.bullet_logger = true    # log to the Bullet log file
+  #   Bullet.rails_logger = true     # log to the Rails log
+  #   Bullet.add_footer = true       # add alerts to the bottom of pages
+  # end
+
+  Rack::MiniProfiler.config.enabled = false
 end