fix(guidelines): update assets per code guidelines

update the assets/stylesheets css files to match code guidelines
fabric8-ui · May 19, 2017 · e16fdd1 · e16fdd1
1 parent 4997537
commit e16fdd1
Show file tree

Hide file tree

Showing 18 changed files with 271 additions and 585 deletions.
diff --git a/src/app/dialog/dialog.component.scss b/src/app/dialog/dialog.component.scss
@@ -1,13 +1,11 @@
 @import "../../assets/stylesheets/base";
-
-.modal-footer{
-    .btn{
-        &:hover{
-            background-color: $color-pf-light-blue-500;
-            @include gradient-vertical($color-pf-blue-300, $color-pf-blue-400);
-            border-color: $color-pf-blue-500;
-            color: $color-pf-white;
-        }
+.modal-footer {
+  .btn {
+    &:hover {
+      background-color: $color-pf-light-blue-500;
+      @include gradient-vertical($color-pf-blue-300, $color-pf-blue-400);
+      border-color: $color-pf-blue-500;
+      color: $color-pf-white;
     }
-
+  }
 }
diff --git a/src/app/dropdown/dropdown.component.scss b/src/app/dropdown/dropdown.component.scss
@@ -1,37 +1,2 @@
 @import "../../assets/stylesheets/base";
-/*
-.status{
-  width: 130px;
-  text-align: left;
-}
-
-.status span.label{
-  border-radius: 10px;
-  padding: 5px 20px;
-  opacity: 0.7;
-  cursor: pointer;
-}
-
-.alm-dropdown {
-	position: absolute;
-	z-index: 100;
-	margin-top: $margin10;
-	height: auto;
-	background-color: rgb(243, 231, 231);
-	@include borderRadius(7px);
-	padding-left: $pad10;
-	padding-right: $pad10;
-	li{
-		list-style: none;
-		font-size: $font12;
-		text-align: $textLeft;
-		cursor: pointer;
-		&:hover{
-			font-weight: 600;
-		}
-	}
-}*/
-
-	.alm-dropdown-btn{
-		min-width: 100em;
-	}
+.alm-dropdown-btn {	min-width: 100em; }
diff --git a/src/app/emptystate/emptystate.component.scss b/src/app/emptystate/emptystate.component.scss
@@ -1,8 +1,6 @@
 @import '../../assets/stylesheets/_base';
-
 .blank-slate-pf {
-  //height:100%;
-  margin-bottom: 0px;
+  margin-bottom: 0;
   button {
     margin-right: 4px;
   }

diff --git a/src/app/filters/filter-fields.component.scss b/src/app/filters/filter-fields.component.scss
@@ -1,26 +1,22 @@
 @import '../../assets/stylesheets/_base';
 
 .filter-pf {
-  a {
-    cursor: pointer;
-  }
-}
-.filter-pf.filter-fields {
-  .form-group {
-    padding-left: 0;
-    width: 275px;
-  }
-  .btn-default {
-    font-size: 12px;
-  }
-  .typeahead-input-container {
-    position: relative;
-    padding-right: 0px;
-    .caret {
-      position: absolute;
-      z-index: 2;
-      top: 10px;
-      right: 5px;
+  a { cursor: pointer; }
+  &.filter-fields {
+    .form-group {
+      padding-left: 0;
+      width: 275px;
+    }
+    .btn-default { font-size: 12px; }
+    .typeahead-input-container {
+      position: relative;
+      padding-right: 0;
+      .caret {
+        position: absolute;
+        top: 10px;
+        right: 5px;
+        z-index: 2;
+      }
     }
   }
 }

diff --git a/src/app/filters/filter-results.component.scss b/src/app/filters/filter-results.component.scss
@@ -1,7 +1,5 @@
 @import '../../assets/stylesheets/_base';
 
 .filter-pf {
-  a {
-    cursor: pointer;
-  }
+  a { cursor: pointer; }
 }
diff --git a/src/app/filters/filter.component.scss b/src/app/filters/filter.component.scss
@@ -1,11 +1,5 @@
 @import '../../assets/stylesheets/_base';
-
 .filter-pf {
-  a {
-    cursor: pointer;
-  }
-}
-
-.dropdown-menu {
-  min-width: 176px;
+  a { cursor: pointer; }
 }
+.dropdown-menu { min-width: 176px; }
diff --git a/src/app/listview/listview.component.scss b/src/app/listview/listview.component.scss
@@ -2,50 +2,32 @@
 
 /* Overridding Fabric8's min button width */
 .list-view-pf-actions {
-  button {
-    margin-left: 0;
-  }
-  .dropdown-kebab-pf .btn {
-    min-width: initial;
+  button { margin-left: 0; }
+  .dropdown-kebab-pf {
+    .btn { min-width: initial; }
   }
 }
-
 /* Group heading above list view */
 .list-group-heading {
+  position: absolute;
+  top: -40px;
   font-size: $font-size-base;
   font-weight: initial;
-  @media (max-width: 992px) { // @screen-md-min
-    display: none;
-  }
+  @media (max-width: 992px) { display: none; }
 }
-
 .list-view-pf .list-group-item {
   margin-left: -2px;
   margin-right: -2px;
 }
-
 .list-view-pf .list-group-item {
   &.list-group-item-heading-row {
     border-top: none;
     pointer-events: none;
-    &:hover {
-      background-color: $color-pf-white;
-    }
-    i {
-      pointer-events: auto;
-    }
+    &:hover { background-color: $color-pf-white; }
+    i { pointer-events: auto; }
   }
 }
-
-.list-view-pf-dnd-drag-items-container {
-  display: flex;
-}
-
+.list-view-pf-dnd-drag-items-container { display: flex; }
 /* overriding pf base so that buttons have spaces between them */
-.pf-expand-placeholder {
-  margin-right: 15px;
-}
-
-.pf-cb-placeholder {
-  margin-right: 40px;
-}
+.pf-expand-placeholder { margin-right: 15px; }
+.pf-cb-placeholder { margin-right: 40px; }
diff --git a/src/app/notification/toast-notification.component.scss b/src/app/notification/toast-notification.component.scss
@@ -1,11 +1,5 @@
 @import '../../assets/stylesheets/_base';
-
-.toast-pf-action > a {
-  cursor: pointer;
-}
-
+.toast-pf-action > a { cursor: pointer; }
 .toast-pf {
-  .dropdown-menu > li > a {
-    cursor: pointer;
-  }
+  .dropdown-menu > li > a { cursor: pointer; }
 }
diff --git a/src/app/slide-out-panel/slide-out-panel.component.scss b/src/app/slide-out-panel/slide-out-panel.component.scss
@@ -2,43 +2,39 @@
 
 //detail panel
 .detail-panel {
-  background: $color-pf-white;
   position: fixed;
   left: auto;
   top: em(34);
   right: 0;
   bottom: 0;
   width: 50%;
   min-width: em(250);
-  z-index: 100;
   padding: em(20) 0 em(20) em(10);
-  border-left: 1px solid darken($color-pf-white, 20%);
+  border-left: 1px solid;
+  border-left-color: darken($color-pf-white, 20%);
+  background-color: $color-pf-white;
+  -webkit-box-shadow: -4px 0 2px -2px $color-pf-black-300;
+     -moz-box-shadow: -4px 0 2px -2px $color-pf-black-300;
+          box-shadow: -4px 0 2px -2px $color-pf-black-300;
+  z-index: 100;
   overflow-y: scroll;
   overflow-x: hidden;
-  box-shadow: -4px 0px 2px -2px $color-pf-black-300;
-  -webkit-box-shadow: -4px 0px 2px -2px $color-pf-black-300;
-  -moz-box-shadow: -4px 0px 2px -2px $color-pf-black-300;
-  label {
-    font-weight: 400;
-  }
+  label { font-weight: 400; }
   .form-group {
     margin-bottom: 5px;
     padding-top: 5px;
     padding-bottom: 5px;
   }
-  .clear-float {
-    clear: both;
-  }
+  .clear-float { clear: both; }
   .detail-close {
     cursor: pointer;
     font-size: em(18);
   }
-
   .detail-id {
-    font-weight: 700;
-    margin:0;
+    margin: 0;
     padding-left: .6em;
-    line-height: 1 !important;
     font-size: $pf-icon-2x;
+    font-weight: 700;
+    line-height: 1 !important;
   }
 }
diff --git a/src/app/sort/sort.component.scss b/src/app/sort/sort.component.scss
@@ -1,15 +1,12 @@
 @import '../../assets/stylesheets/_base';
-
 .sort-pf {
   .btn-link {
+    margin-left: 10px;
+    padding: 4px 0;
+    min-width: 0;
     color: #252525;
     font-size: 16px;
     line-height: 1;
-    margin-left: 10px;
-    padding: 4px 0;
-    min-width: 0px;
-    &:hover {
-      color: #0088ce;
-    }
+    &:hover { color: #0088ce; }
   }
 }
diff --git a/src/app/toolbar/toolbar.component.scss b/src/app/toolbar/toolbar.component.scss
@@ -1,29 +1,18 @@
 @import '../../assets/stylesheets/_base';
-
-@media (min-width: 768px) {
-  .toolbar-pf-actions .toolbar-apf-filter {
-    padding-left: 0;
-  }
-}
 .toolbar-pf-actions {
-  .btn {
-    min-width: unset;
-  }
+  .btn { min-width: unset; }
   .toolbar-pf-view-selector {
-    a {
-      cursor: pointer;
-    }
+    a { cursor: pointer; }
   }
   .dropdown-menu {
-    a {
-      cursor: pointer;
-    }
-  }
-  .dropdown-kebab-pf {
-    float: right;
+    a { cursor: pointer; }
   }
+  .dropdown-kebab-pf { float: right; }
   .toolbar-apf-filter {
     padding-left: 0 !important;
+    @media (min-width: 768px) {
+      padding-left: 0;
+    }
   }
 }
 .toolbar-pf-include-actions {
@@ -34,6 +23,4 @@
   opacity: 0;
   pointer-events: none;
 }
-.toolbar-pf-actions.no-filter-results {
-  margin-bottom: 10px;
-}
+.toolbar-pf-actions.no-filter-results { margin-bottom: 10px; }