apps/workbench/app/assets/stylesheets/application.css.scss

   1 /*
   2  * This is a manifest file that'll be compiled into application.css, which will include all the files
   3  * listed below.
   4  *
   5  * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
   6  * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
   7  *
   8  * You're free to add application-wide styles to this file and they'll appear at the top of the
   9  * compiled file, but it's generally better to create a new file per style scope.
  10  *
  11  *= require_self
  12  *= require bootstrap
  13  *= require bootstrap3-editable/bootstrap-editable
  14  *= require_tree .
  15  */
  16
  17 .contain-align-left {
  18     text-align: left;
  19 }
  20 table.topalign>tbody>tr>td {
  21     vertical-align: top;
  22 }
  23 table.topalign>thead>tr>td {
  24     vertical-align: bottom;
  25 }
  26 tr.cell-valign-center>td {
  27     vertical-align: middle;
  28 }
  29 tr.cell-noborder>td,tr.cell-noborder>th {
  30     border: none;
  31 }
  32 table.table-justforlayout>tr>td,
  33 table.table-justforlayout>tr>th,
  34 table.table-justforlayout>thead>tr>td,
  35 table.table-justforlayout>thead>tr>th,
  36 table.table-justforlayout>tbody>tr>td,
  37 table.table-justforlayout>tbody>tr>th{
  38     border: none;
  39 }
  40 table.table-justforlayout {
  41     margin-bottom: 0;
  42 }
  43 .smaller-text {
  44     font-size: .8em;
  45 }
  46 .deemphasize {
  47     font-size: .8em;
  48     color: #888;
  49 }
  50 .arvados-filename,
  51 .arvados-uuid {
  52     font-size: .8em;
  53     font-family: monospace;
  54 }
  55 table .data-size, .table .data-size {
  56     text-align: right;
  57 }
  58 body .editable-empty {
  59     color: #999;
  60 }
  61 body .editable-empty:hover {
  62     color: #0088cc;
  63 }
  64 table.arv-index tbody td.arv-object-AuthorizedKey.arv-attr-public_key {
  65     overflow-x: hidden;
  66     max-width: 120px;
  67 }
  68 table.arv-index > thead > tr > th {
  69     border-top: none;
  70 }
  71 table.table-fixedlayout {
  72     white-space: nowrap;
  73     table-layout: fixed;
  74 }
  75 table.table-fixedlayout td {
  76     overflow: hidden;
  77     overflow-x: hidden;
  78     text-overflow: ellipsis;
  79 }
  80 table.table-smallcontent td {
  81     font-size: 85%;
  82 }
  83 form input.search-mini {
  84     padding: 0 6px;
  85 }
  86 form.small-form-margin {
  87     margin-bottom: 2px;
  88 }
  89 .nowrap {
  90     white-space: nowrap;
  91 }
  92
  93 /* top nav */
  94 $top-nav-bg: #3c163d;
  95 $top-nav-bg-bottom: #260027;
  96 nav.navbar-fixed-top .navbar-brand {
  97     color: #79537a;
  98     letter-spacing: 0.4em;
  99 }
 100 nav.navbar-fixed-top {
 101     background: $top-nav-bg;
 102     background: linear-gradient(to bottom, $top-nav-bg 0%,$top-nav-bg-bottom 100%);
 103 }
 104 .navbar.breadcrumbs {
 105     line-height: 50px;
 106     border-radius: 0;
 107     margin-bottom: 0;
 108     border-right: 0;
 109     border-left: 0;
 110 }
 111 .navbar.breadcrumbs .nav > li > a,
 112 .navbar.breadcrumbs .nav > li {
 113     color: #000;
 114 }
 115 .navbar.breadcrumbs .nav > li.nav-separator > i {
 116     color: #bbb;
 117 }
 118 .navbar.breadcrumbs .navbar-form {
 119   margin-top: 0px;
 120   margin-bottom: 0px;
 121 }
 122 .navbar.breadcrumbs .navbar-text {
 123   margin-top: 0px;
 124   margin-bottom: 0px;
 125 }
 126
 127 nav.navbar-fixed-top .navbar-nav.navbar-right > li.open > a,
 128 nav.navbar-fixed-top .navbar-nav.navbar-right > li.open > a:focus,
 129 nav.navbar-fixed-top .navbar-nav.navbar-right > li.open > a:hover {
 130     background: lighten($top-nav-bg, 5%);
 131 }
 132 nav.navbar-fixed-top .navbar-nav.navbar-right > li > a,
 133 nav.navbar-fixed-top .navbar-nav.navbar-right > li > a:focus,
 134 nav.navbar-fixed-top .navbar-nav.navbar-right > li > a:hover {
 135     color: #fff;
 136 }
 137
 138 .dax {
 139     max-width: 10%;
 140     margin-right: 1em;
 141     float: left
 142 }
 143
 144 .smart-scroll {
 145     overflow: auto;
 146     margin-bottom: -15px;
 147 }
 148
 149 .infinite-scroller .fa-warning {
 150     color: #800;
 151 }
 152
 153 th[data-sort-order] {
 154     cursor: pointer;
 155 }
 156
 157 .inline-progress-container div.progress {
 158     margin-bottom: 0;
 159 }
 160
 161 .inline-progress-container {
 162     width: 100%;
 163     display:inline-block;
 164 }
 165
 166 td.add-tag-button {
 167     white-space: normal;
 168 }
 169 td.add-tag-button .add-tag-button {
 170     margin-right: 4px;
 171     opacity: 0.2;
 172 }
 173 td.add-tag-button .add-tag-button:hover {
 174     opacity: 1;
 175 }
 176 span.removable-tag-container {
 177     line-height: 1.6;
 178 }
 179 .label.removable-tag a {
 180     color: #fff;
 181     cursor: pointer;
 182 }
 183
 184 li.notification {
 185     padding: 10px;
 186 }
 187
 188 // See HeaderRowFixer in application.js
 189 table.table-fixed-header-row {
 190     width: 100%;
 191     border-spacing: 0px;
 192     margin:0;
 193 }
 194 table.table-fixed-header-row thead {
 195     position:fixed;
 196     background: #fff;
 197 }
 198 table.table-fixed-header-row tbody {
 199     position:relative;
 200     top:1.5em;
 201 }
 202
 203 /* Setting the height needs to be fixed with javascript. */
 204 .dropdown-menu {
 205     padding-right: 20px;
 206     max-height: 440px;
 207     width: 400px;
 208     overflow-y: auto;
 209 }
 210
 211 .row-fill-height, .row-fill-height>div[class*='col-'] {
 212     display: flex;
 213 }
 214 .row-fill-height>div[class*='col-']>div {
 215     width: 100%;
 216 }
 217
 218 /* Show editable popover above side-nav */
 219 .editable-popup.popover {
 220     z-index:1055;
 221 }
 222
 223 /* Do not leave space for left-nav */
 224 div#wrapper {
 225   padding-left: 0;
 226 }
 227
 228 .arv-description-as-subtitle {
 229   padding-bottom: 1em;
 230 }
 231 .arv-description-in-table {
 232   height: 4em;
 233   overflow-x: hidden;
 234   overflow-y: hidden;
 235 }
 236 .arv-description-in-table:hover {
 237   overflow-y: auto;
 238 }
 239
 240 .btn.btn-nodecorate {
 241   border: none;
 242 }
 243 svg text {
 244     font-size: 6pt;
 245 }
 246
 247 div.pane-content iframe {
 248   width: 100%;
 249   border: none;
 250 }
 251 span.editable-textile {
 252   display: inline-block;
 253 }
 254 .text-overflow-ellipsis {
 255   white-space: nowrap;
 256   overflow: hidden;
 257   text-overflow: ellipsis;
 258 }
 259 .time-label-divider {
 260   font-size: 80%;
 261   min-width: 1em;
 262   padding: 0px 2px 0px 0px;
 263 }
 264 .task-summary-status {
 265   font-size: 80%;
 266 }
 267 #page-wrapper > div > h2 {
 268   margin-top: 0px;
 269 }
 270
 271 .compute-summary-numbers td {
 272   font-size: 150%;
 273 }