~j-james/static-slack

efca1bdaf9bfd94cfb888ddd83ccbcc8cbdee9dd — j-james 2 years ago 6e735ec
Greatly improve CSS styling
1 files changed, 58 insertions(+), 14 deletions(-)

M style.css
M style.css => style.css +58 -14
@@ 1,7 1,10 @@
/* I _cannot_ believe that vw and vh include the scrollbars */
body {
	font-family: Slack-Lato, Lato, sans-serif;
	display: flex;
	flex-direction: row;
	overflow-x: hidden;
	padding: 0;
	margin: 0;
}



@@ 15,42 18,79 @@ h1 {

nav {
	background-color: #3F0E40;
	color: grey;
	padding: 0.5em;
	width: 40vw;
	color: #CFC3CF;
	max-width: 25vw;
}

strong {
	font-weight: 900;
nav ul {
	padding-inline-start: 1em;
}

nav strong {
	font-weight: bold;
nav li {
	list-style: none;
	padding-inline-start: 1em;
}

nav h1 {
nav li:hover {
	background: #350D36;
}

nav h3 {
	font-size: 0.8em;
	text-transform: uppercase;
nav #current {
	background: #1164A3;
	color: #E5EEF5;
}

nav li {
nav a {
	color: inherit;
	text-decoration: none;
	text-transform: lowercase;
}

nav li:before {
	content: "# ";
nav a:before {
	content: "# "
}

main {
	max-width: 75vw;
	padding: 8px;
}

main h1:before {
	content: "# "
}

#messages {
	display: flex;
	flex-direction: column;
}

.divider {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.divider div {
	flex-grow: 1;
	border-bottom: 1px solid black;
	margin-bottom: -1px;
}

.divider span {
	border: 1px solid black;
	border-radius: 24px;
	/*box-shadow: 0 0 0 1px rgba( 29,28,29 ,0.13),0 1px 3px 0 rgba(0,0,0,0.08);*/
	font-size: 0.9em;
	font-weight: 700;
	padding: 4px 16px;
	text-align: center;
}

.message {
	display: flex;
	flex-direction: row;
	padding: 0px 20px;
}

.image img {


@@ 62,6 102,7 @@ main h1:before {
}

.user {
	font-weight: 900;
}

.time {


@@ 77,3 118,6 @@ main h1:before {

.text {
}

.reactions {
}