ayo/threads
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style: initial variables; darker text

Browse source
This commit is contained in:
Ayo Ayco 2024-05-20 17:52:52 +02:00
parent d3561de048
commit 49dda38085
2 changed files with 30 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
static/variables.css Normal file
View file

@ -0,0 +1,26 @@
:root {
--content-width: 700px;
--font-size-sm: clamp(0.75rem, 0.2vw + 0.66rem, 0.8rem);
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
--font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
--color-border: hsl(17, 24%, 90%);
--color-link: var(--color-brand-blue-3);
--color-brand-blue-1: #3054bf;
--color-brand-blue-2: #203880;
--color-brand-blue-3: #416fff;
--color-brand-blue-4: #101c40;
--color-brand-blue-5: #3964e6;
--color-brand-complement: orange;
--ayo-gradient: linear-gradient(45deg, #3054bf, #416fff);
--text-color-dark: black;
--text-color-light: #f8f9fa;
--bg-dark: #343a40;
--bg-darker: #212529;
--bg-darkest: #000;
}

8
templates/threads.html
View file

@ -21,6 +21,7 @@
import TimeAgo from 'https://esm.sh/v135/@github/relative-time-element@4.4.0'
</script>
<link rel="stylesheet" href="{{ url_for('static', filename='variables.css') }}" />
<link rel="stylesheet" href="{{ url_for('static', filename='reset.css') }}" />
<style>
html {
@ -30,7 +31,7 @@
font-family: system-ui, sans-serif;
max-width: 600px;
margin: 0 auto;
color: #232323;
color: var(--text-color-dark);
}
header, footer, main {
padding: 1em;
@ -142,10 +143,9 @@
padding-top: 5px;
font-size: small;
text-align: right;
color: #888;
& a{
color: #888;
color: var(--text-color-dark);
&:hover {
color: blue;
@ -280,7 +280,7 @@
<a href="{{ thread.url }}" title="{{ thread.created_at }}">
<relative-time datetime="{{ thread.created_at }}" precision="day">{{ thread.created_at }}</relative-time>
</a> &middot;
<a href="{{ url_for('threads.thread', id=thread['id']) + '#' + thread['id'] }}">Anchor</a>
<a href="{{ url_for('threads.thread', id=thread['id']) + '#' + thread['id'] }}">anchor</a>
</div>
</div>