← Back to branch summary

~johnsca/charms/trusty/cloudfoundry/better-basic-reconciler-status

« back to all changes in this revision

Viewing changes to reconciler/ui/static/semantic/uncompressed/views/comment.css

  • Committer: Whit Morriss
  • Date: 2014-10-13 06:50:17 UTC
  • mto: (132.2.1 reconciler) (145.1.1 trunk)
  • mto: This revision was merged to the branch mainline in revision 156.
  • 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/views/comment.css
 
1
/*
 
2
 * # Semantic Comment View
 
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
 * Released: April 17 2014
 
11
 */
 
12
/*******************************
 
13
            Standard
 
14
*******************************/
 
15
/*--------------
 
16
    Comments
 
17
---------------*/
 
18
.ui.comments a {
 
19
  cursor: pointer;
 
20
}
 
21
/*--------------
 
22
     Comment
 
23
---------------*/
 
24
.ui.comments .comment {
 
25
  position: relative;
 
26
  margin-top: 0.5em;
 
27
  padding-top: 0.5em;
 
28
}
 
29
.ui.comments .comment:first-child {
 
30
  margin-top: 0em;
 
31
  padding-top: 0em;
 
32
}
 
33
/*--------------------
 
34
   Avatar (Optional)
 
35
---------------------*/
 
36
.ui.comments .comment .avatar {
 
37
  display: block;
 
38
  float: left;
 
39
  width: 4em;
 
40
}
 
41
.ui.comments .comment .avatar img {
 
42
  display: block;
 
43
  margin: 0em auto;
 
44
  width: 3em;
 
45
  height: 3em;
 
46
  border-radius: 500px;
 
47
}
 
48
/*--------------
 
49
     Content
 
50
---------------*/
 
51
.ui.comments .comment > .content,
 
52
.ui.comments .comment > .avatar {
 
53
  display: block;
 
54
}
 
55
.ui.comments .comment .avatar ~ .content {
 
56
  padding: 0em 1em;
 
57
}
 
58
/* If there is an avatar move content over */
 
59
.ui.comments .comment > .avatar ~ .content {
 
60
  padding-top: 0.25em;
 
61
  margin-left: 3.5em;
 
62
}
 
63
.ui.comments .comment .metadata {
 
64
  display: inline-block;
 
65
  margin-left: 0.3em;
 
66
  color: rgba(0, 0, 0, 0.4);
 
67
}
 
68
.ui.comments .comment .metadata > * {
 
69
  display: inline-block;
 
70
  margin: 0em 0.3em 0em 0em;
 
71
}
 
72
/*--------------------
 
73
     Comment Text
 
74
---------------------*/
 
75
.ui.comments .comment .text {
 
76
  margin: 0.25em 0em 0.5em;
 
77
  word-wrap: break-word;
 
78
}
 
79
/*--------------------
 
80
     User Actions
 
81
---------------------*/
 
82
.ui.comments .comment .actions {
 
83
  font-size: 0.9em;
 
84
}
 
85
.ui.comments .comment .actions a {
 
86
  display: inline-block;
 
87
  margin: 0em 0.3em 0em 0em;
 
88
  color: rgba(0, 0, 0, 0.3);
 
89
}
 
90
.ui.comments .comment .actions a.active,
 
91
.ui.comments .comment .actions a:hover {
 
92
  color: rgba(0, 0, 0, 0.6);
 
93
}
 
94
/*--------------------
 
95
      Reply Form
 
96
---------------------*/
 
97
.ui.comments .reply.form {
 
98
  margin-top: 0.75em;
 
99
  width: 100%;
 
100
  max-width: 30em;
 
101
}
 
102
.ui.comments .comment .reply.form {
 
103
  margin-left: 2em;
 
104
}
 
105
.ui.comments > .reply.form {
 
106
  margin-top: 1.5em;
 
107
  max-width: 40em;
 
108
}
 
109
.ui.comments .reply.form textarea {
 
110
  height: 12em;
 
111
}
 
112
/*--------------------
 
113
    Nested Comments
 
114
---------------------*/
 
115
.ui.comments .comment .comments {
 
116
  margin-top: 0.5em;
 
117
  padding-top: 0.5em;
 
118
  padding-bottom: 1em;
 
119
}
 
120
.ui.comments .comment .comments:before {
 
121
  position: absolute;
 
122
  top: 0px;
 
123
  left: 0px;
 
124
}
 
125
/* One Deep */
 
126
.ui.comments > .comment .comments {
 
127
  margin-left: 2em;
 
128
}
 
129
/* Two Deep */
 
130
.ui.comments > .comment > .comments > .comment > .comments {
 
131
  margin-left: 1.75em;
 
132
}
 
133
/* Three Deep */
 
134
.ui.comments > .comment > .comments > .comment > .comments > .comment > .comments {
 
135
  margin-left: 1.5em;
 
136
}
 
137
/* Four Deep or more */
 
138
.ui.comments > .comment > .comments > .comment > .comments > .comment > .comments > .comment .comments {
 
139
  margin-left: 0.5em;
 
140
}
 
141
/*******************************
 
142
           Variations
 
143
*******************************/
 
144
/*--------------------
 
145
        Threaded
 
146
---------------------*/
 
147
.ui.threaded.comments .comment .comments {
 
148
  margin-left: 2em !important;
 
149
  padding-left: 2em !important;
 
150
  -webkit-box-shadow: -1px 0px 0px rgba(0, 0, 0, 0.05);
 
151
  box-shadow: -1px 0px 0px rgba(0, 0, 0, 0.05);
 
152
}
 
153
/*--------------------
 
154
        Minimal
 
155
---------------------*/
 
156
.ui.minimal.comments .comment .actions {
 
157
  opacity: 0;
 
158
  -webkit-transition: opacity 0.1s ease-out;
 
159
  -moz-transition: opacity 0.1s ease-out;
 
160
  transition: opacity 0.1s ease-out;
 
161
  -webkit-transition-delay: 0.1s;
 
162
  -moz-transition-delay: 0.1s;
 
163
  transition-delay: 0.1s;
 
164
}
 
165
.ui.minimal.comments .comment > .content:hover > .actions {
 
166
  opacity: 1;
 
167
}
 
168
/*--------------------
 
169
       Sizes
 
170
---------------------*/
 
171
.ui.small.comments {
 
172
  font-size: 0.875em;
 
173
}