aljaz/njump
1
0
Fork 0
mirror of https://github.com/aljazceru/njump.git synced 2026-02-22 22:44:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

tailwind .theme-toggle

Browse Source
This commit is contained in:
fiatjaf
2023-10-25 06:56:56 -03:00
parent 3c71ed4e62
commit 2f9c2ab851
3 changed files with 3 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
static/styles.css
View File

@@ -38,50 +38,6 @@ body {
}
}
.theme-toggle {
position: fixed;
top: 1rem;
right: 1rem;
width: 1rem;
height: 1rem;
border-radius: 50%;
cursor: pointer;
}
.theme--default .theme-toggle {
color: #f3f3f3;
}
.theme--dark .theme-toggle {
color: #3d3d3d;
}
@media (max-width: 580px) {
.theme-toggle {
position: relative;
float: right;
top: 0;
right: 0;
}
}
@media print {
.theme-toggle {
display: none;
}
}
.sun {
display: none;
}
.moon {
display: block;
}
.theme--dark .sun {
display: block;
}
.theme--dark .moon {
display: none;
}
.columnA {
position: -webkit-sticky;
position: sticky;

38
static/styles.scss
View File

@@ -118,44 +118,6 @@ body {
}
}
.theme-toggle {
position: fixed;
top: 1rem;
right: 1rem;
width: 1rem;
height: 1rem;
@include themed() {
color: t($theme-toggle);
}
border-radius: 50%;
cursor: pointer;
@media (max-width: 580px) {
position: relative;
float: right;
top: 0;
right: 0;
}
@media print {
display: none;
}
}
.sun {
display: none;
}
.moon {
display: block;
}
.theme--dark {
.sun {
display: block;
}
.moon {
display: none;
}
}
.columnA {
position: -webkit-sticky;
position: sticky;

6
templates/top.html
View File

@@ -3,14 +3,14 @@
>What is <span class="text-strongpink">Nostr</span>?</a
>
<div
class="theme-toggle"
class="relative sm:fixed float-right sm:float-none w-4 h-4 cursor-pointer rounded-full sm:right-4 sm:top-4 text-gray-100 dark:text-gray-700 print:hidden;"
_="on click tell <html /> toggle between .theme--dark and .theme--default then get your @class then get it[0].split('--')[1].split(' ')[0] then set localStorage.theme to it
on load tell <html /> get localStorage.theme then if it is 'dark' add .theme--dark then remove .theme--default else if it is not 'default' then get window.matchMedia('(prefers-color-scheme: dark)').matches then if it is true add .theme--dark then remove .theme--default end"
>
<svg
aria-hidden="true"
data-prefix="fas"
class="moon"
class="block dark:hidden"
role="img"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
@@ -23,7 +23,7 @@
<svg
aria-hidden="true"
data-prefix="fas"
class="sun"
class="hidden dark:block"
role="img"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"