From 3cd07722242f7c99dd9664d635c103750b363967 Mon Sep 17 00:00:00 2001 From: Marijn Jansen Date: Fri, 13 Jan 2017 11:48:26 +0100 Subject: [PATCH] Cleanup in main.css --- website/styles/main.css | 156 +++++++++++++++++++++------------------- 1 file changed, 81 insertions(+), 75 deletions(-) diff --git a/website/styles/main.css b/website/styles/main.css index cbf9477..fa85d7f 100644 --- a/website/styles/main.css +++ b/website/styles/main.css @@ -1,64 +1,10 @@ /*----------------------------------------------------------------------------- Default Stylesheet -last update: 10-01-2017 +last update: 13-01-2017 Website: myhyvesbookplus.tk -----------------------------------------------------------------------------*/ -.profile-picture { - border-radius: 50%; - height: 42px; - width: 42px; - object-fit: cover; - vertical-align: middle; -} - -.group-picture { - border-radius: 5px; - height: 42px; - width: 42px; - object-fit: cover; - vertical-align: middle; -} - -html { - height: 100%; -} - -body { - height: 100%; - - background-color: #B78996; - color: #333; - - font-family: Arial, sans-serif; -} - -.content { - padding: 20px; - margin-top: 80px; - margin-left: 256px; - min-height: 100%; -} - -.platform { - padding: 20px; - margin-bottom: 10px; - border-radius: 10px; - background-color: #FFFFFF; - box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); -} - -::selection { - background: #845663; - color: white; -} - -::-moz-selection { - background: #845663; - color: white; -} - /* Remove padding and margin */ * { margin: 0; @@ -66,19 +12,15 @@ body { border: 0; } -/* Move element down (clear), below floating elements */ -.clear { - clear: both; +html { + height: 100%; } -/* Float element to the left side of its containing block */ -.right { - float: right; -} - -/* Float element to the left side of its containing block */ -.left { - float: left; +body { + height: 100%; + background-color: #B78996; + color: #333; + font-family: Arial, sans-serif; } /* Font sizes */ @@ -110,23 +52,81 @@ p { font-size: 1.2em; } +/* Selection colors */ +::selection { + background: #845663; + color: white; +} + +::-moz-selection { + background: #845663; + color: white; +} + +/* All content underneath the menu */ +.content { + padding: 20px; + margin-top: 80px; + margin-left: 256px; + min-height: 100%; +} + +/* White boxes (squares) */ +.platform { + padding: 20px; + margin-bottom: 10px; + border-radius: 10px; + background-color: #FFFFFF; + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); +} + +.profile-picture, .group-picture { + height: 42px; + width: 42px; + object-fit: cover; + vertical-align: middle; +} + +.profile-picture { + border-radius: 50%; +} + +.group-picture { + border-radius: 5px; +} + +/* Move element down (clear), below floating elements */ +.clear { + clear: both; +} + +/* Float element to the left side of its containing block */ +.right { + float: right; +} + +/* Float element to the left side of its containing block */ +.left { + float: left; +} + +/* All links */ a, a:link, a:visited, a:hover, a:active { color: inherit; text-decoration: none; } +/* All buttons, inputfields/selectfields. */ button, input, select { width: auto; height: 32px; - cursor: pointer; border: none; - - font-family: Arial, sans-serif; font-size: 16px; border-radius: 7px; } +/* All textinput and sections */ textarea, input, select { padding: 0 5px; background: white; @@ -134,11 +134,12 @@ textarea, input, select { border: 1px solid #845663; border-radius: 7px; font-size: 16px; - - } -button, input[type="submit"], input[type="reset"] { +/* All buttons */ +button, +input[type="submit"], +input[type="reset"] { background-color: #845663; color: white; padding: 0 10px; @@ -157,12 +158,17 @@ td { } /* Custom title box, appears instantaneously */ -a[data-title]:hover, img[data-title]:hover, span[data-title]:hover, div[data-title]:hover { +a[data-title]:hover, +img[data-title]:hover, +span[data-title]:hover, +div[data-title]:hover { position: relative; } -a[data-title]:hover:after, img[data-title]:hover:after, span[data-title]:hover:after, -div[data-title]:hover:after{ +a[data-title]:hover:after, +img[data-title]:hover:after, +span[data-title]:hover:after, +div[data-title]:hover:after { content: attr(data-title); padding: 4px 4px; color: #FFFFFF;