autorefresh in the stats and minor color changes

[VSoRC/.git] / styles / main.css

diff --git a/styles/main.css b/styles/main.css
index 4891d336e8df504a3b212192418ea73c2cda7930..d3e5ec4d656aff650c74d7b11ad0090dcbaab59a 100644 (file)
--- a/styles/main.css
+++ b/styles/main.css
@@ -1,4 +1,12 @@
-body {
+/* TO DO LIST */
+/* faltan las sombras
+faltan los textbox y selects
+ */
+
+
+
+
+html{
   background:
     linear-gradient(238deg, rgba(70, 70, 70, 0.09) 0%, rgba(70, 70, 70, 0.09) 50%, rgba(214, 214, 214, 0.09) 50%, rgba(214, 214, 214, 0.09) 100%),
     linear-gradient(126deg, rgba(223, 223, 223, 0.05) 0%, rgba(223, 223, 223, 0.05) 50%, rgba(217, 217, 217, 0.05) 50%, rgba(217, 217, 217, 0.05) 100%),
@@ -8,11 +16,68 @@ body {
     linear-gradient(100deg, rgba(220, 220, 220, 0.07) 0%, rgba(220, 220, 220, 0.07) 50%, rgba(65, 65, 65, 0.07) 50%, rgba(65, 65, 65, 0.07) 100%),
     linear-gradient(190deg, rgba(194, 194, 194, 0.03) 0%, rgba(194, 194, 194, 0.03) 50%, rgba(206, 206, 206, 0.03) 50%, rgba(206, 206, 206, 0.03) 100%),
     linear-gradient(320deg, rgba(10, 10, 10, 0.08) 0%, rgba(10, 10, 10, 0.08) 50%, rgba(231, 231, 231, 0.08) 50%, rgba(231, 231, 231, 0.08) 100%),
-    linear-gradient(90deg, rgb(10, 147, 39), rgb(235, 252, 123));\r
+    linear-gradient(90deg, rgb(10, 147, 39), rgb(235, 252, 123));
+}
+body {
+  /* background:
+    linear-gradient(238deg, rgba(70, 70, 70, 0.09) 0%, rgba(70, 70, 70, 0.09) 50%, rgba(214, 214, 214, 0.09) 50%, rgba(214, 214, 214, 0.09) 100%),
+    linear-gradient(126deg, rgba(223, 223, 223, 0.05) 0%, rgba(223, 223, 223, 0.05) 50%, rgba(217, 217, 217, 0.05) 50%, rgba(217, 217, 217, 0.05) 100%),
+    linear-gradient(152deg, rgba(116, 116, 116, 0.08) 0%, rgba(116, 116, 116, 0.08) 50%, rgba(248, 248, 248, 0.08) 50%, rgba(248, 248, 248, 0.08) 100%),
+    linear-gradient(225deg, rgba(1, 1, 1, 0.07) 0%, rgba(1, 1, 1, 0.07) 50%, rgba(5, 5, 5, 0.07) 50%, rgba(5, 5, 5, 0.07) 100%),
+    linear-gradient(194deg, rgba(14, 14, 14, 0.09) 0%, rgba(14, 14, 14, 0.09) 50%, rgba(206, 206, 206, 0.09) 50%, rgba(206, 206, 206, 0.09) 100%),
+    linear-gradient(100deg, rgba(220, 220, 220, 0.07) 0%, rgba(220, 220, 220, 0.07) 50%, rgba(65, 65, 65, 0.07) 50%, rgba(65, 65, 65, 0.07) 100%),
+    linear-gradient(190deg, rgba(194, 194, 194, 0.03) 0%, rgba(194, 194, 194, 0.03) 50%, rgba(206, 206, 206, 0.03) 50%, rgba(206, 206, 206, 0.03) 100%),
+    linear-gradient(320deg, rgba(10, 10, 10, 0.08) 0%, rgba(10, 10, 10, 0.08) 50%, rgba(231, 231, 231, 0.08) 50%, rgba(231, 231, 231, 0.08) 100%),
+    linear-gradient(90deg, rgb(10, 147, 39), rgb(235, 252, 123)); */\r
   display: flex;\r
   flex-direction: column;
+  font-family: helvetica;
+  padding-top: 10vh;
+}
+header{
+  position: absolute;
+  width:100%;
+  left:0;
+  top:0;
+}
+.navbar{
+background-color: #343a40;
+width: auto;
+position: relative;
+display: flex;
+flex-wrap: wrap;
+align-items: center;
+justify-content: space-between;
+padding: 0.5rem 1rem;
+box-sizing: border-box;
+margin: 0;
+top: 0;
+left: 0;
+flex-grow: 1;
+}
+.btn-outline-success{
+  padding: 0;
+  border-style: none;
+  cursor: pointer;
+  border: 1px solid;
+  color: #28A745;
+  border-color: #28A745;
+  display: inline-block;
+  font-weight: 400;
+  text-align: center;
+  vertical-align: middle;
+  user-select: none;
+  background-color: transparent;
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  line-height: 1.5;
+  border-radius: 0.25rem;
+  transition: color .15s ease-in-out,background-color .15s ease-in-out;
+}
+.btn-outline-success:hover{
+  color: white;
+  background-color: #28A745;
 }
-
 .realtime {
   /* width: 100vw;
   height: auto;
@@ -45,3 +110,51 @@ body {
 .navbar{\r
   width: auto;\r
 }\r
+\r
+\r
+#main{\r
+  padding: 0em 10vw;\r
+}\r
+/* H1 to H6 */\r
+h1, h2, h3, h4, h5, h6, p, label, span{\r
+color: white;\r
+font-weight: bold;\r
+line-height: 1.5;\r
+}\r
+/* formularios */\r
+.form{\r
+  width: 100%;\r
+}\r
+fieldset{\r
+  width: 100%;\r
+  display: flex;\r
+  flex-flow: column wrap;\r
+  justify-content: flex-start;\r
+  align-items: stretch;\r
+  border: 0;\r
+}\r
+\r
+select{\r
+background-color: rgba(200,200,200,0.5);\r
+border: 0;\r
+border-bottom: 2px black solid;\r
+overflow: hidden;\r
+width: 15em;\r
+}\r
+/* some hacky shit for hidind the arrow */\r
+select {\r
+  /* for Firefox */\r
+  -moz-appearance: none;\r
+  /* for Chrome */\r
+  -webkit-appearance: none;\r
+}\r
+\r
+/* For IE10 */\r
+select::-ms-expand {\r
+  display: none;\r
+}\r
+\r
+input[type=text]{\r
+border-radius: 0;\r
+border: 0;\r
+}\r