summaryrefslogtreecommitdiff
path: root/resources/sass
diff options
context:
space:
mode:
authordev2026-06-27 07:37:59 +0200
committerdev2026-06-27 07:37:59 +0200
commitf3c19bdbf58ff5a6220fea40b7fd9576230564c8 (patch)
tree957810f7a0b6afe7aaad788ee01f3d784321aa70 /resources/sass
parent79176271ec34b555b564572e02c57a979dbaddc7 (diff)
downloadcurious-f3c19bdbf58ff5a6220fea40b7fd9576230564c8.tar.gz
style: apply neon gaming theme from template.css
- Dark palette: #1a1e23 bg, #232830 surface, #2f363f borders - Neon cyan (#00e5d4) primary, pink (#ff2e63) accent - Navbar: frosted glass with backdrop blur, border bottom - Cards: dark surface with subtle shadow and border - Custom scrollbar: dark themed - CSS variables for theme colors in inline styles - All text: light (#e2e8f0) on dark backgrounds
Diffstat (limited to 'resources/sass')
-rw-r--r--resources/sass/_background.scss28
-rw-r--r--resources/sass/_navbar.scss43
-rw-r--r--resources/sass/_variables.scss55
3 files changed, 92 insertions, 34 deletions
diff --git a/resources/sass/_background.scss b/resources/sass/_background.scss
index 4ef03bd..a848474 100644
--- a/resources/sass/_background.scss
+++ b/resources/sass/_background.scss
@@ -5,22 +5,26 @@ html {
body {
width: 100%;
height: auto;
- min-height:35rem;
- background: linear-gradient(to bottom, rgba(1,1,1,.25) 0%, rgba(1,1,1,.45) 90%, rgba(2, 11, 26, 0.65) 100%), url("/img/world-bg.jpg");
- background-color: rgba(2, 11, 26, 0.65);
- background-position: center;
+ min-height: 35rem;
+ background-color: #1a1e23;
+ background-image: linear-gradient(to bottom, rgba(1,1,1,.35) 0%, rgba(1,1,1,.55) 90%, rgba(26, 30, 35, 0.8) 100%), url("/img/world-bg.jpg");
+ background-position: center top;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
+ color: #e2e8f0;
}
-.cover-container {
- color: white;
- max-width: 42em;
+
+::-webkit-scrollbar {
+ width: 8px;
+}
+::-webkit-scrollbar-track {
+ background: #1a1e23;
}
-.cover {
- padding: 0 1.5rem;
+::-webkit-scrollbar-thumb {
+ background: #2b313b;
+ border-radius: 4px;
}
-.cover .btn-lg {
- padding: .75rem 1.25rem;
- font-weight: 700;
+::-webkit-scrollbar-thumb:hover {
+ background: #2f363f;
}
diff --git a/resources/sass/_navbar.scss b/resources/sass/_navbar.scss
index 7e3daa8..94d8a02 100644
--- a/resources/sass/_navbar.scss
+++ b/resources/sass/_navbar.scss
@@ -1,25 +1,40 @@
.navbar {
- background-color: rgba(0,0,0,0) !important;
+ background-color: rgba(26, 30, 35, 0.95) !important;
+ backdrop-filter: blur(10px);
+ border-bottom: 1px solid #2f363f;
}
-.navbar-toggler {
- border-color: #808080;
+
+.navbar-brand {
+ color: #00e5d4 !important;
+ font-weight: 700;
+ letter-spacing: 0.5px;
}
.navbar-dark .nav-link {
- color: darken( #fff, 10% ) !important;
+ color: #94a3b8 !important;
+ font-weight: 600;
+ font-size: 0.85rem;
+ text-transform: uppercase;
+ letter-spacing: 0.5px;
+ padding: 0.5rem 1rem;
+ transition: color 0.2s;
}
-@media( min-width: 768px ) {
- .navbar-searchform {
- margin-left: 0.5rem;
- }
+.navbar-dark .nav-link:hover {
+ color: #00e5d4 !important;
+ text-decoration: none !important;
}
-.nav-link:hover {
- text-decoration: underline !important;
-}
.nav-bar-divider {
- display: inline;
- padding: 0 8px;
- font-size: 0.9rem;
+ display: inline;
+ padding: 0 8px;
+ color: #94a3b8;
+ opacity: 0.5;
+ user-select: none;
+}
+
+@media (min-width: 768px) {
+ .navbar-searchform {
+ margin-left: 0.5rem;
+ }
}
diff --git a/resources/sass/_variables.scss b/resources/sass/_variables.scss
index 0407ab5..7d3fa82 100644
--- a/resources/sass/_variables.scss
+++ b/resources/sass/_variables.scss
@@ -1,19 +1,58 @@
// Body
-$body-bg: #f8fafc;
+$body-bg: #1a1e23;
+$body-color: #e2e8f0;
// Typography
-$font-family-sans-serif: 'Nunito', sans-serif;
+$font-family-sans-serif: 'Inter', 'Nunito', sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;
-// Colors
-$blue: #3490dc;
+// Colors - Neon Gaming Theme
+$primary: #00e5d4;
+$secondary: #2b313b;
+$blue: #00e5d4;
$indigo: #6574cd;
-$purple: #9561e2;
-$pink: #f66d9b;
+$purple: #a855f7;
+$pink: #ff2e63;
$red: #e3342f;
$orange: #f6993f;
$yellow: #ffed4a;
$green: #38c172;
-$teal: #4dc0b5;
-$cyan: #6cb2eb;
+$teal: #00e5d4;
+$cyan: #00e5d4;
+
+// Surface colors
+$dark: #232830;
+$gray-dark: #2b313b;
+$gray: #2f363f;
+$light: #e2e8f0;
+
+// Bootstrap overrides
+$card-bg: #232830;
+$card-border-color: #2f363f;
+$card-cap-bg: rgba(0,0,0,0.2);
+$card-border-radius: 0.5rem;
+
+$input-bg: #2b313b;
+$input-color: #e2e8f0;
+$input-border-color: #2f363f;
+
+$pagination-color: #e2e8f0;
+$pagination-bg: #232830;
+$pagination-border-color: #2f363f;
+$pagination-active-bg: #00e5d4;
+$pagination-active-border-color: #00e5d4;
+$pagination-active-color: #000;
+
+$navbar-dark-color: #94a3b8;
+$navbar-dark-active-color: #00e5d4;
+
+$badge-font-size: 0.8rem;
+$badge-padding-y: 0.3em;
+$badge-padding-x: 0.6em;
+
+$border-color: #2f363f;
+
+// Button overrides
+$btn-padding-y: 0.5rem;
+$btn-padding-x: 1rem;