keys ui WIP

static/css/core-ui.css

@@ -55,6 +55,30 @@ a:focus {
   outline: none !important;
 }
 
+.co-form-table label {
+  white-space: nowrap;
+}
+
+.co-form-table td {
+  padding: 8px;
+}
+
+.co-form-table td:first-child {
+  vertical-align: top;
+  padding-top: 14px;
+}
+
+.co-form-table td .co-help-text {
+  margin-top: 10px;
+  margin-bottom: 4px;
+}
+
+.co-help-text {
+  margin-top: 6px;
+  color: #aaa;
+  display: inline-block;
+}
+
 .co-options-menu .fa-gear {
   color: #999;
   cursor: pointer;

static/css/directives/ui/markdown-editor.css

@@ -0,0 +1,31 @@
+.markdown-editor-element .wmd-panel .btn {
+  background-color: #ddd;
+}
+
+.markdown-editor-element .wmd-panel .btn:hover {
+  background-color: #eee;
+}
+
+.markdown-editor-element .wmd-panel .btn:active {
+  background-color: #ccc;
+}
+
+.markdown-editor-element .preview-btn {
+    float: right;
+}
+
+.markdown-editor-element .preview-btn.active {
+    box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
+}
+
+.markdown-editor-element .preview-panel .markdown-view {
+    border: 1px solid #eee;
+    padding: 4px;
+    min-height: 150px;
+}
+
+.markdown-editor-element .preview-top-bar {
+    height: 43px;
+    line-height: 43px;
+    color: #ddd;
+}

static/css/directives/ui/service-keys-manager.css

@@ -0,0 +1,89 @@
+.service-keys-manager-element .co-filter-box {
+  float: right;
+}
+
+.service-keys-manager-element .manager-header {
+    margin-bottom:  20px;
+}
+
+@media (max-width: 767px) {
+  .service-keys-manager-element .co-filter-box {
+    float: none;
+    display: block;
+  }
+}
+
+.service-keys-manager-element .approval-user .pretext {
+    vertical-align: middle;
+    margin-right: 4px;
+    font-size: 12px;
+    color: #777;
+}
+
+.service-keys-manager-element .expired a {
+    color: #D64456;
+}
+
+.service-keys-manager-element .critical a {
+    color: #F77454;
+}
+
+.service-keys-manager-element .warning a {
+    color: #FCA657;
+}
+
+.service-keys-manager-element .info a {
+    color: #2FC98E;
+}
+
+.service-keys-manager-element .rotation {
+  color: #777;
+}
+
+.service-keys-manager-element .no-expiration {
+    color: #145884;
+}
+
+.service-keys-manager-element i.fa {
+    margin-right: 4px;
+}
+
+.service-keys-manager-element .approval-rotation {
+    font-size: 12px;
+    color: #777;
+}
+
+.service-keys-manager-element .approval-rotation i.fa {
+    margin-right: 6px;
+}
+
+.service-keys-manager-element .subtitle {
+  color: #999;
+  font-size: 90%;
+  text-transform: uppercase;
+  font-weight: 300;
+  padding-top: 0!important;
+  text-align: left;
+  margin-bottom: 6px;
+  margin-top: 10px;
+}
+
+.service-keys-manager-element .approval-required i.fa {
+    margin-right: 4px;
+}
+
+.service-keys-manager-element .approval-required a {
+    margin-left: 10px;
+}
+
+.service-keys-manager-element .unnamed {
+  color: #ddd;
+}
+
+.service-keys-manager-element .key-display {
+    margin-top: 10px;
+    font-size: 12px;
+    font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
+    background: white;
+    min-height: 500px;
+}

static/css/quay.css

@@ -1382,7 +1382,6 @@ p.editable:hover i {
 .modal-body textarea {
   width: 100%;
   height: 150px;
-  border: 0px;
 }
 
 .tag-specific-images-view .image-listings {
@@ -4034,13 +4033,28 @@ i.rocket-icon {
   text-align: center;
 }
 
- .section-description-header {
+.section-description-header {
   position: relative;
   margin-bottom: 10px;
   min-height: 50px;
   padding-bottom: 10px;
 }
 
+.section-description-header.twenty {
+    margin-top: -20px;
+}
+
+.section-description-header:before {
+  font-family: FontAwesome;
+  content: "\f05a";
+  position: absolute;
+  top: 50%;
+  left: 10px;
+  font-size: 22px;
+  color: #D2D2D2;
+  transform: translateY(-50%);
+}
+
 .nvtooltip h3 {
   margin: 0;
   padding: 4px 14px;