ayo/blog
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

some styles for responsiveness

Browse source
This commit is contained in:
Ayo 2018-03-09 15:11:29 +08:00
parent a3d14bf200
commit 9621ad84ca
1 changed files with 22 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
assets/main.scss
View file

@ -141,7 +141,7 @@ article .post-content p,
background: url('../assets/images/logo.png') no-repeat rgba(141,191,66,.97)!important; background: url('../assets/images/logo.png') no-repeat rgba(141,191,66,.97)!important;
width: 100%; width: 100%;
height: 100%; height: 100%;
box-shadow: 5px 25px 30px -25px rgba(34,34,34,0.25); box-shadow: 5px 25px 30px -25px rgba(34,34,34,0.25);
} }
.jumbotron #mc_embed_signup label{ .jumbotron #mc_embed_signup label{
@ -314,7 +314,7 @@ nav#side-nav {
background-color: #e4e2dd; background-color: #e4e2dd;
} }
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) { @media only screen and (min-width: 0px) and (max-width: 767px) {
.jumbotron { .jumbotron {
background: rgba(141,191,66,.97)!important; background: rgba(141,191,66,.97)!important;
width: 100%; width: 100%;
@ -325,18 +325,14 @@ nav#side-nav {
width: 250px !important; width: 250px !important;
height: 50px !important; height: 50px !important;
padding: 10px !important; padding: 10px !important;
margin-bottom: 5px !important;
} }
.jumbotron-content { .jumbotron-content {
width: calc(100% - 120px); width: calc(100% - 120px);
padding: 80px 60px; padding: 80px 60px;
} }
}
@media screen and (max-width: 600px) {
.page-content .wrapper { .page-content .wrapper {
max-width: 100%; max-width: 100%;
} }
@ -404,3 +400,21 @@ nav#side-nav {
fill: #ffffff; fill: #ffffff;
} }
} }
@media only screen and (min-width: 768px) and (max-width: 1024px) {
#mc_embed_signup input {
width: 250px !important;
height: 50px !important;
padding: 10px !important;
margin-bottom: 5px !important;
}
.jumbotron-content {
width: calc(100% - 100px);
padding: 60px 50px;
}
.jumbotron {
background: rgba(141,191,66,.97)!important;
}
}