jedmund/jedmund-svelte
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make text colors consistent

Browse source
This commit is contained in:
Justin Edmund 2025-06-10 23:33:41 -07:00
parent ff87fa4e4b
commit 0503e20b5d
4 changed files with 34 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/assets/styles/variables.scss
View file

@ -122,8 +122,9 @@ $page-color: #ffffff;
$card-color: #f7f7f7; $card-color: #f7f7f7;
$card-color-hover: #f0f0f0; $card-color-hover: #f0f0f0;
$text-color: #4d4d4d;
$text-color-subdued: #666666;
$text-color-light: #b2b2b2; $text-color-light: #b2b2b2;
$text-color-body: #666666;
$accent-color: #e33d3d; $accent-color: #e33d3d;
$grey-color: #f0f0f0; $grey-color: #f0f0f0;

26
src/lib/components/DynamicPostContent.svelte
View file

@ -138,7 +138,7 @@
.post-date { .post-date {
font-size: 0.9rem; font-size: 0.9rem;
color: $grey-40; color: $text-color-subdued;
font-weight: 400; font-weight: 400;
transition: color 0.2s ease; transition: color 0.2s ease;
} }
@ -147,7 +147,7 @@
margin: 0; margin: 0;
font-size: 2.5rem; font-size: 2.5rem;
font-weight: 700; font-weight: 700;
color: $grey-10; color: $text-color;
line-height: 1.2; line-height: 1.2;
@include breakpoint('phone') { @include breakpoint('phone') {
@ -168,7 +168,7 @@
font-size: 1rem; font-size: 1rem;
font-weight: 600; font-weight: 600;
margin: 0 0 $unit-2x; margin: 0 0 $unit-2x;
color: $grey-20; color: $text-color;
} }
} }
@ -182,41 +182,41 @@
.album-description { .album-description {
margin: 0; margin: 0;
font-size: 1rem; font-size: 1rem;
color: $grey-10; color: $text-color;
line-height: 1.5; line-height: 1.5;
} }
} }
.post-body { .post-body {
color: $grey-10; color: $text-color;
line-height: 1.5; line-height: 1.5;
:global(h1) { :global(h1) {
margin: $unit-5x 0 $unit-3x; margin: $unit-5x 0 $unit-3x;
font-size: 2rem; font-size: 2rem;
font-weight: 600; font-weight: 600;
color: $grey-10; color: $text-color;
} }
:global(h2) { :global(h2) {
margin: $unit-4x 0 $unit-2x; margin: $unit-4x 0 $unit-2x;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
color: $grey-10; color: $text-color;
} }
:global(h3) { :global(h3) {
margin: $unit-3x 0 $unit-2x; margin: $unit-3x 0 $unit-2x;
font-size: 1.25rem; font-size: 1.25rem;
font-weight: 600; font-weight: 600;
color: $grey-10; color: $text-color;
} }
:global(h4) { :global(h4) {
margin: $unit-3x 0 $unit-2x; margin: $unit-3x 0 $unit-2x;
font-size: 1rem; font-size: 1rem;
font-weight: 600; font-weight: 600;
color: $grey-10; color: $text-color;
} }
:global(p) { :global(p) {
@ -248,7 +248,7 @@
background: $grey-97; background: $grey-97;
border-left: 4px solid $grey-80; border-left: 4px solid $grey-80;
border-radius: $unit; border-radius: $unit;
color: $grey-30; color: $text-color;
font-style: italic; font-style: italic;
:global(p:last-child) { :global(p:last-child) {
@ -263,7 +263,7 @@
font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New',
monospace; monospace;
font-size: 0.9em; font-size: 0.9em;
color: $grey-10; color: $text-color;
} }
:global(pre) { :global(pre) {
@ -288,8 +288,6 @@
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
text-decoration-style: wavy;
text-underline-offset: 0.15em;
} }
} }
@ -305,7 +303,7 @@
:global(strong) { :global(strong) {
font-weight: 600; font-weight: 600;
color: $grey-10; color: $text-color;
} }
:global(figure) { :global(figure) {

14
src/lib/components/PostContent.svelte
View file

@ -107,26 +107,26 @@
.post-date { .post-date {
display: block; display: block;
font-size: 0.9rem; font-size: 0.9rem;
color: $grey-40; color: $text-color-subdued;
font-weight: 400; font-weight: 400;
} }
.post-body { .post-body {
color: $grey-10; color: $text-color;
line-height: 1.5; line-height: 1.5;
:global(h2) { :global(h2) {
margin: $unit-4x 0 $unit-2x; margin: $unit-4x 0 $unit-2x;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
color: $grey-20; color: $text-color;
} }
:global(h3) { :global(h3) {
margin: $unit-3x 0 $unit-2x; margin: $unit-3x 0 $unit-2x;
font-size: 1.2rem; font-size: 1.2rem;
font-weight: 600; font-weight: 600;
color: $grey-20; color: $text-color;
} }
:global(p) { :global(p) {
@ -152,7 +152,7 @@
margin: $unit-3x 0; margin: $unit-3x 0;
padding-left: $unit-3x; padding-left: $unit-3x;
border-left: 3px solid $grey-80; border-left: 3px solid $grey-80;
color: $grey-40; color: $text-color;
font-style: italic; font-style: italic;
} }
@ -185,8 +185,6 @@
:global(a:hover) { :global(a:hover) {
text-decoration: underline; text-decoration: underline;
text-decoration-style: wavy;
text-underline-offset: 0.15em;
} }
:global(hr) { :global(hr) {
@ -197,7 +195,7 @@
:global(em) { :global(em) {
font-style: italic; font-style: italic;
color: $grey-40; color: $text-color;
} }
} }

18
src/lib/components/ProjectContent.svelte
View file

@ -56,7 +56,7 @@
:global(h2), :global(h2),
:global(h3) { :global(h3) {
margin: $unit-3x 0 $unit-2x; margin: $unit-3x 0 $unit-2x;
color: $grey-10; color: $text-color;
font-weight: 600; font-weight: 600;
&:first-child { &:first-child {
@ -80,7 +80,7 @@
margin: $unit-2x 0; margin: $unit-2x 0;
font-size: 1rem; font-size: 1rem;
line-height: 1.5; line-height: 1.5;
color: $grey-20; color: $text-color;
} }
:global(figure) { :global(figure) {
@ -102,13 +102,23 @@
margin: $unit 0; margin: $unit 0;
font-size: 1.0625rem; font-size: 1.0625rem;
line-height: 1.65; line-height: 1.65;
color: $grey-20; color: $text-color;
:global(p) { :global(p) {
margin: 0; margin: 0;
} }
} }
} }
:global(a) {
color: $red-60;
text-decoration: none;
transition: all 0.2s ease;
&:hover {
text-decoration: underline;
}
}
} }
/* Gallery Section */ /* Gallery Section */
@ -116,7 +126,7 @@
h2 { h2 {
font-size: 1.75rem; font-size: 1.75rem;
margin: 0 0 $unit-3x; margin: 0 0 $unit-3x;
color: $grey-10; color: $text-color;
font-weight: 600; font-weight: 600;
} }
} }