feat(admin-plugin): styles updats, fixing sizing to medium #211

site/plugins/admin/assets/src/content.css

@@ -6,9 +6,9 @@
     flex-grow: 1;
     flex-shrink: 1;
 
-    max-width: calc(100% - 64px);
+    max-width: calc(100% - var(--btn-size-medium));
     height: 100vh;
-    margin-left: 64px;
+    margin-left: var(--btn-size-medium);
 }
 
 .content .bars
@@ -17,20 +17,20 @@
     z-index: 20;
     top: 0;
 
-    width: calc(100% - 64px);
+    width: calc(100% - var(--btn-size-medium));
 }
 
 .content .inner
 {
     position: relative;
 
-    padding: 20px;
+    padding: 10px;
     padding-top: 120px;
 }
 
 .content .top-bar
 {
-    padding: 20px 0;
+    padding: 17.5px 0;
 
     color: rgba(255, 255, 255, .7);
     background: black;
@@ -38,7 +38,7 @@
 
 .content .top-bar .btn
 {
-    padding: 23px;
+    padding: 20.5px;
 }
 
 .content .top-bar .btn.active,
@@ -50,7 +50,7 @@
 
 .content .path-bar
 {
-    padding: 20px;
+    padding: 10px;
 
     background: #f7f7f7;
 }

site/plugins/admin/assets/src/main.css

@@ -1,3 +1,8 @@
+body
+{
+    font-size: 16px;
+}
+
 main
 {
     display: flex;

site/plugins/admin/assets/src/nav.css

@@ -7,7 +7,7 @@ nav
     flex-direction: column;
     justify-content: space-between;
 
-    width: 64px;
+    width: var(--btn-size-medium);
     height: 100vh;
 
     color: white;
@@ -44,5 +44,5 @@ nav a.logo
 {
     font-weight: bold;
 
-    height: 64px;
+    height: var(--btn-size-medium);
 }

site/plugins/admin/assets/src/styles.css

@@ -1,5 +1,6 @@
 @import 'tailwindcss/base';
 
+@import 'vars';
 @import 'main';
 @import 'nav';
 @import 'content';

site/plugins/admin/assets/src/table.css

@@ -1,3 +1,8 @@
+table
+{
+    width: 100%;
+}
+
 table tr:first-of-type td
 {
     border-top: 0;
@@ -11,13 +16,14 @@ table > thead > tr > th
     text-transform: none;
 
     color: black;
+    border-color: rgba(224, 224, 224, .1);
     border-bottom-width: 1px;
 }
 
 table tbody tr:hover td,
 table tbody tr:hover th
 {
-    background: rgba(255, 255, 255, .13);
+    background: rgba(224, 224, 224, .13);
 }
 
 table > tbody > tr > td,
@@ -27,12 +33,13 @@ table > tbody > tr > th,
 table > thead > tr > th,
 table > tfoot > tr > th
 {
-    font-size: 14px;
+    font-size: 16px;
 
-    padding: 12.5px 20px;
+    padding: 17.5px 20px;
 
     vertical-align: middle;
 
     color: black;
-    border-color: black;
+    border-color: rgba(224, 224, 224, .13);
+    border-bottom-width: 1px;
 }

site/plugins/admin/assets/src/vars.css

@@ -0,0 +1,3 @@
+:root {
+    --btn-size-medium: 60px;
+}