Code Review / apps / html5-mixer.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | review | tree
raw | patch | inline | side by side (parent: 6f252b4)
FUNCT Update look & feel
authorHumberto Alfonso Díaz <humberto.alfonso@asvito.es>
Mon, 23 Sep 2019 07:07:23 +0000 (09:07 +0200)
committerLorenzo Tilve <ltilve@igalia.com>
Tue, 4 Feb 2020 08:42:15 +0000 (09:42 +0100)
src/index.html patch | blob | history
src/styles/app.scss patch | blob | history
src/styles/main.scss patch | blob | history

diff --git a/src/index.html b/src/index.html
index 7d124cb..9c1ac9b 100644 (file)
--- a/src/index.html
+++ b/src/index.html
@@ -22,6 +22,9 @@
     </head>
     <body>
         <div class="content">
+            <h1 class="header">
+                Mixer
+            </h1>
             <div class="entry">
                 <div class="label">
                     Volume 1: <span class="value"> 50%</span>
diff --git a/src/styles/app.scss b/src/styles/app.scss
index a67dbfe..d97030b 100644 (file)
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -1,6 +1,6 @@
 $colors: (
   primary:          #00ADDC,
-  font:             #999999,
+  font:             #FFFFFF,
   grey:             #848286
 );
 
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 07fc408..98456a0 100644 (file)
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -64,6 +64,8 @@ body {
 
     a {
         color: map-get($colors, font);
+        text-decoration: none;
+        font-size: 2.5rem;
     }
 
     .button {
@@ -94,6 +96,10 @@ body {
         justify-content: space-around;
         height: 100%;
 
+        .header {
+            text-align: center;
+        }
+
         .entry {
             height: 100px;
 
@@ -108,10 +114,6 @@ body {
                 text-align: center;
                 height: 80px;
                 line-height: 80px;
-                background-color: map-get($colors, primary);
-                color: #FFFFFF;
-                border-radius: 20px;
-                text-decoration: none;
             }
 
             .slider {
HTML implementation of the mixer