git ssb

1+

punkmonk.termux / mvd



forked from ev / mvd

Commit d09d2a856ec4fe57fc11895e72383da4dc65c128

Browse Files

simple dark buttons

Ev Bogue committed on 5/23/2018, 3:21:32 PM
Parent: 3684a134e04665d9b2a1f3088d936ac5af922e38

Files changed

style.csschanged
style.css.jsonchanged
style.cssView
@@ -1,7 +1,7 @@
11 body {
22 margin: 0;
3- background: #111;
3+ background: #141414;
44 font-family: sans-serif;
55 color: #d5d5d5;
66 font-size: 14px;
77 line-height: 20px;
@@ -10,8 +10,13 @@
1010 .hyperscroll {
1111 width: 100%;
1212 }
1313
14+.header {
15+ padding-bottom: .7em;
16+ border-bottom: 1px solid #252525;
17+}
18+
1419 a {
1520 color: white;
1621 *text-decoration: none;
1722 }
@@ -48,9 +53,9 @@
4853 top: 0;
4954 }
5055
5156 .navbar .internal {
52- max-width: 645px;
57+ max-width: 680px;
5358 margin-left: auto;
5459 margin-right: auto;
5560 }
5661
@@ -91,9 +96,9 @@
9196 padding-left: 1em;
9297 }
9398
9499 .message:hover, .embedded:hover {
95- background: #222;
100+ background: #141414;
96101 }
97102
98103 .message img {
99104 max-width: 100%;
@@ -152,35 +157,16 @@
152157 margin-bottom: 0;
153158 margin-right: .2em;
154159 font-size: 14px;
155160 line-height: 20px;
156- color: #333333;
161+ color: #d5d5d5;
157162 text-align: center;
158- text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
163+ text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
159164 vertical-align: middle;
160165 cursor: pointer;
161- background-color: #f5f5f5;
162- *background-color: #e6e6e6;
163- background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
164- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
165- background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
166- background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
167- background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
168- background-repeat: repeat-x;
169- border: 1px solid #cccccc;
170- *border: 0;
171- border-color: #e6e6e6 #e6e6e6 #bfbfbf;
172- border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
173- border-bottom-color: #b3b3b3;
174- -webkit-border-radius: 4px;
175- -moz-border-radius: 4px;
176- border-radius: 4px;
177- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
178- filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
179- *zoom: 1;
180- -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
181- -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
182- box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
166+ background-color: #222;
167+ border: 1px solid #222;
168+ border-radius: 4px;
183169 }
184170
185171
186172 .btn:hover,
@@ -188,44 +174,17 @@
188174 .btn:active,
189175 .btn.active,
190176 .btn.disabled,
191177 .btn[disabled] {
192- color: #333333;
193- *background-color: #e6e6e6;
194- background-color: #d9d9d9;
178+ color: white;
179+ background-color: black;
195180 }
196181
197182 .btn:active,
198183 .btn.active {
199- background-color: #cccccc \9;
184+ background-color: #111;
200185 }
201186
202187 .btn:first-child {
203188 *margin-left: 0;
204189 }
205190
206-.btn:hover,
207-.btn:focus {
208- color: #333333;
209- text-decoration: none;
210- background-position: 0 -15px;
211- -webkit-transition: background-position 0.1s linear;
212- -moz-transition: background-position 0.1s linear;
213- -o-transition: background-position 0.1s linear;
214- transition: background-position 0.1s linear;
215-}
216-
217-.btn:focus {
218- outline: thin dotted #333;
219- outline: 5px auto -webkit-focus-ring-color;
220- outline-offset: -2px;
221-}
222-
223-.btn.active,
224-.btn:active {
225- background-image: none;
226- outline: 0;
227- -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
228- -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
229- box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
230-}
231-
style.css.jsonView
@@ -1,1 +1,1 @@
1-"body {\n margin: 0;\n background: #111;\n font-family: sans-serif;\n color: #d5d5d5;\n font-size: 14px; \n line-height: 20px;\n}\n\n.hyperscroll {\n width: 100%;\n}\n\na {\n color: white;\n *text-decoration: none;\n}\n\na:hover {\n color: #ddd;\n}\n\n.navbar a {\n color: #999;\n text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\n text-decoration: none;\n}\n\n.navbar a:hover, .navbar a:focus {\n color: #fff;\n text-decoration: none;\n}\n\n.navbar {\n background: #1b1b1b;\n background: linear-gradient(#222, #111);\n border-bottom: 1px solid #252525;\n}\n\n.navbar {\n width: 100%;\n position: fixed;\n z-index: 1000;\n margin: 0;\n padding-top: .3em;\n padding-bottom: .3em;\n left: 0; right: 0;\n top: 0;\n}\n\n.navbar .internal {\n max-width: 645px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.navbar li {\n margin-top: .3em;\n float: left;\n padding-right: .6em;\n padding-left: .3em;\n list-style-type: none;\n}\n\n\n.hyperscroll > .content {\n max-width: 680px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.message, .message > *, .navbar, .navbar > * {\n animation: fadein .5s;\n}\n\n@keyframes fadein {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n.message, .embedded {\n display: block;\n margin: .6em;\n background: #111;\n padding: .7em;\n border-radius: 3px;\n border: 1px solid #252525;\n}\n\n.embedded {\n padding-left: 1em;\n}\n\n.message:hover, .embedded:hover {\n background: #222;\n}\n\n.message img {\n max-width: 100%;\n}\n\n.timestamp, .votes {\n float: right;\n}\n \n.avatar--small img {\n vertical-align: top;\n width: 1.4em;\n height: 1.4em;\n margin-right: .2em;\n}\n\n.compose {\n background: #222;\n color: #ccc;\n width: 100%;\n height: 100px;\n border: none;\n}\n\n.emoji {\n float: left;\n width: 1em;\n vertical-align: top;\n}\n\npre {\n width: 100%;\n display: block;\n}\n\ncode {\n display: inline-block;\n vertical-align: bottom;\n}\n\ncode, pre {\noverflow: auto;\nword-break: break-all;\nword-wrap: break-word;\nwhite-space: pre;\nwhite-space: -moz-pre-wrap;\nwhite-space: pre-wrap;\nwhite-space: pre\\9;\n}\n\n\n.btn {\n display: inline-block;\n *display: inline;\n padding: 2px 6px;\n margin-bottom: 0;\n margin-right: .2em;\n font-size: 14px;\n line-height: 20px;\n color: #333333;\n text-align: center;\n text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);\n vertical-align: middle;\n cursor: pointer;\n background-color: #f5f5f5;\n *background-color: #e6e6e6;\n background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);\n background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));\n background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);\n background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);\n background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);\n background-repeat: repeat-x;\n border: 1px solid #cccccc;\n *border: 0;\n border-color: #e6e6e6 #e6e6e6 #bfbfbf;\n border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);\n border-bottom-color: #b3b3b3;\n -webkit-border-radius: 4px;\n -moz-border-radius: 4px;\n border-radius: 4px;\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);\n filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);\n *zoom: 1;\n -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\n -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\n box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n\n.btn:hover,\n.btn:focus,\n.btn:active,\n.btn.active,\n.btn.disabled,\n.btn[disabled] {\n color: #333333;\n *background-color: #e6e6e6;\n background-color: #d9d9d9;\n}\n\n.btn:active,\n.btn.active {\n background-color: #cccccc \\9;\n}\n\n.btn:first-child {\n *margin-left: 0;\n}\n\n.btn:hover,\n.btn:focus {\n color: #333333;\n text-decoration: none;\n background-position: 0 -15px;\n -webkit-transition: background-position 0.1s linear;\n -moz-transition: background-position 0.1s linear;\n -o-transition: background-position 0.1s linear;\n transition: background-position 0.1s linear;\n}\n\n.btn:focus {\n outline: thin dotted #333;\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: -2px;\n}\n\n.btn.active,\n.btn:active {\n background-image: none;\n outline: 0;\n -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\n -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\n box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n"
1+"body {\n margin: 0;\n background: #141414;\n font-family: sans-serif;\n color: #d5d5d5;\n font-size: 14px; \n line-height: 20px;\n}\n\n.hyperscroll {\n width: 100%;\n}\n\n.header {\n padding-bottom: .7em;\n border-bottom: 1px solid #252525;\n}\n\na {\n color: white;\n *text-decoration: none;\n}\n\na:hover {\n color: #ddd;\n}\n\n.navbar a {\n color: #999;\n text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);\n text-decoration: none;\n}\n\n.navbar a:hover, .navbar a:focus {\n color: #fff;\n text-decoration: none;\n}\n\n.navbar {\n background: #1b1b1b;\n background: linear-gradient(#222, #111);\n border-bottom: 1px solid #252525;\n}\n\n.navbar {\n width: 100%;\n position: fixed;\n z-index: 1000;\n margin: 0;\n padding-top: .3em;\n padding-bottom: .3em;\n left: 0; right: 0;\n top: 0;\n}\n\n.navbar .internal {\n max-width: 680px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.navbar li {\n margin-top: .3em;\n float: left;\n padding-right: .6em;\n padding-left: .3em;\n list-style-type: none;\n}\n\n\n.hyperscroll > .content {\n max-width: 680px;\n margin-left: auto;\n margin-right: auto;\n}\n\n.message, .message > *, .navbar, .navbar > * {\n animation: fadein .5s;\n}\n\n@keyframes fadein {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n.message, .embedded {\n display: block;\n margin: .6em;\n background: #111;\n padding: .7em;\n border-radius: 3px;\n border: 1px solid #252525;\n}\n\n.embedded {\n padding-left: 1em;\n}\n\n.message:hover, .embedded:hover {\n background: #141414;\n}\n\n.message img {\n max-width: 100%;\n}\n\n.timestamp, .votes {\n float: right;\n}\n \n.avatar--small img {\n vertical-align: top;\n width: 1.4em;\n height: 1.4em;\n margin-right: .2em;\n}\n\n.compose {\n background: #222;\n color: #ccc;\n width: 100%;\n height: 100px;\n border: none;\n}\n\n.emoji {\n float: left;\n width: 1em;\n vertical-align: top;\n}\n\npre {\n width: 100%;\n display: block;\n}\n\ncode {\n display: inline-block;\n vertical-align: bottom;\n}\n\ncode, pre {\noverflow: auto;\nword-break: break-all;\nword-wrap: break-word;\nwhite-space: pre;\nwhite-space: -moz-pre-wrap;\nwhite-space: pre-wrap;\nwhite-space: pre\\9;\n}\n\n\n.btn {\n display: inline-block;\n *display: inline;\n padding: 2px 6px;\n margin-bottom: 0;\n margin-right: .2em;\n font-size: 14px;\n line-height: 20px;\n color: #d5d5d5;\n text-align: center;\n text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);\n vertical-align: middle;\n cursor: pointer;\n background-color: #222;\n border: 1px solid #222;\n border-radius: 4px;\n}\n\n\n.btn:hover,\n.btn:focus,\n.btn:active,\n.btn.active,\n.btn.disabled,\n.btn[disabled] {\n color: white;\n background-color: black;\n}\n\n.btn:active,\n.btn.active {\n background-color: #111;\n}\n\n.btn:first-child {\n *margin-left: 0;\n}\n\n"

Built with git-ssb-web