new theme, a bit of aligning, a bit of sutomasibility for further themes

This commit is contained in:
Blue 2019-07-28 15:28:23 +03:00
parent dba71eaa20
commit 2a36eab2e3
12 changed files with 1031 additions and 1224 deletions

56
style/blue.css Normal file
View file

@ -0,0 +1,56 @@
nav {
background-color: #91d8f8;
}
nav > a {
margin: 10px 0 10px 10px; /*to collapse margins*/
border-radius: 5px;
padding: 10px;
}
nav > a:last-child {
margin: 10px; /*to collapse margins*/
}
nav > a:hover {
background-color: #bfeaff;
}
nav > a.current,
nav > a.current:hover {
background-color: #cde6ea;
}
.mainContainer {
background-color: #f8f8f8;
}
.mainContainer img {
box-shadow: 2px 3px 6px 2px rgba(0,0,0,0.7);
}
.mainContainer {
font-size: 16px;
color: #444;
}
.mainContainer h1 {
text-align: center;
font-size: 32px;
color: inherit;
}
.mainContainer h2 {
font-size: 28px;
color: inherit;
}
.mainContainer h3 {
font-size: 24px;
color: inherit;
}
.mainContainer h4 {
font-size: 20px;
color: inherit;
}

View file

@ -1,4 +1,4 @@
.header {
#header {
width: 100%;
min-height: 50px;
@ -6,7 +6,7 @@
background-color: rgba(10, 10, 10, .2);
line-height: 40px;
line-height: 40px; /*isn't it too much?*/
font-size: 28px;
font-weight: 800;
@ -40,92 +40,13 @@ nav {
background-color: rgba(200,200,200,.2);
}
.top-nav__item {
display: block;
float: left;
nav > a {
padding: 10px 15px 12px;
border-radius: 2px;
transition: .2s ease;
color: #333;
}
.top-nav__item:hover {
nav > a:hover {
background-color: #3ce;
color: #fff;
}
.mainContainer {
padding: 20px;
font-size: 14px;
color: #333;
text-align: left;
}
.mainContainer h1 {
margin: 10px 0 5px 0;
font-size: 24px;
font-weight: 600;
color: #000;
}
.mainContainer h2 {
margin: 10px 0 5px 0;
font-size: 22px;
font-weight: 600;
color: #000;
}
.mainContainer h3 {
margin: 10px 0 5px 0;
font-size: 18px;
font-weight: 600;
color: #000;
}
.mainContainer h4 {
margin: 10px 0 5px 0;
font-size: 14px;
font-weight: 600;
color: #000;
}
.mainContainer p {
margin: 5px 5px 0 10px;
}
.mainContainer strong {
font-weight: 600;
}
.mainContainer ul,
.mainContainer ol {
margin: 5px 5px 10px 10px;
list-style-position: outside;
}
.mainContainer ul li {
margin: 5px 5px 0 15px;
}
.mainContainer img {
margin: 10px;
}
/*!** end-reset ***/

View file

@ -1,15 +1,11 @@
body {
font-family: sans-serif;
margin: 0;
html, body {
height: 100%;
}
.mainContainer {
width: 1024px;
margin: auto;
}
.mainContainer > h1 {
text-align: center;
min-height: 100%;
}
nav {
@ -21,7 +17,6 @@ nav {
nav > a {
flex: auto;
display: block;
float: left;
padding: 20px;
box-sizing: border-box;
text-decoration: none;
@ -50,10 +45,6 @@ nav > a:visited {
color: inherit;
}
.margin {
margin: 15px;
}
nav > a > div {
position: relative;
top: 50%;
@ -61,26 +52,65 @@ nav > a > div {
overflow: hidden;
}
.thumbnails {
.mainContainer {
font-size: 14px;
color: #333;
text-align: left;
}
.mainContainer h1 {
text-align: center;
overflow: hidden;
}
.thumbnails > a {
display: block;
box-sizing: border-box;
float: left;
width: 25%;
height: 200px;
padding: 5px;
}
.thumbnails > a > div {
box-sizing: border-box;
height: 100%;
border-radius: 5px;
margin: 10px 0 5px 0;
font-size: 24px;
padding-top: 20px;
font-weight: 600;
color: #000;
}
.mainContainer h2 {
margin: 10px 0 5px 0;
font-size: 22px;
font-weight: 600;
color: #000;
}
.mainContainer h3 {
margin: 10px 0 5px 0;
font-size: 18px;
font-weight: 600;
color: #000;
}
.mainContainer h4 {
margin: 10px 0 5px 0;
font-size: 14px;
font-weight: 600;
color: #000;
}
.mainContainer p {
margin: 5px 5px 0 10px;
}
.mainContainer strong {
font-weight: 600;
}
.mainContainer ul,
.mainContainer ol {
margin: 5px 5px 10px 10px;
list-style-position: outside;
}
.mainContainer ul li {
margin: 5px 5px 0 15px;
}
.mainContainer img,
.mainContainer iframe {
margin: 15px 0 15px 15px;
}
.c1 {
@ -116,4 +146,8 @@ nav > a > div {
.clearfix:after {
clear: both;
}
.content {
padding: 10px;
}

View file

@ -1,15 +1,3 @@
* {
padding: 0;
margin: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
box-sizing: border-box;
position: relative;
}
*:before,
*:after {
box-sizing: inherit;