Tidy up styles, adjust layouts

xonx4l · Mar 22, 2018 · 3ee47cd · 3ee47cd
1 parent d4975e4
commit 3ee47cd
Show file tree

Hide file tree

Showing 9 changed files with 38 additions and 23 deletions.
diff --git a/app/components/band/band.scss b/app/components/band/band.scss
@@ -1,6 +1,6 @@
-@import "../../public/styles/global";
+//@import "../../public/styles/global";
 
-.band {
+/* .band {
   &--layout {
     @extend %default--band;
     &[data-background="gray"] {
@@ -33,4 +33,4 @@
       }
     }
   }
-}
+} */
diff --git a/app/components/card/card.scss b/app/components/card/card.scss
@@ -5,8 +5,6 @@
         @extend %default--card;
     }
     &-header {
-        min-height: 80px;
-        flex-grow: 1;
         display: flex;
         justify-content: center;
         flex-flow: column nowrap;
@@ -15,12 +13,13 @@
             margin: 0 auto;
             padding: 0 10px;
             max-width: 80%;
-            max-height: 100px;
+            max-height: 50px;
         }
     }
     &-body {
+        flex-grow: 1;
         > *:not(:last-child) {
-            padding-bottom: 20px;
+            padding-bottom: 10px;
         }
         &-headline {
             @extend %card-heading;

diff --git a/app/components/dynamictable/dynamictable.scss b/app/components/dynamictable/dynamictable.scss
@@ -80,9 +80,5 @@
     th {
       font-weight: 600;
     }
-
-    a {
-      @extend %subtle-link-underline;
-    }
   }
 }
diff --git a/app/components/group/group.scss b/app/components/group/group.scss
@@ -1,10 +1,10 @@
 @import "../../public/styles/global";
 
 .group {
-  &--component {
-    > *:not(:last-child) {
-      padding-bottom: 10px;
-    }
+  &-container {
+      > *:not(:last-child) {
+        padding-bottom: 15px;
+      }
   }
 
   &-heading {

diff --git a/app/index.html b/app/index.html
@@ -7,6 +7,7 @@
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
     <meta name="copyright" content="&copy; 2018 Red Hat, Inc." />
     <title>Red Hat Official GitHub</title>
+    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css"/>
     <link rel="stylesheet" type="text/css" href="https://use.fontawesome.com/releases/v5.0.8/css/all.css" integrity="sha384-3AB7yXWz4OeoZcPbieVW64vVXEwADiYyAEhwilzWsLw+9FgqpyjjStpPnpBO8o8S" crossorigin="anonymous"/>
 </head>
 <body ng-controller="rhGitHubCtrl">

diff --git a/app/pages/main/main.scss b/app/pages/main/main.scss
@@ -1,34 +1,35 @@
 @import "../../public/styles/global";
 
 .band {
+
   &--layout {
     @extend %default--band;
   }
+
   &-container {
     @extend %default-container;
+
     &[data-layout="stack"] {
       > *:not(:last-child) {
         display: block;
         padding-bottom: 30px;
       }
     }
+
     &[data-layout="3-up"] {
       display: grid;
-      grid-template-columns: repeat(3, 1fr);
+      grid-template-columns: repeat(3, minmax(200px, 1fr));
       grid-auto-rows: 1fr;
       grid-gap: 15px;
       > * {
         display: grid;
       }
     }
+
     &[data-layout="2-up"] {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
-      grid-auto-rows: 1fr;
-      grid-gap: 15px;
-      > * {
-        display: grid;
-      }
+      grid-gap: 30px;
     }
   }
 }
diff --git a/app/public/styles/extends/copy.scss b/app/public/styles/extends/copy.scss
@@ -100,6 +100,10 @@
     a {
         color: $rich-black;
         text-decoration: none;
+        &:active,
+        &:hover {
+          color: $steel-blue;
+        }
     }
 }
 
@@ -125,6 +129,18 @@
     font-size: 18px;
     font-weight: 100;
     line-height: 1.44;
+    a {
+      color: $stone;
+
+      &:active,
+      &:hover {
+          color: $steel-blue;
+      }
+
+      &:focus {
+        @include accessibility-focus();
+      }
+    }
 }
 
 %link {
@@ -143,7 +159,7 @@
 }
 
 %subtle-link {
-    color: $black;
+    color: $stone;
     font-family: $base-font-family;
     text-decoration: none;
 

diff --git a/app/public/styles/global.scss b/app/public/styles/global.scss
@@ -1,4 +1,4 @@
-body {
+h2, h3, h4, p {
   margin: 0;
 }
 

diff --git a/app/public/styles/mixins/global.scss b/app/public/styles/mixins/global.scss
@@ -71,5 +71,7 @@
 }
 
 @mixin make-input() {
+    font-family: $base-font-family;
     border-radius: 0;
+    padding: 5px;
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -80,9 +80,5 @@ @@
         th {
           font-weight: 600;
         }
-        a {
-          @extend %subtle-link-underline;
-        }
       }
     }