github.com/GenderDysphoria.fyi
1
0
Fork 1
mirror of https://github.com/GenderDysphoria/GenderDysphoria.fyi.git synced 2025-11-25 20:42:40 +00:00
Code Activity

Dark Mode (#168)

Browse Source 
* Implement toggle button

* Dark mode mixins

* Dark mode color design

* Disable dark mode for prints

* Initial dark mode design

* Fix light mode mixin

* Disable dark mode on print style

* Move dark mode color scheme below the default style to allow referencing

* Fix dropdown

* Fix device-based dark mode

* Dark mode index page design

* Responsive auxiliary nav with dark mode toggle

* Remove box shadow when on smaller displays

* Prevent default on toggle click

* Move attribution/licensing to README.md

* Fix header padding on index page

* Background color transition animation

* Remove margin on index when on mobile displays

* Remove neon border when on mobile

* Fix post-header margin on mobile

* Lighten card headers in dark mode
This commit is contained in:
Dex
2025-06-08 19:26:27 -07:00
committed by GitHub
parent 0936e3718c
commit 26aba42e2f
17 changed files with 372 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
scss/style.scss
View File

@@ -52,7 +52,18 @@ $primary: #fc0a7e;
$header-bg-1: #E81179;
$header-bg-2: #281362;
$header-bg-mid: mix($header-bg-1, $header-bg-2);
$header-full-height: 100px;
$header-desktop-height: 100px;
$header-mobile-height: 142px;
/* -- Dark Mode -- */
$body-bg-dark: black;
$body-color-dark: #e2e2e2;
$content-bg-dark: #222;
$gutter-bg-dark: #171717;
$gutter-border-dark: #fc0a7e;
$primary-light-dark: lighten($primary, 10%);
$primary-lighter-dark: lighten($primary, 10%);
@import "bootstrap/scss/functions";
@import "bootstrap/scss/variables";
@@ -94,8 +105,10 @@ $header-full-height: 100px;
@import "bootstrap/scss/utilities";
// @import "bootstrap/scss/print";
@import "./dark";
@import "./global";
@import "./header";
@import "./dropdown";
@import "./footer";
@import "./tweet";
@import "./index";
@@ -108,4 +121,4 @@ $header-full-height: 100px;
@import "./longform";
@import "./font-compatibility";
|node_modules/magnific-popup/dist/magnific-popup.css|
//|node_modules/magnific-popup/dist/magnific-popup.css|