Merge branch 'master' into 3505-virtual-work-dir
[arvados.git] / 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 .inline-progress-container div.progress {
154     margin-bottom: 0;
155 }
156
157 .inline-progress-container {
158     width: 100%;
159     display:inline-block;
160 }
161
162 td.add-tag-button {
163     white-space: normal;
164 }
165 td.add-tag-button .add-tag-button {
166     margin-right: 4px;
167     opacity: 0.2;
168 }
169 td.add-tag-button .add-tag-button:hover {
170     opacity: 1;
171 }
172 span.removable-tag-container {
173     line-height: 1.6;
174 }
175 .label.removable-tag a {
176     color: #fff;
177     cursor: pointer;
178 }
179
180 li.notification {
181     padding: 10px;
182 }
183
184 // See HeaderRowFixer in application.js
185 table.table-fixed-header-row {
186     width: 100%;
187     border-spacing: 0px;
188     margin:0;
189 }
190 table.table-fixed-header-row thead {
191     position:fixed;
192     background: #fff;
193 }
194 table.table-fixed-header-row tbody {
195     position:relative;
196     top:1.5em;
197 }
198
199 /* Setting the height needs to be fixed with javascript. */
200 .dropdown-menu {
201     padding-right: 20px;
202     max-height: 440px;
203     width: 400px;
204     overflow-y: auto;
205 }
206
207 .row-fill-height, .row-fill-height>div[class*='col-'] {
208     display: flex;
209 }
210 .row-fill-height>div[class*='col-']>div {
211     width: 100%;
212 }
213
214 /* Show editable popover above side-nav */
215 .editable-popup.popover {
216     z-index:1055;
217 }
218
219 /* Do not leave space for left-nav */
220 div#wrapper {
221   padding-left: 0;
222 }
223
224 .arv-description-as-subtitle {
225   padding-bottom: 1em;
226 }
227 .arv-description-in-table {
228   height: 4em;
229   overflow-x: hidden;
230   overflow-y: hidden;
231 }
232 .arv-description-in-table:hover {
233   overflow-y: auto;
234 }
235
236 .btn.btn-nodecorate {
237   border: none;
238 }
239 svg text {
240     font-size: 6pt;
241 }
242
243 div.pane-content iframe {
244   width: 100%;
245   border: none;
246 }
247
248 div.rounded {
249   border-radius: 3px;
250 }