Git-Mirrors/privacyguides.org
1
0
Fork 0
mirror of https://github.com/privacyguides/privacyguides.org.git synced 2024-10-01 01:35:57 -04:00
Code Issues Packages Projects Releases Wiki Activity

Re-enable dark mode

Browse Source
This commit is contained in:
Jonah Aragon 2021-09-13 09:55:26 -05:00
parent 70b3f7ecdf
commit eee9735cb0
No known key found for this signature in database
GPG Key ID: 6A957C9A9A9429F7
6 changed files with 91 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
_includes/head.html
View File

@ -12,7 +12,7 @@
<title>{{ page.title }} | {{ site.title }}</title>
<meta property="og:title" content="{{ page.title | escape }} | {{ site.title | escape }}" />
{% else %}
<title>{{ site.title }}</title>
<title>{{ site.title }}{%if page.url == "/" %} — Your Central Privacy and Security Resource{% endif %}</title>
<meta property="og:title" content="{{ site.title | escape }}" />
{% endif %}
<meta property="og:type" content="website" />
@ -36,5 +36,5 @@
<!-- CSS stylesheets -->
<link href="/assets/css/app.css?v=20210506" rel="stylesheet">
<link href="/assets/fonts/vendor/fontawesome/css/all.min.css?v=6.0.0-beta1" rel="stylesheet">
<!--<link id="dark-css" href="/assets/css/dark.css?v=20210506" rel="stylesheet" media="(prefers-color-scheme: dark)">-->
<link id="dark-css" href="/assets/css/dark.css?v=20210506" rel="stylesheet" media="(prefers-color-scheme: dark)">
</head>

2
_includes/nav.html
View File

@ -2,7 +2,7 @@
<div class="container">
<a class="navbar-brand" href="/">
<picture>
<source srcset="/assets/img/layout/privacy-guides-logo-dark.svg" media="(prefers-color-scheme: dark)">
<!--<source srcset="/assets/img/layout/privacy-guides-logo-dark.svg" media="(prefers-color-scheme: dark)">-->
<img src="/assets/img/layout/privacy-guides-logo-light.svg" alt="Privacy Guides Logo" width="300" height="39">
</picture>
</a>

2
_layouts/post.html
View File

@ -2,7 +2,7 @@
layout: default
---
<div class="p-5 mb-3 text-light bg-dark"{% if page.cover %} style="background-image: {{ page.color | default: "linear-gradient(to bottom, rgba(40, 50, 63, 0.3), rgba(40, 50, 63, 0.9))" }}, url(/assets/img/blog/{{ page.cover }}); background-size: cover; background-position: center;"{% endif %}>
<div class="p-5 mb-3 text-light bg-700"{% if page.cover %} style="background-image: {{ page.color | default: "linear-gradient(to bottom, rgba(40, 50, 63, 0.3), rgba(40, 50, 63, 0.9))" }}, url(/assets/img/blog/{{ page.cover }}); background-size: cover; background-position: center;"{% endif %}>
<div class="container">
<div class="post-cover">
<div class="inner d-flex flex-column align-self-end" style="min-height: 300px;">

39
assets/css/app.scss
View File

@ -5,6 +5,45 @@
@import "./node_modules/bootstrap/scss/variables";
@import "variables";
@import "./node_modules/bootstrap/scss/mixins";
@import "./node_modules/bootstrap/scss/utilities";
$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans, $grays);
$utilities: map-merge(
$utilities,
(
"color": map-merge(
map-get($utilities, "color"),
(
values: map-merge(
map-get(map-get($utilities, "color"), "values"),
(
$all-colors
),
),
),
),
)
);
$utilities: map-merge(
$utilities,
(
"background-color": map-merge(
map-get($utilities, "background-color"),
(
values: map-merge(
map-get(map-get($utilities, "background-color"), "values"),
(
$all-colors
),
),
),
),
)
);
.container-fullwidth {
margin: 0 auto;
width: 100%;

55
assets/css/dark.scss
View File

@ -3,8 +3,8 @@
@import "./node_modules/bootstrap/scss/functions";
@import "brand";
$primary: darken( $primary, 50% );
$secondary: lighten( $secondary, 10% );
$primary: #EAB448;
//$secondary: lighten( $secondary, 10% );
$success: darken( $success, 10% );
$info: darken( $info, 5% );
$danger: lighten( $warning, 20% );
@ -14,7 +14,7 @@ $body-bg: $dark;
$card-bg: lighten( $dark, 5% );
$body-color: $light;
$link-color: lighten( $secondary, 30% );
$mark-bg: darken( $primary, 10% );
$mark-bg: darken( $primary, 60% );
$breadcrumb-bg: lighten( $dark, 5% );
$hr-border-color: $body-color;
@ -33,15 +33,15 @@ $table-border-color: lighten( $dark, 20% );
$table-active-bg: rgba($white, .075);
$table-head-color: $white;
$navbar-light-color: rgba($white, .5);
$navbar-light-hover-color: rgba($white, .75);
/*$navbar-light-color: ;
$navbar-light-hover-color: ;
$navbar-light-active-color: $white;
$navbar-light-disabled-color: rgba($white, .25);
$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>");
$navbar-light-toggler-border-color: rgba($white, .1);
$navbar-light-toggler-border-color: rgba($white, .1);*/
$dropdown-bg: $card-bg;
$dropdown-link-color: $navbar-light-color;
$dropdown-link-hover-color: $navbar-light-active-color;
$dropdown-link-color: rgba($white, .5);
$dropdown-link-hover-color: rgba($white, .75);
$dropdown-link-hover-bg: lighten( $dropdown-bg, 10% );
.container-fullwidth {
@ -49,6 +49,45 @@ $dropdown-link-hover-bg: lighten( $dropdown-bg, 10% );
width: 100%;
}
@import "./node_modules/bootstrap/scss/mixins";
@import "./node_modules/bootstrap/scss/utilities";
$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans, $grays);
$utilities: map-merge(
$utilities,
(
"color": map-merge(
map-get($utilities, "color"),
(
values: map-merge(
map-get(map-get($utilities, "color"), "values"),
(
$all-colors
),
),
),
),
)
);
$utilities: map-merge(
$utilities,
(
"background-color": map-merge(
map-get($utilities, "background-color"),
(
values: map-merge(
map-get(map-get($utilities, "background-color"), "values"),
(
$all-colors
),
),
),
),
)
);
// import /_sass/bootstrap.scss
@import "./node_modules/bootstrap/scss/bootstrap";
@import "ptio-font";

2
index.html
View File

@ -4,7 +4,7 @@ layout: default
<div class="p-5 mb-3 bg-primary">
<div class="container">
<div class="row">
<div class="row text-800">
<div class="col-lg-8 col-12 mt-4">
<h1 class="display-3 pt-3 mt-5">The guide to restoring your online privacy.</h1>
<h5 class="mt-5">Massive organizations are monitoring your online activities. Privacy Guides is your central privacy and security resource to protect yourself online.</h5>