From ee752b91e2065d31f58513b215b9c7752d02e523 Mon Sep 17 00:00:00 2001
From: He4eT <He4eT@oddsquat.org>
Date: Mon, 5 Jun 2023 01:01:24 +0300
Subject: [PATCH] base.css: replace values with vars

---
 src/style/base.css | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/style/base.css b/src/style/base.css
index 11a7253..e8f9e3b 100644
--- a/src/style/base.css
+++ b/src/style/base.css
@@ -53,7 +53,7 @@ summary {
   display: inline;
   cursor: pointer;
 
-  border-bottom: 2px solid currentColor;
+  border-bottom: var(--separator-width) solid currentColor;
   color: inherit;
   text-decoration: none;
 }
@@ -66,8 +66,8 @@ summary:hover {
 }
 
 *:focus-visible {
-  outline: 1px solid var(--main-color);
-  outline-offset: 3px;
+  outline: calc(0.5 * var(--separator-width)) solid var(--main-color);
+  outline-offset: calc(1px + var(--separator-width));
 }
 
 *::selection {
@@ -82,7 +82,7 @@ ul {
 hr {
   border: 0;
   height: 0;
-  border-top: 2px solid var(--main-color);
+  border-top: var(--separator-width) solid var(--main-color);
 }
 
 /* */
@@ -93,7 +93,7 @@ input::placeholder {
 }
 
 button {
-  border: 2px solid var(--main-color);
+  border: var(--separator-width) solid var(--main-color);
   background-color: var(--bg-color);
   color: var(--main-color);
   padding: var(--inner-padding) calc(4 * var(--inner-padding));
@@ -106,19 +106,20 @@ input,
 select {
   box-sizing: border-box;
 
-  padding: 4px 8px;
+  padding: calc(0.5 * var(--inner-padding)) var(--inner-padding);
   color: var(--main-color);
   background-color: var(--bg-color);
-  border: 2px solid var(--main-color);
+  border: var(--separator-width) solid var(--main-color);
   font: inherit;
 }
 
 select {
+  width: 250px;
+
   cursor: pointer;
   appearance: none;
   -webkit-appearance: none;
   border-radius: 0;
-  width: 200px;
   background-image: repeating-linear-gradient(
     315deg,
     var(--bg-color),
@@ -149,6 +150,6 @@ input[type='file'] {
 /*  */
 
 .status {
-  padding: 8px;
+  padding: var(--inner-padding);
   word-break: break-word;
 }