| 1 | // Copyright 2016 Palantir Technologies, Inc. All rights reserved.
|
| 2 | // Licensed under the Apache License, Version 2.0.
|
| 3 |
|
| 4 | @import "../../common/variables";
|
| 5 | @import "../../common/mixins";
|
| 6 |
|
| 7 | /*
|
| 8 | Non-ideal state
|
| 9 |
|
| 10 | Markup:
|
| 11 | <div class="#{$ns}-non-ideal-state">
|
| 12 | <div class="#{$ns}-non-ideal-state-visual">
|
| 13 | <span class="#{$ns}-icon #{$ns}-icon-folder-open"></span>
|
| 14 | </div>
|
| 15 | <h4 class="#{$ns}-heading">This folder is empty</h4>
|
| 16 | <div>Create a new file to populate the folder.</div>
|
| 17 | <button class="#{$ns}-button #{$ns}-intent-primary">Create</button>
|
| 18 | </div>
|
| 19 |
|
| 20 | Styleguide non-ideal-state
|
| 21 | */
|
| 22 |
|
| 23 | .#{$ns}-non-ideal-state {
|
| 24 | @include pt-flex-container(column, $pt-grid-size * 2);
|
| 25 | align-items: center;
|
| 26 | height: 100%;
|
| 27 | justify-content: center;
|
| 28 | text-align: center;
|
| 29 | width: 100%;
|
| 30 |
|
| 31 | > * {
|
| 32 | max-width: $pt-grid-size * 40;
|
| 33 | }
|
| 34 | }
|
| 35 |
|
| 36 | .#{$ns}-non-ideal-state-visual {
|
| 37 | color: $pt-icon-color-disabled;
|
| 38 | font-size: $pt-icon-size-large * 3;
|
| 39 |
|
| 40 | .#{$ns}-dark & {
|
| 41 | color: $pt-dark-icon-color-disabled;
|
| 42 | }
|
| 43 | }
|