~mjorgensen/jrgnsn.net

f9d20cc836e55ad9a8399aa2a51039e2cb2f173c — Matthew Jorgensen 1 year, 10 days ago c60759a
Add support for dark themes

- Implements `prefers-color-scheme: dark`
1 files changed, 27 insertions(+), 10 deletions(-)

M css/style.css
M css/style.css => css/style.css +27 -10
@@ 133,7 133,6 @@ img.avatar {
  padding: 0 1em;
  text-align: center;
  border-left: 1px solid #ccc;
  background-color: #fff;
}

.nav {


@@ 335,8 334,7 @@ h1 {
  margin: 0
  0.5rem;
  padding: 0.5rem;
  background:
  #eee;
  background: #eee;
}
.webring .article:first-child {
  margin-left: 0;


@@ 372,6 370,16 @@ h1 {
  }
}

@media (max-width: 600px) {
    .webring .articles {
    display: block;
  }
  .webring .article {
    display: block;
    margin: 1rem 0 0 0;
  }
}

@media (max-width: 550px) {

  .container .widgets {


@@ 381,13 389,6 @@ h1 {
  .hero-bio {
    margin-bottom: 2rem;
  }
  .webring .articles {
    display: block;
  }
  .webring .article {
    display: block;
    margin: 1rem 0 0 0;
  }
}

@media (min-width: 576px) {


@@ 395,3 396,19 @@ h1 {
  display:none
  }
}

@media (prefers-color-scheme: dark) {
  body {
    background-color: black;
    color: lightgray;
  }
  a {
    color: blueviolet;
  }
  .webring .article {
    background: #111;
  }
  .webring .date {
    color: gray;
  }
}