Apply micro visual improvements

static/styles.css

@@ -83,7 +83,7 @@ body {
   color: #f3f3f3;
 }
 .theme--dark .theme-toggle {
-  color: #9a9a9a;
+  color: #3d3d3d;
 }
 @media (max-width: 580px) {
   .theme-toggle {
@@ -268,7 +268,7 @@ body {
   background: #f3f3f3;
 }
 .theme--dark .container .column_content .separator {
-  background: #232323;
+  background: #2d2d2d;
 }
 .container .column_content .separator.long {
   width: 50%;
@@ -338,7 +338,7 @@ body {
   text-indent: -9999px;
   width: 2.6rem;
   height: 1.2rem;
-  background: #3d3d3d;
+  background: #9a9a9a;
   display: inline-block;
   border-radius: 100px;
   position: relative;
@@ -610,6 +610,7 @@ body.note .column_content .profile_intro {
 }
 body.note .column_content .profile_intro a {
   display: inherit;
+  width: 100%;
   align-items: inherit;
   margin: 1rem 0 1rem 0;
   text-decoration: none;
@@ -622,7 +623,7 @@ body.note .column_content .profile_intro a {
   }
 }
 body.note .column_content .profile_intro .info-wrapper {
-  flex-basis: 80%;
+  flex-grow: 1;
 }
 @media (max-width: 580px) {
   body.note .column_content .profile_intro .info-wrapper {
@@ -646,7 +647,7 @@ body.note .column_content .profile_intro .pic-wrapper {
   }
 }
 body.note .column_content .profile_intro .published_at {
-  flex-grow: 1;
+  width: 100%;
   text-align: right;
   align-self: end;
   font-size: 0.8rem;

static/styles.scss

@@ -24,7 +24,8 @@ $themes: (
     boxed-title: $color-base7,
     boxed-bg-title: $color-base4,
     boxed-bg: $color-base3,
-    separator: $color-base3
+    separator: $color-base3,
+    theme-toggle: $color-base3,
   ),
   dark: (
     base1: $color-base7,
@@ -41,7 +42,8 @@ $themes: (
     boxed-title: $color-base5,
     boxed-bg-title: darken($color-base6, 14%),
     boxed-bg: darken($color-base7, 14%),
-    separator: darken($color-base7, 8%)
+    separator: darken($color-base7, 4%),
+    theme-toggle: $color-base6,
   )
 );
 
@@ -60,6 +62,7 @@ $boxed-title: 'boxed-title';
 $boxed-bg-title: 'boxed-bg-title';
 $boxed-bg: 'boxed-bg';
 $separator: 'separator';
+$theme-toggle: 'theme-toggle';
 
 $theme-map: null;
 @mixin themed() {
@@ -147,8 +150,7 @@ a {
   width: 1rem;
   height: 1rem;
   @include themed() {
-    color: t($base3);
-    // background: t($base3);
+    color: t($theme-toggle);
   }
   border-radius: 50%;
   cursor: pointer;
@@ -361,7 +363,7 @@ a {
           text-indent: -9999px;
           width: 2.6rem;
           height: 1.2rem;
-          background: $color-base6;
+          background: $color-base5;
           display: inline-block;
           border-radius: 100px;
           position: relative;
@@ -597,6 +599,7 @@ body.note {
       align-items: center;
       a {
         display: inherit;
+        width: 100%;
         align-items: inherit;
         margin: 1rem 0 1rem 0;
         text-decoration: none;
@@ -607,7 +610,7 @@ body.note {
         }
       }
       .info-wrapper {
-        flex-basis: 80%;
+        flex-grow: 1;
         @media (max-width: 580px) {
           display: block;
         }
@@ -627,7 +630,7 @@ body.note {
         }
       }
       .published_at {
-        flex-grow: 1;
+        width: 100%;
         text-align: right;
         align-self: end;
         font-size: 0.8rem;

templates/head.html

@@ -58,5 +58,5 @@
   <!----------->
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <link rel="stylesheet" href="/njump/static/styles.css?v=20230527" />
+  <link rel="stylesheet" href="/njump/static/styles.css?v=20230528" />
 </head>

templates/note.html

@@ -40,11 +40,6 @@
             {{.npub}}
           </div>
 
-          <div class="field last_update">
-            Last update:<br />
-            {{.createdAt | SanitizeString}}
-          </div>
-
           <div class="field advanced-switch-wrapper">
             <input
               type="checkbox"