move to 2.5.5
[anni] / priv / static / static-fe / static-fe.css
1 body {
2     background-color: #282c37;
3     font-family: sans-serif;
4     color: white;
5 }
6
7 main {
8     margin: 50px auto;
9     max-width: 960px;
10     padding: 40px;
11     background-color: #313543;
12     border-radius: 4px;
13 }
14
15 header {
16     margin: 50px auto;
17     max-width: 960px;
18     padding: 40px;
19     background-color: #313543;
20     border-radius: 4px;
21 }
22
23 .activity {
24     border-radius: 4px;
25     padding: 1em;
26     padding-bottom: 2em;
27     margin-bottom: 1em;
28 }
29
30 .avatar {
31     cursor: pointer;
32 }
33
34 .avatar img {
35     float: left;
36     border-radius: 4px;
37     margin-right: 4px;
38 }
39
40 .activity-content img, video, audio {
41     padding: 1em;
42     max-width: 800px;
43     max-height: 800px;
44 }
45
46 #selected {
47     background-color: #1b2735;
48 }
49
50 .counts dt, .counts dd {
51     float: left;
52     margin-left: 1em;
53 }
54
55 a {
56     color: white;
57 }
58
59 .h-card {
60     min-height: 48px;
61     margin-bottom: 8px;
62 }
63
64 header a, .h-card a {
65     text-decoration: none;
66 }
67
68 header a:hover, .h-card a:hover {
69     text-decoration: underline;
70 }
71
72 .display-name {
73     padding-top: 4px;
74     display: block;
75     text-overflow: ellipsis;
76     overflow: hidden;
77     color: white;
78 }
79
80 /* keep emoji from being hilariously huge */
81 .display-name img {
82     max-height: 1em;
83     max-width: 1em;
84 }
85
86 .display-name .nickname {
87     padding-top: 4px;
88     display: block;
89 }
90
91 .nickname:hover {
92     text-decoration: none;
93 }
94
95 .pull-right {
96     float: right;
97 }
98
99 .collapse {
100     margin: 0;
101     width: auto;
102 }
103
104 h1 {
105     margin: 0;
106 }
107
108 h2 {
109     color: #9baec8;
110     font-weight: normal;
111     font-size: 20px;
112     margin-bottom: 40px;
113 }
114
115 form {
116     width: 100%;
117 }
118
119 input {
120     box-sizing: border-box;
121     width: 100%;
122     padding: 10px;
123     margin-top: 20px;
124     background-color: rgba(0,0,0,.1);
125     color: white;
126     border: 0;
127     border-bottom: 2px solid #9baec8;
128     font-size: 14px;
129 }
130
131 input:focus {
132     border-bottom: 2px solid #4b8ed8;
133 }
134
135 input[type="checkbox"] {
136     width: auto;
137 }
138
139 button {
140     box-sizing: border-box;
141     width: 100%;
142     color: white;
143     background-color: #419bdd;
144     border-radius: 4px;
145     border: none;
146     padding: 10px;
147     margin-top: 30px;
148     text-transform: uppercase;
149     font-weight: 500;
150     font-size: 16px;
151 }
152
153 .alert-danger {
154     box-sizing: border-box;
155     width: 100%;
156     color: #D8000C;
157     background-color: #FFD2D2;
158     border-radius: 4px;
159     border: none;
160     padding: 10px;
161     margin-top: 20px;
162     font-weight: 500;
163     font-size: 16px;
164 }
165
166 .alert-info {
167     box-sizing: border-box;
168     width: 100%;
169     color: #00529B;
170     background-color: #BDE5F8;
171     border-radius: 4px;
172     border: none;
173     padding: 10px;
174     margin-top: 20px;
175     font-weight: 500;
176     font-size: 16px;
177 }
178
179 img.emoji {
180   width: 32px;
181   height: 32px;
182   padding: 0;
183   vertical-align: middle;
184 }