cncjs

1
// ==========================================================================
2
// Helper classes
3
// ==========================================================================
4

5
// @stylint off
6
.wait,
7
.wait * {
8
    cursor: wait !important;
9
}
10
// @stylint on
11

12
// @stylint off
13
/*
14
 * Hide visually and from screen readers: h5bp.com/u
15
 */
16
.hidden {
17
    display: none !important;
18
    visibility: hidden;
19
}
20
// @stylint on
21

22
/*
23
 * Hide only visually, but have it available for screen readers: h5bp.com/v
24
 */
25
.visuallyhidden {
26
    border: 0;
27
    clip: rect(0 0 0 0);
28
    height: 1px;
29
    margin: -1px;
30
    overflow: hidden;
31
    padding: 0;
32
    position: absolute;
33
    width: 1px;
34
}
35

36
/*
37
 * Extends the .visuallyhidden class to allow the element to be focusable
38
 * when navigated to via the keyboard: h5bp.com/p
39
 */
40
.visuallyhidden.focusable:active,
41
.visuallyhidden.focusable:focus {
42
    clip: auto;
43
    height: auto;
44
    margin: 0;
45
    overflow: visible;
46
    position: static;
47
    width: auto;
48
}
49

50
/*
51
 * Hide visually and from screen readers, but maintain layout
52
 */
53
.invisible {
54
    visibility: hidden;
55
}
56

57
/*
58
 * Clearfix: contain floats
59
 *
60
 * For modern browsers
61
 * 1. The space content is one way to avoid an Opera bug when the
62
 *    `contenteditable` attribute is included anywhere else in the document.
63
 *    Otherwise it causes space to appear at the top and bottom of elements
64
 *    that receive the `clearfix` class.
65
 * 2. The use of `table` rather than `block` is only necessary if using
66
 *    `:before` to contain the top-margins of child elements.
67
 */
68
.clearfix:before,
69
.clearfix:after {
70
    content: " "; /* 1 */
71
    display: table; /* 2 */
72
}
73

74
.clearfix:after {
75
    clear: both;
76
}
77

78
.nowrap {
79
    white-space: nowrap;
80
}
81

82
.noselect {
83
    -webkit-touch-callout: none;
84
    -webkit-user-select: none; // webkit (safari, chrome) browsers
85
    -khtml-user-select: none; // webkit (konqueror) browsers
86
    -moz-user-select: none; // mozilla browsers
87
    -ms-user-select: none; // IE10+
88
    user-select: none;
89
}
90

91
.text-overflow-ellipsis {
92
    overflow: hidden;
93
    text-overflow: ellipsis;
94
    white-space: nowrap;
95
    display: inline-block;
96
}
97

98
.caret {
99
    display: inline-block;
100
    width: 0;
101
    height: 0;
102
    vertical-align: middle;
103
    border-top: 4px dashed #666;
104
    border-right: 4px solid transparent;
105
    border-left: 4px solid transparent;
106
    margin-left: 8px;
107
}
108

109
.code {
110
    padding: .2em;
111
    margin: 0;
112
    font-size: 85%;
113
    background-color: rgba(0, 0, 0, .04);
114
    border-radius: 3px;
115

116
    &:before,
117
    &:after {
118
        letter-spacing: -.2em;
119
        content: "\00a0";
120
    }
121
}
122