death.au/Neighbourhood.omg.lol
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Light theme!

Browse source
This commit is contained in:
Gordon Pedersen 2024-07-25 15:00:46 +10:00
parent b074b9d453
commit 72c6b590f1
4 changed files with 82 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
Components/Layout/AvatarMenuLinks.razor
View file

@ -34,6 +34,10 @@
<i class="fa-duotone fa-seedling"></i>
<span>/Now</span>
</a>
<a class="indent row" href="/person/@State.SelectedAddressName#pastebin">
<i class="fa-solid fa-clipboard"></i>
<span>Pastebin</span>
</a>
}
}

2
Components/Pages/Directory.razor
View file

@ -35,7 +35,7 @@
catch (Exception) { }
}
<li>
<a class="chip medium no-border no-margin" href="/person/@address">
<a class="chip medium no-border tiny-margin transparent" href="/person/@address">
<img class="circle avatar responsive" src="https://profiles.cache.lol/@linkAddress/picture">
<span>@displayAddress</span>
</a>

2
Components/PasteCard.razor
View file

@ -19,7 +19,7 @@
<i class="fa-solid fa-share-nodes"></i>
</button>
</nav>
<small class="nowrap gray-5-fg"><i class="fa-solid fa-clock tiny"></i> @Paste.RelativeTime</small>
<small class="nowrap chip no-border"><i class="fa-solid fa-clock tiny"></i> @Paste.RelativeTime</small>
@if(MarkupView){
<div class="padding">
@Utilities.MdToHtmlMarkup(Paste.Content)

94
wwwroot/css/color.css
View file

@ -9,33 +9,91 @@ body.dark {
--on-background: var(--gray-1);
--surface: var(--gray-9);
--on-surface: var(--gray-4);
--on-surface-variant: var(--gray-6);
}
.author { color: inherit }
@media (prefers-color-scheme: light) {
body.dark {
--primary: #6750a4;
--on-primary: #ffffff;
--primary-container: #e9ddff;
--on-primary-container: #22005d;
--secondary: #625b71;
--on-secondary: #ffffff;
--secondary-container: var(--gray-4);
--on-secondary-container: #1e192b;
--tertiary: #7e5260;
--on-tertiary: #ffffff;
--tertiary-container: #ffd9e3;
--on-tertiary-container: #31101d;
--error: #ba1a1a;
--on-error: #ffffff;
--error-container: #ffdad6;
--on-error-container: #410002;
--background: var(--gray-0);
--on-background: var(--gray-8);
--surface: var(--gray-2);
--on-surface: var(--gray-9);
--surface-variant: var(--gray-1);
--on-surface-variant: var(--gray-7);
--outline: #7a757f;
--outline-variant: #cac4cf;
--shadow: #000000;
--scrim: #000000;
--inverse-surface: var(--gray-1);
--inverse-on-surface: var(--gray-9);
--inverse-primary: #cfbcff;
--surface-dim: #ddd8dd;
--surface-bright: #fdf8fd;
--surface-container-lowest: #ffffff;
--surface-container-low: var(--gray-3);
--surface-container: var(--gray-3);
--surface-container-high: #ece7eb;
--surface-container-highest: #e6e1e6;
--overlay: rgb(0 0 0 / .5);
--active: rgb(0 0 0 / .1);
--elevate1: 0 .125rem .125rem 0 rgb(0 0 0 / .32);
--elevate2: 0 .25rem .5rem 0 rgb(0 0 0 / .4);
--elevate3: 0 .375rem .75rem 0 rgb(0 0 0 / .48);
--secondary-container: var(--gray-4);
}
}
.status nav, .status nav .chip { color: var(--gray-7) }
.author {
color: inherit
}
.status nav, .status nav .chip {
color: var(--gray-7)
}
.avatar::after {
background-color: var(--surface-container-low);
border: 1px dashed var(--gray-4)
background-color: var(--surface);
border: 1px dashed var(--on-surface)
}
article.ephemeral { border: 2px dashed var(--gray-7) }
article.ephemeral {
border: 2px dashed var(--outline)
}
article.now {
background-color: var(--green-2);
color: var(--black)
}
article.now {
background-color: var(--green-2);
color: var(--black)
}
a.row.indent { border-left: 1px solid var(--outline) }
a.row.indent {
border-left: 1px solid var(--outline)
}
.markdown-editor .editor-preview { background: var(--surface) }
.markdown-editor .editor-preview {
background: var(--surface)
}
menu > details > a:is(:hover,:focus,.active), menu > details > summary:is(:hover,:focus,.active) {
background-color: var(--active)
}
menu > details > a:is(:hover,:focus,.active), menu > details > summary:is(:hover,:focus,.active) {
background-color: var(--active)
}
#advanced :is(.field.textarea, textarea), .EasyMDEContainer, article.paste code {
background-color: #212121;
color: #eff
}
#advanced :is(.field.textarea, textarea), .EasyMDEContainer, article.paste code {
background-color: #212121;
color: #eff
}