← Back to branch summary

~johnsca/charms/trusty/cloudfoundry/reconciler-ui

« back to all changes in this revision

Viewing changes to reconciler/ui/static/semantic/uncompressed/elements/divider.css

  • Committer: Whit Morriss
  • Date: 2014-10-13 06:50:17 UTC
  • Revision ID: whit.morriss@canonical.com-20141013065017-0feo2ku3yllymkol
reorg reconciler

Show diffs side-by-side

added added

removed removed

Lines of Context:
reconciler/ui/static/semantic/uncompressed/elements/divider.css
 
1
/*
 
2
 * # Semantic - Divider
 
3
 * http://github.com/jlukic/semantic-ui/
 
4
 *
 
5
 *
 
6
 * Copyright 2014 Contributors
 
7
 * Released under the MIT license
 
8
 * http://opensource.org/licenses/MIT
 
9
 *
 
10
 */
 
11
/*******************************
 
12
            Divider
 
13
*******************************/
 
14
.ui.divider {
 
15
  margin: 1rem 0rem;
 
16
  border-top: 1px solid rgba(0, 0, 0, 0.1);
 
17
  border-bottom: 1px solid rgba(255, 255, 255, 0.8);
 
18
  line-height: 1;
 
19
  height: 0em;
 
20
  -webkit-box-sizing: border-box;
 
21
  -moz-box-sizing: border-box;
 
22
  -ms-box-sizing: border-box;
 
23
  box-sizing: border-box;
 
24
  -webkit-user-select: none;
 
25
  -moz-user-select: none;
 
26
  -ms-user-select: none;
 
27
  user-select: none;
 
28
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 
29
}
 
30
.ui.vertical.divider,
 
31
.ui.horizontal.divider {
 
32
  position: absolute;
 
33
  border: none;
 
34
  height: 0em;
 
35
  margin: 0em;
 
36
  background-color: transparent;
 
37
  font-size: 0.875rem;
 
38
  font-weight: bold;
 
39
  text-align: center;
 
40
  text-transform: uppercase;
 
41
  color: rgba(0, 0, 0, 0.8);
 
42
}
 
43
/*--------------
 
44
    Vertical
 
45
---------------*/
 
46
.ui.vertical.divider {
 
47
  position: absolute;
 
48
  z-index: 2;
 
49
  top: 50%;
 
50
  left: 50%;
 
51
  margin: 0% 0% 0% -3%;
 
52
  width: 6%;
 
53
  height: 50%;
 
54
  line-height: 0;
 
55
  padding: 0em;
 
56
}
 
57
.ui.vertical.divider:before,
 
58
.ui.vertical.divider:after {
 
59
  position: absolute;
 
60
  left: 50%;
 
61
  content: " ";
 
62
  z-index: 3;
 
63
  border-left: 1px solid rgba(0, 0, 0, 0.1);
 
64
  border-right: 1px solid rgba(255, 255, 255, 0.8);
 
65
  width: 0%;
 
66
  height: 80%;
 
67
}
 
68
.ui.vertical.divider:before {
 
69
  top: -100%;
 
70
}
 
71
.ui.vertical.divider:after {
 
72
  top: auto;
 
73
  bottom: 0px;
 
74
}
 
75
/*--------------
 
76
    Horizontal
 
77
---------------*/
 
78
.ui.horizontal.divider {
 
79
  position: relative;
 
80
  top: 0%;
 
81
  left: 0%;
 
82
  margin: 1rem 1.5rem;
 
83
  height: auto;
 
84
  padding: 0em;
 
85
  line-height: 1;
 
86
}
 
87
.ui.horizontal.divider:before,
 
88
.ui.horizontal.divider:after {
 
89
  position: absolute;
 
90
  content: " ";
 
91
  z-index: 3;
 
92
  width: 50%;
 
93
  top: 50%;
 
94
  height: 0%;
 
95
  border-top: 1px solid rgba(0, 0, 0, 0.1);
 
96
  border-bottom: 1px solid rgba(255, 255, 255, 0.8);
 
97
}
 
98
.ui.horizontal.divider:before {
 
99
  left: 0%;
 
100
  margin-left: -1.5rem;
 
101
}
 
102
.ui.horizontal.divider:after {
 
103
  left: auto;
 
104
  right: 0%;
 
105
  margin-right: -1.5rem;
 
106
}
 
107
/*--------------
 
108
      Icon
 
109
---------------*/
 
110
.ui.divider > .icon {
 
111
  margin: 0em;
 
112
  font-size: 1rem;
 
113
  vertical-align: middle;
 
114
}
 
115
/*******************************
 
116
            Variations
 
117
*******************************/
 
118
/*--------------
 
119
    Inverted
 
120
---------------*/
 
121
.ui.divider.inverted {
 
122
  color: #ffffff;
 
123
}
 
124
.ui.vertical.inverted.divider,
 
125
.ui.horizontal.inverted.divider {
 
126
  color: rgba(255, 255, 255, 0.9);
 
127
}
 
128
.ui.divider.inverted,
 
129
.ui.divider.inverted:after,
 
130
.ui.divider.inverted:before {
 
131
  border-top-color: rgba(0, 0, 0, 0.15);
 
132
  border-bottom-color: rgba(255, 255, 255, 0.15);
 
133
  border-left-color: rgba(0, 0, 0, 0.15);
 
134
  border-right-color: rgba(255, 255, 255, 0.15);
 
135
}
 
136
/*--------------
 
137
    Fitted
 
138
---------------*/
 
139
.ui.fitted.divider {
 
140
  margin: 0em;
 
141
}
 
142
/*--------------
 
143
    Clearing
 
144
---------------*/
 
145
.ui.clearing.divider {
 
146
  clear: both;
 
147
}
 
148
/*--------------
 
149
    Section
 
150
---------------*/
 
151
.ui.section.divider {
 
152
  margin-top: 2rem;
 
153
  margin-bottom: 2rem;
 
154
}