From eeecde2270a868facceec891d02bc3bbb3d07a8c Mon Sep 17 00:00:00 2001 From: pokonski Date: Fri, 24 May 2024 21:54:37 +0200 Subject: [PATCH] Add Dark mode to the website (#2562) * Add dark mode CSS * Add dark mode variants of logos * Use alternative Github star button with dark mode working * Preserve github stars count when navigation to avoid flickers --- www/content/_index.md | 65 +++++++++------ www/content/docs.md | 2 +- www/static/img/codereviewbot-dark.svg | 22 +++++ www/static/img/commspace-dark.svg | 65 +++++++++++++++ www/static/img/das-filter-dark.svg | 52 ++++++++++++ www/static/img/hydra-hosting-dark.svg | 1 + www/static/img/logo-craft-cms-dark.svg | 3 + www/static/img/pullapprove-logo-dark.svg | 21 +++++ www/static/img/transloadit-logo-dark.svg | 1 + www/static/img/ui-bakery-dark.svg | 10 +++ www/static/img/ui-bakery.png | Bin 1839 -> 0 bytes www/static/img/ui-bakery.svg | 10 +++ www/static/img/v7n-logo-dark.png | Bin 0 -> 5741 bytes www/static/img/vps-server-logo-dark.svg | 1 + www/themes/htmx-theme/static/css/site.css | 96 +++++++++++++++------- www/themes/htmx-theme/templates/base.html | 10 ++- 16 files changed, 302 insertions(+), 57 deletions(-) create mode 100644 www/static/img/codereviewbot-dark.svg create mode 100644 www/static/img/commspace-dark.svg create mode 100644 www/static/img/das-filter-dark.svg create mode 100644 www/static/img/hydra-hosting-dark.svg create mode 100644 www/static/img/logo-craft-cms-dark.svg create mode 100644 www/static/img/pullapprove-logo-dark.svg create mode 100644 www/static/img/transloadit-logo-dark.svg create mode 100644 www/static/img/ui-bakery-dark.svg delete mode 100644 www/static/img/ui-bakery.png create mode 100644 www/static/img/ui-bakery.svg create mode 100644 www/static/img/v7n-logo-dark.png create mode 100644 www/static/img/vps-server-logo-dark.svg diff --git a/www/content/_index.md b/www/content/_index.md index d94d1a28..1d783877 100644 --- a/www/content/_index.md +++ b/www/content/_index.md @@ -90,20 +90,20 @@ if(window.location.search=="?ads=true") { -
-NEWS: htmx finished 2nd in the 2023 +
+NEWS: htmx finished 2nd in the 2023 JavaScript Rising Stars "Front-end Frameworks" category, just behind React (htmx is a library, btw) and #10 overall! Thank you to everyone who starred us!

introduction

-htmx gives you access to [AJAX](@/docs.md#ajax), [CSS Transitions](@/docs.md#css_transitions), [WebSockets](@/docs.md#websockets) and [Server Sent Events](@/docs.md#sse) -directly in HTML, using [attributes](@/reference.md#attributes), so you can build -[modern user interfaces](@/examples/_index.md) with the [simplicity](https://en.wikipedia.org/wiki/HATEOAS) and +htmx gives you access to [AJAX](@/docs.md#ajax), [CSS Transitions](@/docs.md#css_transitions), [WebSockets](@/docs.md#websockets) and [Server Sent Events](@/docs.md#sse) +directly in HTML, using [attributes](@/reference.md#attributes), so you can build +[modern user interfaces](@/examples/_index.md) with the [simplicity](https://en.wikipedia.org/wiki/HATEOAS) and [power](https://www.ics.uci.edu/~fielding/pubs/dissertation/rest_arch_style.htm) of hypertext -htmx is small ([~14k min.gz'd](https://unpkg.com/htmx.org/dist/)), +htmx is small ([~14k min.gz'd](https://unpkg.com/htmx.org/dist/)), [dependency-free](https://github.com/bigskysoftware/htmx/blob/master/package.json), [extendable](https://extensions.htmx.org), IE11 compatible & has **reduced** code base sizes by [67% when compared with react](@/essays/a-real-world-react-to-htmx-port.md) @@ -138,7 +138,7 @@ Read the [docs introduction](@/docs.md#introduction) for a more in-depth... intr

book

-We are happy to announce the release of [Hypermedia Systems](https://hypermedia.systems), a book on how to build +We are happy to announce the release of [Hypermedia Systems](https://hypermedia.systems), a book on how to build [Hypermedia-Driven Applications](@/essays/hypermedia-driven-applications.md) using htmx & more:
@@ -164,8 +164,8 @@ Thank you to all our generous The GPU Marketplace + + The GPU Marketplace + The GPU Marketplace + @@ -183,31 +186,38 @@ Thank you to all our generous Jetbrains - commspace + + commspace + commspace + - GitHub + GitHub - craft cms + + craft cms + craft cms + - ButterCMS + ButterCMS - Black Host + Black Host - V7N + V7N + V7N @@ -215,29 +225,34 @@ Thank you to all our generous - Das Filter + Das Filter + Das Filter - PullApprove + PullApprove + PullApprove - Transloadit + Transloadit + Transloadit - UI Bakery + + UI Bakery + UI Bakery - Deepsource + Deepsource @@ -251,12 +266,13 @@ Thank you to all our generous - Deepsource + Codacy - AI Code Review Bot + AI Code Review Bot + AI Code Review Bot @@ -268,7 +284,8 @@ Thank you to all our generous - VPS Server Hosting in the Cloud: Cost Efficiency + VPS Server Hosting in the Cloud: Cost Efficiency + VPS Server Hosting in the Cloud: Cost Efficiency diff --git a/www/content/docs.md b/www/content/docs.md index adec84ba..d3782ca6 100644 --- a/www/content/docs.md +++ b/www/content/docs.md @@ -817,7 +817,7 @@ htmx has experimental support for declarative use of both [WebSockets](https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications) and [Server Sent Events](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events). -
+
**Note:** In htmx 2.0, these features will be migrated to extensions. These new extensions are already available in htmx 1.7+ and, if you are writing new code, you are encouraged to use the extensions instead. All new feature work for diff --git a/www/static/img/codereviewbot-dark.svg b/www/static/img/codereviewbot-dark.svg new file mode 100644 index 00000000..4f438d24 --- /dev/null +++ b/www/static/img/codereviewbot-dark.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/www/static/img/commspace-dark.svg b/www/static/img/commspace-dark.svg new file mode 100644 index 00000000..beefbafa --- /dev/null +++ b/www/static/img/commspace-dark.svg @@ -0,0 +1,65 @@ + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/www/static/img/das-filter-dark.svg b/www/static/img/das-filter-dark.svg new file mode 100644 index 00000000..e4ecdd49 --- /dev/null +++ b/www/static/img/das-filter-dark.svg @@ -0,0 +1,52 @@ + + + + + + DAS FILTER + + + + + + + + + + + + + + diff --git a/www/static/img/hydra-hosting-dark.svg b/www/static/img/hydra-hosting-dark.svg new file mode 100644 index 00000000..8ac11f99 --- /dev/null +++ b/www/static/img/hydra-hosting-dark.svg @@ -0,0 +1 @@ + diff --git a/www/static/img/logo-craft-cms-dark.svg b/www/static/img/logo-craft-cms-dark.svg new file mode 100644 index 00000000..53f94fb4 --- /dev/null +++ b/www/static/img/logo-craft-cms-dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/www/static/img/pullapprove-logo-dark.svg b/www/static/img/pullapprove-logo-dark.svg new file mode 100644 index 00000000..0000ea8f --- /dev/null +++ b/www/static/img/pullapprove-logo-dark.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/www/static/img/transloadit-logo-dark.svg b/www/static/img/transloadit-logo-dark.svg new file mode 100644 index 00000000..7f7a5a9a --- /dev/null +++ b/www/static/img/transloadit-logo-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/www/static/img/ui-bakery-dark.svg b/www/static/img/ui-bakery-dark.svg new file mode 100644 index 00000000..de6f05e8 --- /dev/null +++ b/www/static/img/ui-bakery-dark.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/www/static/img/ui-bakery.png b/www/static/img/ui-bakery.png deleted file mode 100644 index f99290fb555ff15969ecc0c4a5e0aec6ff26677d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1839 zcmV+~2hjM5P)KNRjV|kRtCyNRR6kAw}khkRs2DkRo>?q{sY3NReYj z$e&%i+fEdQ!Z4g~Cn0~3(BA*W&Z@L1>^)M}XwV_gVY@`&l|Xo6KE$P2NA z7UYE_h=Nzm0epePCDj}u6C{IC%^?Oz`Zio0g}}K{HAf*Zx(!zc;z2%Ca~K|ktZEL! zgOqkQKNv}q4{uW#h~Q|@{n$<^b?_jRFEx_J5`{L7RYR-Ehb@p$d(pR&If#o&sjLB@ zB{>k?Og?;%g?0f}3lGw-@4~km@&}>$x1X@k?m5=NgJ>^2#Ff!I6e;v0tG7cyQd5ur zrijLmH$3YNlv$7cMY`FjuHyXHq$a7GskPXxrO}=*i1)0=2J(u*EQmXX_^e0Vjhy~G zS&)m2Jxa|W0NK+8F@#-G)gVB3wjcrfI8!$W(z${d>{TiUfjw0ajoobJAo@%}EcVlt zgTN@p8=L(<2Qk^^7keldAkryXn*u?UD+l>p#Yo!Wiz}D^v?2Z(?N z50G*59^wZ$_v9cGEe1&rOEltc5W;M{^TL1c*#?FA+q%U&gH^s9=r&?xtm3K zCkznf(Fe#VP5YQ0Yq~~|!Z)_V-XMklhK<|0PX|UXzT5IMa8eJ^{p!s{?^w3y2QfV# z4Gi`MiNd-O{-)o|rF4YDBAgTZzK zv4vs5Q_!^X8Z=n3d~<(qQ08cWpmb*;&%vwOX+VOPm`M!jna?X9ITmz|O)Q zxCG<)uzKrw8Ni(d#J!3sVdh(3ZdD*z$W<1cF8$|q7P=*@=BC0ZxNHxf3iOevd|E{ZtQcQq5(J*(@r3Bd55XU@qiiv*#y%vjp?!hMA>Rz92Ww2bEDve zd0vtluHovZf!NX&SX?5o07SC+7Yi+RyMSPb@aQFV$8dIRBT5+;6^OwR;aV%3jm zM1ZvW(h-q761u1%kbSqt&%>YcrOqv)y_`?QG`ZI zm4+b@6bT4Ngvg;E?SwYH{XixF-w(vN;y%^w{#kVaVT|45!ncfmMd>cNvP^vt$Oakq z&TT->w0E5#5R@JeAOO5yT8T=P&fE$jqR*sQuR40&WWPr$B**0`k)X0w2 zK_G7Pt*^{5<$8-Oqk(c z2l}EI(#^3lbcIJ<`E2`+^a#iH!+xv!J+kLdryLyOpy|T#F7HnC3w*izdA}L{b}hF) z31@eS=XJ7w6|ZBIOR>&NikDwpx^(H%rAwFov + + + + + + + + + diff --git a/www/static/img/v7n-logo-dark.png b/www/static/img/v7n-logo-dark.png new file mode 100644 index 0000000000000000000000000000000000000000..b4b89ebae70a092eb6d6a70afc64195d24e011f3 GIT binary patch literal 5741 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 UJR*{C@Q1MJX)D9>Q?Akf0e%eTHUIzs literal 0 HcmV?d00001 diff --git a/www/static/img/vps-server-logo-dark.svg b/www/static/img/vps-server-logo-dark.svg new file mode 100644 index 00000000..8f727352 --- /dev/null +++ b/www/static/img/vps-server-logo-dark.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/www/themes/htmx-theme/static/css/site.css b/www/themes/htmx-theme/static/css/site.css index 5e78f447..1a3a245a 100644 --- a/www/themes/htmx-theme/static/css/site.css +++ b/www/themes/htmx-theme/static/css/site.css @@ -1,6 +1,47 @@ :root { - --midBlue: #3366cc; + --alertBackground: whitesmoke; + --alertBorder: lightgrey; + --alertShadow: darkgray; + --anchorColor: #3366cc; + --bodyBackground: white; + --footerBackground: #f6f6f6; --lightBlue: #3d72d7; + --midBlue: #3366cc; + --searchBorder: #eee; + --textColor: #111; + --topNavBackground: linear-gradient(#fff, #f4f5f5); + --topNavBorder: #d0d0d0; + --topNavShadow: #efefef; + color-scheme: light dark; +} + +@media (prefers-color-scheme: dark) { + :root { + --alertBackground: #161719; + --alertBorder: #41464b; + --alertShadow: rgba(0, 0, 0, 0.15); + --anchorColor: #e2dada; + --bodyBackground: #1f1f1f; + --footerBackground: #1a1d1e; + --midBlue: #5b96d5; + --searchBorder: #495057; + --textColor: #c7c4c1; + --topNavBackground: linear-gradient(#161718, #1b1d1f); + --topNavBorder: #41464b; + --topNavShadow: #2d2d2d; + } + + .dark-invert { + filter: invert(1); + } + + .dark-visible { + display: block; + } + + .dark-hidden { + display: none; + } } body { @@ -8,16 +49,31 @@ body { margin: 0px; line-height: 1.5em; font-size: 16px; - color: #111; - background-color: white; + color: var(--textColor); + background-color: var(--bodyBackground); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important; } +@media (prefers-color-scheme: light) { + .dark-visible { + display: none; + } +} + table { font-size: 16px; } +.alert { + border: 1px solid var(--alertBorder); + margin: 24px 8px; + padding: 12px; + border-radius: 8px; + background-color: var(--alertBackground); + filter: drop-shadow(3px 3px var(--alertShadow)); +} + .info-table table tbody tr td:first-of-type { white-space: nowrap; } @@ -50,10 +106,10 @@ table { .top-nav { line-height: 30px; - border-bottom: 1px solid #d0d0d0; + border-bottom: 1px solid var(--topNavBorder); margin: 0px; - background-image: linear-gradient(#fff, #f4f5f5); - box-shadow: 0px 4px 15px 0px rgb(239, 239, 239); + background-image: var(--topNavBackground); + box-shadow: 0px 4px 15px 0px var(--topNavShadow); margin-bottom:1em; } @@ -86,7 +142,7 @@ code:not(code[class*="language-"]) { box-shadow: inset 0px 11px 8px -10px #262626, inset 0px -11px 8px -10px #262626; - border-bottom: 1px solid whitesmoke; + border-bottom: 1px solid var(--topNavBorder); } .dark-hero * { opacity: 0; @@ -329,8 +385,8 @@ transition: visibility 0s 1s, opacity 1s linear; padding:1em 0; } -.github-stars iframe{ - max-width:95px +.github-stars { + margin-top: 5px; } /* Content */ @@ -376,13 +432,6 @@ h1,h2,h3,h4{ .navigation-items > *:not(:last-child){ margin-right: calc(.5em + .7vw); } - .github-stars{ - display:flex; - align-items:center; - } - .github-stars a{ - margin:0 calc(.5em + .7vw); - } /* Content */ .content .col:not(:nth-child(1)):not(.nav) { @@ -415,16 +464,6 @@ h1,h2,h3,h4{ } -@media(max-width:45rem) { - .github-stars{ - text-align:center; - margin-top:1em; - } - .github-stars a{ - display:block; - } -} - .logo-wrapper { white-space: nowrap; @@ -440,7 +479,7 @@ background: none; transition: all .2s ease-in-out; width: 2.5rem; padding: 4px 6px; - border: 2px solid #eee; + border: 2px solid var(--searchBorder); border-radius: 10px; margin-right: 10px; outline: 0; @@ -462,7 +501,7 @@ footer { margin-top: 2em; padding-top: 2em; padding-bottom: 5em; -background-color: #f6f6f6; +background-color: var(--footerBackground); } footer .footer-menu { @@ -491,6 +530,7 @@ pre[class|="language"] { margin-left: -1.3rem; margin-right: .3rem; opacity: 40%; + color: var(--anchorColor); } .zola-anchor:hover { opacity: 95%; diff --git a/www/themes/htmx-theme/templates/base.html b/www/themes/htmx-theme/templates/base.html index 5ee3c22a..f35c6735 100644 --- a/www/themes/htmx-theme/templates/base.html +++ b/www/themes/htmx-theme/templates/base.html @@ -52,9 +52,11 @@
-
-
- +
+
+ Star +
+
@@ -98,6 +100,6 @@ - +