Use <img> for currency display.

[perso/Immae/Projets/Cryptomonnaies/Cryptoportfolio/Front.git] / cmd / web / static / style.css

diff --git a/cmd/web/static/style.css b/cmd/web/static/style.css
index 12af3793c2a8ec0b6d13b4c9deac912ae8855951..589c0b018c8215fc404c50bc6650b2a94a4bd3bd 100644 (file)
--- a/cmd/web/static/style.css
+++ b/cmd/web/static/style.css
@@ -3,7 +3,6 @@
 body {
   font-family: 'Fira Mono', 'Helvetica Neue', Arial, Helvetica, sans-serif;
   background-color: rgb(246, 248, 251);
-  text-align: center;
 }
 
 ul {
@@ -25,18 +24,30 @@ a:focus {
   color: inherit;
 }
 
+i.cc {
+  font-size: 1.5em;
+}
+
 #logo {
   text-align: center;
   display: inline-block;
   color: white;
-  font-size: 28px;
   background-color: rgb(20, 20, 20);
   border-radius: 4px;
   font-weight: bold;
   padding: 10px 10px 10px 10px;
   vertical-align: middle;
-  margin-bottom: 30px;
+}
+
+#header {
   margin-top: 20px;
+  margin-bottom: 30px;
+}
+
+h1 {
+  font-size: 1.5em;
+  margin-bottom: 5px;
+  margin-top: 5px;
 }
 
 .sign-in .form-control {
@@ -88,13 +99,28 @@ a:focus {
   padding-top: 100px;
 }
 
+.currency-logo {
+  display: inline-block;
+  margin-left: 5px;
+  margin-right: 5px;
+}
+
+.portfolio .currency-logo {
+  height: 24px;
+  width: 24px;
+}
+
+.balances > div {
+  margin-bottom: 5px;
+}
+
 .box {
   position: relative;
   background-color: rgb(250, 250, 250);
   box-shadow: 0 2px 6px 2px rgba(0,0,0,.05);
   border-radius: 4px;
-}
-
-.box:hover {
-  box-shadow: 0 4px 15px 2px rgba(0,0,0,.20);
+  margin-bottom: 10px;
+  margin-top: 10px;
+  padding-top: 10px;
+  padding-bottom: 10px;
 }