fix(dracula): make logout button like the other sidebar links, #13

README.md

@@ -7,7 +7,7 @@
 | Name | Version | Applies To | User CSS |
 |------|---------|------------|----------|
 | Tildes Compact | 1.0.6 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-compact/tildes-compact.user.css) |
-| Tildes Dracula | 2.1.3 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-dracula/tildes-dracula.user.css) |
+| Tildes Dracula | 2.1.4 | [tildes.net](https://tildes.net) | [Click](https://gitlab.com/Bauke/styles/raw/master/css/tildes-dracula/tildes-dracula.user.css) |
 
 ## Installing
 

css/tildes-dracula/tildes-dracula.css

@@ -892,19 +892,24 @@ body:not(.theme) .settings-list a:visited:hover,body:not(.theme) .settings-list
   color: #ff79c6;
 }
 
-#sidebar .nav .nav-item a {
+#sidebar form[action='/logout']>button:hover,#sidebar form[action='/logout']>button:active,#sidebar form[action='/logout']>button:focus {
+  border-color: transparent;
+  background-color: transparent;
+}
+
+#sidebar .nav .nav-item a,#sidebar form[action='/logout']>button {
   color: #ffb86c;
 }
 
-#sidebar .nav .nav-item a:hover,#sidebar .nav .nav-item a:active,#sidebar .nav .nav-item a:focus {
+#sidebar .nav .nav-item a:hover,#sidebar .nav .nav-item a:active,#sidebar .nav .nav-item a:focus,#sidebar form[action='/logout']>button:hover,#sidebar form[action='/logout']>button:active,#sidebar form[action='/logout']>button:focus {
   color: #f1fa8c;
 }
 
-#sidebar .nav .nav-item a:visited {
+#sidebar .nav .nav-item a:visited,#sidebar form[action='/logout']>button:visited {
   color: #ffb86c;
 }
 
-#sidebar .nav .nav-item a:visited:hover,#sidebar .nav .nav-item a:visited:active,#sidebar .nav .nav-item a:visited:focus {
+#sidebar .nav .nav-item a:visited:hover,#sidebar .nav .nav-item a:visited:active,#sidebar .nav .nav-item a:visited:focus,#sidebar form[action='/logout']>button:visited:hover,#sidebar form[action='/logout']>button:visited:active,#sidebar form[action='/logout']>button:visited:focus {
   color: #f1fa8c;
 }
 

css/tildes-dracula/tildes-dracula.user.css

@@ -1,7 +1,7 @@
 /* ==UserStyle==
 @name        Tildes Dracula
 @namespace   tildes.net
-@version     2.1.3
+@version     2.1.4
 @author      Bauke
 @description Dracula theme for Tildes.net
 @homepageURL https://gitlab.com/Bauke/styles
@@ -903,19 +903,24 @@ body:not(.theme) .settings-list a:visited:hover,body:not(.theme) .settings-list
   color: #ff79c6;
 }
 
-#sidebar .nav .nav-item a {
+#sidebar form[action='/logout']>button:hover,#sidebar form[action='/logout']>button:active,#sidebar form[action='/logout']>button:focus {
+  border-color: transparent;
+  background-color: transparent;
+}
+
+#sidebar .nav .nav-item a,#sidebar form[action='/logout']>button {
   color: #ffb86c;
 }
 
-#sidebar .nav .nav-item a:hover,#sidebar .nav .nav-item a:active,#sidebar .nav .nav-item a:focus {
+#sidebar .nav .nav-item a:hover,#sidebar .nav .nav-item a:active,#sidebar .nav .nav-item a:focus,#sidebar form[action='/logout']>button:hover,#sidebar form[action='/logout']>button:active,#sidebar form[action='/logout']>button:focus {
   color: #f1fa8c;
 }
 
-#sidebar .nav .nav-item a:visited {
+#sidebar .nav .nav-item a:visited,#sidebar form[action='/logout']>button:visited {
   color: #ffb86c;
 }
 
-#sidebar .nav .nav-item a:visited:hover,#sidebar .nav .nav-item a:visited:active,#sidebar .nav .nav-item a:visited:focus {
+#sidebar .nav .nav-item a:visited:hover,#sidebar .nav .nav-item a:visited:active,#sidebar .nav .nav-item a:visited:focus,#sidebar form[action='/logout']>button:visited:hover,#sidebar form[action='/logout']>button:visited:active,#sidebar form[action='/logout']>button:visited:focus {
   color: #f1fa8c;
 }
 

sass/tildes-dracula/_sidebar.sass

@@ -1,7 +1,15 @@
 @import '_colors.sass'
 
 #sidebar
-  .nav .nav-item a
+  form[action='/logout']>button
+    &:hover,
+    &:active,
+    &:focus
+      border-color: transparent
+      background-color: transparent
+
+  .nav .nav-item a,
+  form[action='/logout']>button
     color: $orange
 
     &:hover,

sass/tildes-dracula/tildes-dracula.json

@@ -4,7 +4,7 @@
   "options": {
     "name": "Tildes Dracula",
     "namespace": "tildes.net",
-    "version": "2.1.3",
+    "version": "2.1.4",
     "author": "Bauke",
     "description": "Dracula theme for Tildes.net",
     "homepageURL": "https://gitlab.com/Bauke/styles",