Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Dark theme #969

Open
wants to merge 28 commits into
base: master
Choose a base branch
from
Open

Dark theme #969

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
b76816b
add simple auto dark mode
xhdix Sep 26, 2021
a6d4f6d
change theme colors to variable
xhdix Sep 26, 2021
a63d859
add a button to toggle theme
xhdix Sep 27, 2021
61f4385
add theme-based homepage logo
xhdix Sep 27, 2021
e17bd98
change toggle button for theme
xhdix Sep 27, 2021
cdc34af
change dark colors
xhdix Sep 28, 2021
356c9c7
add filter to theme toggle button
xhdix Sep 28, 2021
03824ea
IE support for colors
xhdix Oct 1, 2021
151fc94
change the base blue for dark theme
xhdix Oct 1, 2021
585c805
change pgp key section
xhdix Oct 1, 2021
aa03fca
change feature-container section's color for dark theme
xhdix Oct 1, 2021
79d4e8a
add a logo with inverted text color for dark theme
xhdix Oct 1, 2021
e803322
change pgp section design in the about page
xhdix Oct 1, 2021
27825fb
change partner logo box colors only for dark theme
xhdix Oct 1, 2021
1afdb18
having less pure white in buttons for dark theme
xhdix Oct 1, 2021
2712ec5
undo some color changes
xhdix Oct 1, 2021
873f2c9
make partner logos visible in the dark theme
xhdix Oct 1, 2021
e82b684
add new icons in the data page for dark theme
xhdix Oct 1, 2021
684b73a
change a few colors for dark theme
xhdix Oct 1, 2021
cbe4e0b
change button color
xhdix Oct 1, 2021
3d8b6fc
change the background of transparrent images in dark theme
xhdix Oct 5, 2021
206e00f
move theme switcher to the footer and improve code
xhdix Oct 6, 2021
d22c434
switch pictures manually per theme
xhdix Oct 6, 2021
f9f6c6c
refactor the theme switcher code
xhdix Oct 6, 2021
a89f164
add background and effect to theme switcher
xhdix Oct 6, 2021
6d09d80
set theme color correctly
xhdix Oct 6, 2021
dc26a8c
improve: change the icon of auto mode
xhdix Nov 1, 2021
1e118f6
Merge branch 'master' into dark-theme
xhdix Jan 17, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 16 additions & 1 deletion layouts/_default/baseof.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@

<link rel="canonical" href="https://ooni.org{{ .RelPermalink }}" />
<meta name='description' content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />


<meta name="theme-color" content="#0588cb">
<meta name="color-scheme" content="light dark">

{{ partial "opengraph.html" . }}
{{ partial "twitter_cards.html" . }}

Expand Down Expand Up @@ -156,6 +159,17 @@
</a>
</li>
</ul>
<ul class="pt-1 footer-theme-buttons">
<li id="lightModeBtn" onclick="setTheme(this,'light')" title="Light mode">
<span class="lightsvg"></span>
</li>
<li id="darkModeBtn" onclick="setTheme(this,'dark')" title="Dark mode">
<span class="darksvg"></span>
</li>
<li id="autoModeBtn" onclick="setTheme(this,'auto')" title="Auto mode">
<span class="autosvg"></span>
</li>
</ul>
</div>
</div>

Expand All @@ -165,6 +179,7 @@
</footer>
{{ end }}

<script type="text/javascript" src="/js/set-theme.js" defer></script>
{{ block "script" . }}
{{ end }}
</body>
Expand Down
20 changes: 11 additions & 9 deletions layouts/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,16 @@

<div class="container mt-5 pb-4">
<div class="col text-center">
<img src="/images/logos/OONI-VerticalColor.png"
srcset="/images/logos/OONI-VerticalColor.png 1x,
/images/logos/[email protected] 2x">
<h1 class="article-title">{{ .Params.leadTitle }}</h1>
<p class="lead">{{ .Params.leadDescription }}</p>
<picture>
<source srcset="/images/logos/OONI-VerticalColor.png 1x,
/images/logos/[email protected] 2x"
media="(prefers-color-scheme: light) or (prefers-color-scheme: no-preference)">
<source srcset="/images/logos/OONI-VerticalColor-Inverted.png 1x,
/images/logos/[email protected] 2x" media="(prefers-color-scheme: dark)">
<img src="/images/logos/OONI-VerticalColor.png" alt="OONI logo">
</picture>
<h1 class="article-title">{{ .Params.leadTitle }}</h1>
<p class="lead">{{ .Params.leadDescription }}</p>
</div>
</div>

Expand Down Expand Up @@ -124,10 +129,7 @@ <h2 class="overlined">Contact</h2>
<div class="col-lg-9 col-md-12">
<p>Contact the OONI team by sending an email to <strong>[email protected]</strong>.
Encrypted emails can be sent using the following PGP key:</p>
<p class="fingerprint">
Key ID: 6B2943F00CB177B7<br>
Fingerprint: 4C15 DDA9 96C6 C0CF 48BD 3309 6B29 43F0 0CB1 77B7
</p>
<pre>&#x1f512; <code style="font-size: 1rem;">Key ID: 6B2943F00CB177B7<br/> Fingerprint: 4C15 DDA9 96C6 C0CF 48BD 3309 6B29 43F0 0CB1 77B7</code></pre>
</div>
</div>
</div>
Expand Down
7 changes: 6 additions & 1 deletion layouts/install/single.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,12 @@
<main class="col mt-5 pr-5">
<div class="row">
<div class="col text-center">
<img src="/install/index.svg" style="max-width: 332px;"/>
<picture>
<source srcset="/install/OONI-logo-horizontal.svg"
media="(prefers-color-scheme: light) or (prefers-color-scheme: no-preference)">
<source srcset="/install/OONI-logo-horizontal-inverted.svg" media="(prefers-color-scheme: dark)">
<img src="/install/OONI-logo-horizontal.svg" style="max-width: 332px;" alt="OONI logo">
</picture>
<h1 class="article-title">{{ .Params.leadTitle }}</h1>
<p class="lead">{{ .Params.leadDescription }}</p>
</div>
Expand Down
11 changes: 5 additions & 6 deletions layouts/section/about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,12 +46,11 @@ <h2>Contact</h2>

<p>Encrypted emails can be sent using the <a href="https://keyserver.ubuntu.com/pks/lookup?fingerprint=on&op=index&search=0x4C15DDA996C6C0CF48BD33096B2943F00CB177B7">following PGP key</a>:</p>

<p class="fingerprint">
pub 4096R/6B2943F00CB177B7 2016-03-23<br>
Key fingerprint = 4C15 DDA9 96C6 C0CF 48BD 3309 6B29 43F0 0CB1 77B7<br>
uid [ultimate] OONI - Open Observatory of Network Interference<br>
sub 4096R/8EBD2087374399AB 2016-03-23<br>
</p>
<pre>&#x1f512; <code style="font-size: 1rem;">pub 4096R/6B2943F00CB177B7 2016-03-23
Key fingerprint = 4C15 DDA9 96C6 C0CF 48BD 3309 6B29 43F0 0CB1 77B7
uid [ultimate] OONI - Open Observatory of Network Interference
sub 4096R/8EBD2087374399AB 2016-03-23
</code></pre>

<p>For real-time communication, you can reach us on <a href="https://slack.ooni.org/">Slack</a> or <a href="ircs://irc.oftc.net:6697/#ooni">IRC</a>.</p>

Expand Down
16 changes: 14 additions & 2 deletions layouts/section/data.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,12 @@
<div class="row justify-content-around pt-5">
<div class="col-12 col-sm-4">
<a href="https://explorer.ooni.org">
<img src="/data/ooni-explorer.png" class="xs-center" id="ooni-explorer" />
<picture>
<source srcset="/data/ooni-explorer.svg"
media="(prefers-color-scheme: light) or (prefers-color-scheme: no-preference)">
<source srcset="/data/ooni-explorer-inverted.svg" media="(prefers-color-scheme: dark)">
<img src="/data/ooni-explorer.svg" class="xs-center" id="ooni-explorer" alt="OONI Explorer" />
</picture>
</a>
<p style="padding-top: 30px">
<a href="https://explorer.ooni.org/">OONI Explorer</a>
Expand All @@ -14,7 +19,14 @@
</p>
</div>
<div class="col-12 col-sm-4">
<a href="https://api.ooni.io"><img class="xs-center" src="/data/ooni-api.png" id="ooni-api"/></a>
<a href="https://api.ooni.io">
<picture>
<source srcset="/data/ooni-api.svg"
media="(prefers-color-scheme: light) or (prefers-color-scheme: no-preference)">
<source srcset="/data/ooni-api-inverted.svg" media="(prefers-color-scheme: dark)">
<img src="/data/ooni-api.svg" class="xs-center" id="ooni-api" alt="OONI API" />
</picture>
</a>
<p style="padding-top: 30px">
The <a href="https://api.ooni.io/">OONI API</a> enables you to perform your own analysis of OONI data.
For batch consumption of OONI data, you can fetch the whole OONI dataset from the <a
Expand Down
7 changes: 6 additions & 1 deletion layouts/section/install.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,12 @@
<main class="col pt-3">
<div class="row">
<div class="col text-center">
<img src="/install/index.svg" style="max-width:300px;"/>
<picture>
<source srcset="/install/OONI-logo-horizontal.svg"
media="(prefers-color-scheme: light) or (prefers-color-scheme: no-preference)">
<source srcset="/install/OONI-logo-horizontal-inverted.svg" media="(prefers-color-scheme: dark)">
<img src="/install/OONI-logo-horizontal.svg" style="max-width: 332px;" alt="OONI logo">
</picture>
<h1 class="mt-2 article-title">Measure internet censorship</h1>
</div>
</div>
Expand Down
Loading