Make CSS more efficient

Add side margins in global.css rather than two separate files
This commit is contained in:
Matthew Grove
2018-11-24 15:40:12 +00:00
parent de632e9145
commit 0c49ba651b
4 changed files with 19 additions and 35 deletions

View File

@@ -4,20 +4,3 @@
.mdc-typography--headline2, .mdc-typography--subtitle1, figure {
margin: 5px;
}
.main-content {
margin-left: 15%;
margin-right: 15%;
}
@media screen and (max-width: 800px) {
.main-content {
margin-left: 5%;
margin-right: 5%;
}
}
@media screen and (max-width: 600px) {
.main-content {
margin-left: 2%;
margin-right: 2%;
}
}

View File

@@ -36,7 +36,25 @@ footer {
margin: 15px;
}
/* add side margins */
.main-content {
margin-left: 15%;
margin-right: 15%;
}
@media screen and (max-width: 600px) {
.main-content {
margin-left: 5%;
margin-right: 5%;
}
}
@media screen and (max-width: 500px) {
.main-content {
margin-left: 2%;
margin-right: 2%;
}
}
/* for cookie notice */
#cookies {
display: none;
width: 100%;

View File

@@ -9,23 +9,6 @@
margin: 0;
}
.main-content {
margin-left: 15%;
margin-right: 15%;
}
@media screen and (max-width: 600px) {
.main-content {
margin-left: 5%;
margin-right: 5%;
}
}
@media screen and (max-width: 500px) {
.main-content {
margin-left: 2%;
margin-right: 2%;
}
}
.main-content .mdc-card {
float:left;
clear:left;

View File

@@ -66,7 +66,7 @@
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
<div class="mdc-card">
<div class="mdc-card__media mdc-card__media--16-9" style="background-image:url('/images/article_name--cover.jpg/images/article_name--cover.jpg');"></div>
<div class="mdc-card__media mdc-card__media--16-9" style="background-image:url('/images/article_name--cover.jpg');"></div>
<div class="mdc-card-content">
<h2 class="mdc-typography--headline6">Title</h2>
<h3 class="mdc-typography--subtitle2">