git ssb - don't allow public key to break layout when too long for available space

Use text-overflow ellipsis

#680

Matt McKegg committed on 11/25/2017, 11:44:30 PM
Parent: 452d3838ab4f6ffb18b71fff39793437a4d88c4e

styles/dark/profile-header.mcss	changed
styles/dark/profile-preview.mcss	changed
styles/light/profile-header.mcss	changed
styles/light/profile-preview.mcss	changed

styles/dark/profile-header.mcssView
		@@ -16,8 +16,9 @@
16	16	}
17	17
18	18	div.main {
19	19	flex: 1
	20	+ min-width: 0
20	21	div.title {
21	22	display: flex
22	23	h1 {
23	24	flex: 1
		@@ -31,8 +32,10 @@
31	32	-webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
32	33	}
33	34	-publicKey {
34	35	pre {
	36	+ text-overflow: ellipsis;
	37	+ overflow: hidden;
35	38	color: #808080;
36	39	margin: 2px 0;
37	40	font-size: 120%;
38	41	background: #333333;

styles/dark/profile-preview.mcssView
		@@ -47,8 +47,9 @@
47	47	}
48	48	}
49	49
50	50	div.main {
	51	+ min-width: 0
51	52	flex: 1
52	53	margin: 5px
53	54
54	55	div.title {
		@@ -69,8 +70,10 @@
69	70	}
70	71	}
71	72	section {
72	73	pre {
	74	+ text-overflow: ellipsis;
	75	+ overflow: hidden;
73	76	color: #b3b3b3;
74	77	margin: 2px 0;
75	78	font-size: 110%;
76	79	-webkit-user-select: text

styles/light/profile-header.mcssView
		@@ -16,8 +16,9 @@
16	16	}
17	17	}
18	18
19	19	div.main {
	20	+ min-width: 0
20	21	flex: 1
21	22	div.title {
22	23	display: flex
23	24	h1 {
		@@ -38,8 +39,10 @@
38	39	-webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
39	40	}
40	41	-publicKey {
41	42	pre {
	43	+ text-overflow: ellipsis;
	44	+ overflow: hidden;
42	45	color: #b3b3b3;
43	46	margin: 2px 0;
44	47	font-size: 120%;
45	48	background: #ffffff;

styles/light/profile-preview.mcssView
		@@ -40,8 +40,9 @@
40	40	}
41	41	}
42	42
43	43	div.main {
	44	+ min-width: 0
44	45	flex: 1
45	46	margin: 5px
46	47
47	48	div.title {
		@@ -62,8 +63,10 @@
62	63	}
63	64	}
64	65	section {
65	66	pre {
	67	+ text-overflow: ellipsis;
	68	+ overflow: hidden;
66	69	color: #b3b3b3;
67	70	margin: 2px 0;
68	71	font-size: 110%;
69	72	background: #ffffff;

Matt McKegg / patchwork