git ssb - tweak light styles to be more like dark style

Matt McKegg committed on 7/6/2018, 1:42:52 PM
Parent: 6fbd24516cd1b0317b93e630e23a65807bfd51a6

styles/dark/toggle-button.mcss	changed
styles/light/base.mcss	changed
styles/light/button.mcss	changed
styles/light/feed-event.mcss	changed
styles/light/message.mcss	changed
styles/light/toggle-button.mcss	changed

styles/dark/toggle-button.mcssView
		@@ -33,16 +33,18 @@
33	33	}
34	34
35	35	-blocking {
36	36	margin-left: 5px
37		- border: 0px
	37	+ :hover {
	38	+ background-color: #bd6363
	39	+ }
38	40	}
39	41
40	42	-unblocking {
41	43	margin-left: 5px
42		- background-color: rgb(212, 112, 112)
43		- color: #ffffff
44		- border: 0px
	44	+ :hover {
	45	+ background-color: rgb(212, 167, 112)
	46	+ }
45	47	}
46	48
47	49	-disabled {
48	50	cursor: default

styles/light/button.mcssView
		@@ -27,11 +27,12 @@
27	27	border-color: #DDD !important;
28	28	}
29	29
30	30	-add {
31		- color: #ffffff;
32		- background-color: #255D24;
33		- border-color: #255D24;
	31	+ :hover {
	32	+ border-color: #7dbd85;
	33	+ background-color: #7dbd85;
	34	+ }
34	35	}
35	36
36	37	-pub {
37	38	color: #ffffff

styles/light/feed-event.mcssView
		@@ -7,9 +7,9 @@
7	7	width: 100%
8	8	margin: 25px auto
9	9
10	10	-group {
11		- background: #e4e4e4
	11	+ background: #e8e8e8
12	12	a.expand {
13	13	display: block;
14	14	padding: 10px;
15	15	background: #f1f1f1;

styles/light/message.mcssView
		@@ -203,10 +203,18 @@
203	203	font-weight: bold;
204	204	}
205	205
206	206	a.likes {
207		- color: #286bc3;
208		- font-size:90%;
	207	+ font-size: 75%;
	208	+ color: #757474
	209	+
	210	+ ::before {
	211	+ content: '❤ '
	212	+ color: #ff2f92
	213	+ }
	214	+ :hover {
	215	+ color: #ff2f92
	216	+ }
209	217	}
210	218
211	219	span.private {
212	220	display: inline-block;
		@@ -290,9 +298,49 @@
290	298	}
291	299	}
292	300
293	301	div.actions {
	302	+ a.like {
	303	+ :before {
	304	+ content: "❤ "
	305	+ }
	306	+ :hover {
	307	+ background: #e26ba4
	308	+ }
	309	+ }
	310	+ a.unlike {
	311	+ :before {
	312	+ content: ""
	313	+ }
	314	+ :hover {
	315	+ background: #959EAB
	316	+ }
	317	+ }
294	318	a {
	319	+ font-size: 13px
	320	+ background: #f3f3f3;
	321	+ padding: 6px 10px;
	322	+ border-radius: 3px;
	323	+ color: #656565;
	324	+ display: inline-block
	325	+ text-align: center
	326	+ transition: background-color 0.25s ease, color 0.25s ease
	327	+
	328	+ :before {
	329	+ content: "↩ "
	330	+ }
	331	+ :hover {
	332	+ background: #7dbd85
	333	+ color: white
	334	+ }
	335	+ }
	336	+ a + a {
	337	+ margin-left: 10px;
	338	+ }
	339	+ }
	340	+
	341	+ div.actions2 {
	342	+ a {
295	343	opacity: 0.4
296	344	transition: opacity 0.2s
297	345	font-weight: bold
298	346	color: #333

styles/light/toggle-button.mcssView
		@@ -1,20 +1,23 @@
1	1	ToggleButton {
2		- font-size: 90%;
3		- background: rgb(112, 112, 112);
4		- border: 2px solid #313131;
5		- transition: opacity 0.2s;
6		- opacity: 0.6;
7		- padding: 6px 12px;
8		- color: white;
9		- border-radius: 4px;
10		- font-weight: bold;
11		- text-decoration: none;
12		- display: block;
	2	+ display: inline-block
	3	+ color: white
	4	+ padding: 8px 10px
	5	+ background-color: #848484
	6	+ border: none
	7	+ border-radius: 3px
	8	+ font-size: 13px
	9	+ cursor: pointer
	10	+ transition: background-color 0.25s ease, color 0.25s ease
13	11
14	12	-subscribe {
15		- background-color: rgb(88, 171, 204);
16		- border-color: #20699c;
	13	+ :before {
	14	+ content: '★ '
	15	+ }
	16	+ :hover {
	17	+ background-color: #45b754;
	18	+ color: white;
	19	+ }
17	20	}
18	21
19	22	-unsubscribe {
20	23	background-repeat: no-repeat
		@@ -22,22 +25,37 @@
22	25	background-image: svg(subscribed)
23	26	padding-right: 25px
24	27	}
25	28
26		- -unblocking {
27		- background-color: #deb250
28		- border-color: #ad7904
	29	+ -blocking {
	30	+ margin-left: 5px
	31	+ border: 0px
	32	+ :hover {
	33	+ background-color: #bd6363
	34	+ }
29	35	}
30	36
	37	+ -unblocking {
	38	+ margin-left: 5px
	39	+ background-color: rgb(212, 112, 112)
	40	+ color: #ffffff
	41	+ border: 0px
	42	+ :hover {
	43	+ background-color: rgb(212, 167, 112)
	44	+ }
	45	+ }
	46	+
31	47	-disabled {
32	48	cursor: default
33	49	opacity: 0.4 !important
34	50	text-decoration: none !important
35	51	}
36	52
37	53	:hover {
38	54	opacity: 1
	55	+ color: white
39	56	text-decoration: none
	57	+ background-color: #585656
40	58	}
41	59
42	60	@svg subscribed {
43	61	width: 20px

Matt McKegg / patchwork