Brighten links

This commit is contained in:
gil 2024-06-10 17:25:56 -05:00
parent d1f38946e4
commit 8432238132
4 changed files with 16 additions and 9 deletions

View file

@ -9,10 +9,10 @@
<link rel="stylesheet" href="/css/landing.css"> <link rel="stylesheet" href="/css/landing.css">
</head> </head>
<body> <body>
<main><article>{{ content | safe }}</article><a href="{{ entry }}" class="entry-button">Enter</a></main>
<aside> <aside>
<img src="../img/landing-sigil.png" alt="A sigil-esque drawing" title="A sigil-esque drawing"> <img src="../img/landing-sigil.png" alt="A sigil-esque drawing" title="A sigil-esque drawing">
<div class="spacer"></div> <div class="spacer"></div>
</aside> </aside>
<main><article>{{ content | safe }}</article><a href="{{ entry }}" class="entry-button">Enter</a></main>
</body> </body>
</html> </html>

View file

@ -102,12 +102,16 @@ body {
main { main {
width: 100%; width: 100%;
max-width: 500px;
gap: 10px; gap: 10px;
color: white; color: white;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@media screen and (min-width: 768px) {
main {
max-width: 500px;
}
}
main article { main article {
background: rgb(28, 27, 26); background: rgb(28, 27, 26);
padding: 10px; padding: 10px;
@ -143,11 +147,11 @@ main article ul {
} }
} }
main a { main a {
color: rgb(102, 128, 11); color: #9ec611;
text-decoration: underline rgb(102, 128, 11) 2px; text-decoration: underline #9ec611 2px;
} }
main a:hover { main a:hover {
color: rgb(135, 154, 57); color: #beec1f;
} }
aside { aside {

View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/_colors.scss","../scss/_fonts.scss","../scss/landing.scss","../scss/_mixins.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAaA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;ACnDF;;AAAA;AAAA;;AAAA;AAYA;;AAAA;AAAA;;AAAA;AAUA;EAEI;EACA;EAEF;;;AAGF;EACE;EACA;EACA;EACA,KA5BO;EA6BP;;AC3BA;EDsBF;IAQI;IACA;IACA;;;;AAIJ;EACE;EACA,WAtCU;EAuCV,KAzCO;EA0CP;EACA;EACA;;AAEA;EACE;EACA,SAhDK;EAiDL;EACA;;AAEA;EACE;;AAGF;EACE;;AACA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;;ACzEJ;ED4CA;IAiCI;IACA;IACA;;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;;AC/FA;ED6FF;IAKI;IACA;;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;EACA;EACA;;AC9HF;EDiHF;IAiBI;;;;AAIJ;EACE","file":"landing.css"} {"version":3,"sourceRoot":"","sources":["../scss/_colors.scss","../scss/_fonts.scss","../scss/landing.scss","../scss/_mixins.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAaA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;ACnDF;;AAAA;AAAA;;AAAA;AAYA;;AAAA;AAAA;;AAAA;AAUA;EAEI;EACA;EAEF;;;AAGF;EACE;EACA;EACA;EACA,KA5BO;EA6BP;;AC3BA;EDsBF;IAQI;IACA;IACA;;;;AAIJ;EACE;EACA,KAxCO;EAyCP;EACA;EACA;;ACzCA;EDoCF;IAQI,WA5CQ;;;AA+CV;EACE;EACA,SAnDK;EAoDL;EACA;;AAEA;EACE;;AAGF;EACE;;AACA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;;AC5EJ;ED+CA;IAiCI;IACA;IACA;;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;;AClGA;EDgGF;IAKI;IACA;;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;EACA;EACA;;ACjIF;EDoHF;IAiBI;;;;AAIJ;EACE","file":"landing.css"}

View file

@ -22,8 +22,8 @@ COLORS
*/ */
$fg: white; $fg: white;
$link-color: colors.$green-600; $link-color: lighten(colors.$green-600, 15%);
$link-color-hover: colors.$green-400; $link-color-hover: lighten(colors.$green-600, 25%);
:root { :root {
font: { font: {
@ -49,12 +49,15 @@ body {
main { main {
width: 100%; width: 100%;
max-width: $max-width;
gap: $gutter; gap: $gutter;
color: #{$fg}; color: #{$fg};
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@include breakpoint("md") {
max-width: $max-width;
}
article { article {
background: #{colors.$base-950}; background: #{colors.$base-950};
padding: $gutter; padding: $gutter;