visual and functional enhancements

CivicTechWR · Dec 4, 2024 · 99bd49e · 99bd49e
1 parent 25afc7d
commit 99bd49e
Show file tree

Hide file tree

Showing 5 changed files with 160 additions and 157 deletions.
diff --git a/docs/assets/css/base.css b/docs/assets/css/base.css
@@ -1,57 +1,91 @@
-/* Updated content for base.css */
+/* Base.css: Reset and global styles */
 
+/* Typography */
 :root {
-    /* Typography */
-    --body-font-family: 'DM Sans', sans-serif;
-    --h1-font-size: 48px;
-    --h2-font-size: 40px;
-    --h3-font-size: 36px;
-    --nav-font-size: 16px; /* Updated navbar font size */
-    --toc-font-size: 18px; /* Updated ToC font size */
-
-    /* Colors */
-    --primary-color: #FC6C6D;
-    --secondary-color: #2D6F72;
-    --section-bg-color: #f9f9f9;
-    --white-color: #ffffff;
-    --dark-color: #000000;
-    --text-color: #717275;
-    --border-color: #e9eaeb;
-  }
-
-  body {
-    font-family: var(--body-font-family);
-    background-color: var(--white-color);
-    color: var(--text-color);
-  }
-
-  h1, h2, h3, h4, h5, h6 {
-    font-family: var(--body-font-family);
-    color: var(--dark-color);
+    --font-family-base: 'DM Sans', sans-serif;
+    --font-size-base: 16px;
+    --line-height-base: 1.6;
+    --color-primary: #2D6F72; /* Emphasize CivicTechWR green */
+    --color-secondary: #000000; /* Dark for contrast */
+    --color-light: #ffffff; /* White background */
+    --color-text: #717275; /* Subtle text color */
+    --color-border: #e9eaeb; /* Neutral border color */
+}
+
+body {
+    font-family: var(--font-family-base);
+    font-size: var(--font-size-base);
+    line-height: var(--line-height-base);
+    color: var(--color-text);
+    background-color: var(--color-light);
+    margin: 0;
+    padding: 0;
+}
+
+h1, h2, h3, h4, h5, h6 {
     font-weight: 700;
-  }
-
-  h1 {
-    font-size: var(--h1-font-size);
-  }
-
-  h2 {
-    font-size: var(--h2-font-size);
-    color: var(--secondary-color);
-  }
-
-  h3 {
-    font-size: var(--h3-font-size);
-  }
-
-  /* General link styles */
-  a {
-    color: var(--primary-color);
+    color: var(--color-secondary);
+    margin: 0;
+}
+
+a {
+    color: var(--color-primary);
+    text-decoration: none;
+}
+
+a:hover {
+    color: var(--color-secondary);
+}
+
+/* Utility Classes */
+.container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 1rem;
+}
+
+.section-padding {
+    padding: 4rem 0;
+}
+
+.text-center {
+    text-align: center;
+}
+
+.text-primary {
+    color: var(--color-primary);
+}
+
+/* Hero Section */
+.hero {
+    background: linear-gradient(to right, #2D6F72, #ffffff);
+    color: var(--color-light);
+    text-align: center;
+    padding: 60px 20px;
+    border-radius: 10px;
+    margin-bottom: 30px;
+}
+
+.hero h1 {
+    font-size: 36px;
+    font-weight: bold;
+}
+
+.hero p {
+    font-size: 18px;
+    color: #f9f9f9;
+}
+
+.hero a {
+    color: var(--color-light);
+    font-weight: bold;
+    padding: 10px 20px;
+    border: 2px solid var(--color-light);
+    border-radius: 5px;
     text-decoration: none;
-    transition: color 0.3s;
-  }
-
-  a:hover {
-    color: var(--secondary-color);
-  }
-
+}
+
+.hero a:hover {
+    background-color: var(--color-light);
+    color: var(--color-primary);
+}
diff --git a/docs/assets/css/components.css b/docs/assets/css/components.css
@@ -1,84 +1,43 @@
-/* Navbar */
-.navbar {
-  background-color: transparent;
-  padding: 15px;
-}
-
-.navbar .nav-link {
-  font-size: var(--menu-font-size);
-  color: var(--secondary-color);
-  margin-right: 20px;
-}
-
-.navbar .nav-link:hover {
-  color: var(--primary-color);
-  border-bottom: 2px solid var(--primary-color);
-}
-
-/* Hero Section */
-.hero {
-  background: url("../images/bg-theme.png") no-repeat center center;
-  background-size: cover;
-  padding: 150px 0;
-  text-align: center;
-}
-
-.hero h1 {
-  font-size: var(--h1-font-size);
-  color: var(--white-color);
+/* Buttons */
+button, .btn {
+    background-color: var(--color-primary);
+    color: var(--color-light);
+    border-radius: 5px;
+    padding: 10px 20px;
+    transition: background-color 0.3s ease, transform 0.2s ease;
 }
 
-.hero p {
-  font-size: var(--p-font-size);
-  color: var(--white-color);
+button:hover, .btn:hover {
+    background-color: var(--color-secondary);
+    transform: scale(1.05);
 }
 
-.hero .cta-button {
-  background-color: var(--primary-color);
-  color: var(--white-color);
-  padding: 10px 20px;
-  border-radius: 50px;
+/* Navigation bar */
+.navbar {
+    background: var(--color-light);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    padding: 10px 20px;
 }
 
-/* Buttons */
-.btn-primary {
-  background-color: var(--primary-color);
-  color: var(--white-color);
-  padding: 10px 20px;
-  border-radius: 50px;
+.navbar a {
+    color: var(--color-secondary);
+    font-weight: 500;
+    font-size: 14px;
 }
 
-.btn-primary:hover {
-  background-color: var(--secondary-color);
-}
-/* Top Navigation Links */
-.md-nav__item a {
-  font-size: var(--nav-font-size);
-  font-weight: 700;
-  color: var(--link-color);
-  text-decoration: none;
-  padding: 10px 15px;
+.navbar a:hover {
+    color: var(--color-primary);
 }
 
-.md-nav__item a:hover {
-  color: var(--secondary-color);
-  text-decoration: underline;
-}
-/* ToC Header */
-.md-sidebar__title {
-  font-size: var(--toc-font-size);
-  font-weight: 700;
-  color: var(--dark-color);
-}
-
-/* ToC Links */
-.md-sidebar__item a {
-  font-size: var(--toc-font-size);
-  color: var(--link-color);
-  text-decoration: none;
+/* Hero Section */
+.hero {
+    background: linear-gradient(90deg, #2D6F72, #ffffff);
+    color: var(--color-light);
+    text-align: center;
+    padding: 100px 20px;
 }
 
-.md-sidebar__item a:hover {
-  color: var(--secondary-color);
-  text-decoration: underline;
-}
+.hero h1 {
+    font-size: 48px;
+    font-weight: 700;
+}
diff --git a/docs/assets/css/overrides.css b/docs/assets/css/overrides.css
@@ -1,33 +1,43 @@
-/* Override Material Theme Defaults */
-.md-nav__item a {
-  color: var(--secondary-color);
-  font-size: var(--menu-font-size);
+/* Override specific styles */
+
+/* Table of Contents */
+.toc {
+    background-color: var(--color-light);
+    border: 1px solid var(--color-border);
+    padding: 10px 15px;
+    border-radius: 8px;
+}
+
+.toc a {
+    color: var(--color-primary);
+    font-size: 14px;
+}
+
+.toc a:hover {
+    color: var(--color-secondary);
+}
+
+/* Footer */
+.footer {
+    background: var(--color-secondary);
+    color: var(--color-light);
+    text-align: center;
+    padding: 20px;
 }
 
-.md-nav__item a:hover {
-  color: var(--primary-color);
+.footer a {
+    color: var(--color-primary);
 }
 
-.md-header {
-  background-color: var(--dark-color);
+.footer a:hover {
+    color: var(--color-light);
 }
 
-.md-footer {
-  background-color: var(--section-bg-color);
-  color: var(--dark-color);
+/* Adjust navigation hover effects */
+.navbar a {
+    transition: color 0.3s ease;
 }
-/* Adjusting spacing for ToC sidebar */
-.md-sidebar {
-    padding: 20px 15px;
-  }
-
-  /* Increasing spacing between ToC links */
-  .md-sidebar__item {
-    margin-bottom: 10px;
-  }
-
-  /* Adding custom styles for the Home link */
-  .md-nav__item:first-child a {
-    font-size: 18px; /* Slightly larger for the home link */
-    font-weight: bold;
-  }
+
+.navbar a:hover {
+    color: var(--color-secondary);
+}
diff --git a/docs/index.md b/docs/index.md
@@ -24,14 +24,14 @@ Learn how to communicate, contribute, and plan effectively:
 
 Keep track of past discussions and decisions:
 
-- [2024-06-19 Meeting Minutes](meeting-minutes/2024-06-19_Meeting_Minutes.md)
+- [2024-06-19 Recap](recaps/2024-06-19_recap.md)
 
 ### Templates
 
 Useful templates for effective collaboration:
 
 - [Event Planning Template](ctwr-templates/Event_Planning_Template.md)
-- [Meeting Minutes Template](ctwr-templates/Meeting_Minutes_Template.md)
+- [Recaps Template](ctwr-templates/Recaps_Template.md)
 
 ### FAQ
 

diff --git a/mkdocs.yml b/mkdocs.yml
@@ -11,16 +11,16 @@ theme:
     - search.suggest
     - search.highlight
   palette:
-    primary: blue
-    accent: blue
+    primary: white
+    accent: indigo
     toggle:
       icon: material/brightness-4
       name: Switch
     scheme: default # or light/dark based on preference
   font:
     text: "Roboto, Arial, sans-serif"
     code: "Roboto Mono, Courier New, monospace"
-  logo: assets/civictechwr_logo_white.png
+  logo: assets/civictechwr_logo_black.png
   favicon: assets/civictechwr_logo_white.png
 # Plugins
 plugins:
@@ -52,7 +52,7 @@ nav:
           - Guide: guidelines/Event_Planning_Guide.md
           - Template: ctwr-templates/Event_Planning_Template.md
       - Social Media Guidelines: guidelines/SocialMedia_Guidelines.md
-  - Meeting Minutes:
+  - Recaps:
       - Overview: recaps/index.md # High-level overview for meeting minutes
       - June 18, 2024: recaps/2024-06-19_recap.md
   - Templates: