git ssb - Merge pull request #627 from ssbc/dark-theme-fixes

Dark theme upgrades and fixes

Matt McKegg authored on 9/22/2017, 2:07:28 AM
GitHub committed on 9/22/2017, 2:07:28 AM
Parent: 6dbbe7c7fdc614a84180f17bf1dd3473687e0c21
Parent: 5495ac517c38b10be3282d62dea400168a427b21

styles/dark/gathering-card.mcss	changed
styles/dark/markdown.mcss	changed
styles/dark/message.mcss	changed

styles/dark/gathering-card.mcssView
		@@ -1,8 +1,8 @@
1	1	GatheringCard {
2		- border: 1px solid #DDD
3		- padding: 10px
4		- margin-bottom: 10px
	2	+ padding: 20px
	3	+ margin: 20px -20px
	4	+ border-top: 1px solid #2d2c2c
5	5
6	6	a.image {
7	7	display: block
8	8	margin-top: 10px
		@@ -16,43 +16,59 @@
16	16	margin: 10px 0
17	17	padding-top: 10px;
18	18
19	19	div.title {
20		- font-size: 90%;
21		- color: #555;
22		- font-weight: bold;
	20	+ font-size: 75%;
23	21	margin-bottom: 10px;
	22	+ text-align: center
24	23	}
25	24	div.attendees {
26		- margin: 0 5px
27		- a {
28		- margin-right: 4px
29		- img {
30		- height: 45px
31		- width: 45px
32		- }
	25	+ text-align: center
	26	+
	27	+ a + a {
	28	+ margin-left: 10px
33	29	}
	30	+
	31	+ (img) {
	32	+ height: 45px
	33	+ width: 45px
	34	+ border-radius: 3px
	35	+ }
34	36	}
35	37	div.actions {
	38	+ text-align: center
36	39	margin-top: 10px
	40	+
	41	+ button {
	42	+ :first-child {
	43	+ ::before {
	44	+ content: '✔ '
	45	+ }
	46	+ }
	47	+ }
37	48	button + button {
38	49	margin-left: 5px
39	50	}
40	51	}
41	52	}
42	53
43	54	div.title {
44		- font-size: 200%
	55	+ a {
	56	+ font-size: 200%
	57	+ }
45	58	button {
46	59	float: right;
47		- font-size: 60%;
	60	+
	61	+ ::before {
	62	+ content: '✎ '
	63	+ }
48	64	}
49	65	}
50	66	div.time {
51		- color: #555
52		- font-size: 120%
	67	+ color: #757474
53	68	}
54	69	div.description {
55		- border-top: 3px solid #CCC;
56		- margin-top: 10px;
	70	+ margin: 20px 0 0
	71	+ padding: 20px
	72	+ background: #2d2c2c
57	73	}
58	74	}

styles/dark/markdown.mcssView
		@@ -65,26 +65,24 @@
65	65	align-content: center;
66	66	margin-bottom: -0.3em;
67	67	}
68	68
69		- p {
70		- (a) {
71		- color: #6f74e5
	69	+ (a) {
	70	+ color: #6f74e5
	71	+ :hover {
	72	+ text-decoration: underline;
	73	+ }
	74	+ [href^="@"] {
	75	+ color: #efef00
	76	+ border-bottom: 1px dotted #efef00
72	77	:hover {
73		- text-decoration: underline;
	78	+ text-decoration: none;
74	79	}
75		- [href^="@"] {
76		- color: #efef00
77		- border-bottom: 1px dotted #efef00
78		- :hover {
79		- text-decoration: none;
80		- }
	80	+ }
	81	+ [href^="#"] {
	82	+ color: #c1cdf0
	83	+ :hover {
	84	+ text-decoration: none;
81	85	}
82		- [href^="#"] {
83		- color: #c1cdf0
84		- :hover {
85		- text-decoration: none;
86		- }
87		- }
88	86	}
89	87	}
90	88	}

styles/dark/message.mcssView
		@@ -34,9 +34,9 @@
34	34
35	35	-mini {
36	36	header {
37	37	font-size: 100%
38		- margin-bottom: 15px
	38	+
39	39	div.main {
40	40	a.avatar {
41	41	img {
42	42	width: 40px
		@@ -129,18 +129,26 @@
129	129	background-repeat: no-repeat
130	130	background-position: center
131	131	display: inline-block
132	132	vertical-align: middle;
133		- margin-top: -3px;
134	133
135	134	-new {
136		- background-image: svg(new)
137		- }
	135	+ width: auto
	136	+ height: auto
	137	+ color: #757474
138	138
139		- @svg new {
140		- width: 12px
141		- height: 12px
142		- content: "<circle cx='6' stroke='none' fill='#efef00' cy='6' r='5' />"
	139	+ :before {
	140	+ content: '✸ new'
	141	+ font-size: 75%
	142	+ }
	143	+
	144	+ :hover {
	145	+ color: #efef00
	146	+ }
	147	+
	148	+ :first-letter {
	149	+ color: #efef00
	150	+ }
143	151	}
144	152	}
145	153
146	154	em {
		@@ -158,8 +166,12 @@
158	166
159	167	a.likes {
160	168	font-size: 75%;
161	169
	170	+ ::before {
	171	+ content: '❤ '
	172	+ color: #ff2f92
	173	+ }
162	174	:hover {
163	175	color: #ff2f92
164	176	}
165	177	}

alanz / patchwork