添加移动端界面展示

This commit is contained in:
jaywcjlove 2016-12-03 02:15:38 +08:00
parent 89a5f47be2
commit b584bbda09
1 changed files with 39 additions and 1 deletions

View File

@ -2,6 +2,7 @@
@import('mixins/highlight.styl') @import('mixins/highlight.styl')
@import('mixins/markdown.styl') @import('mixins/markdown.styl')
mq-mobile = "screen and (max-width: 479px)"
a.github-corner { a.github-corner {
position: fixed position: fixed
@ -30,7 +31,6 @@ a.github-corner {
20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)} 20%,60%{-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}
40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)} 40%,80%{-webkit-transform:rotate(10deg);transform:rotate(10deg)}
} }
.header{ .header{
width 517px width 517px
@ -228,3 +228,41 @@ a.github-corner {
} }
} }
@media mq-mobile{
.header{
width inherit
.logo svg{
height: 26px;
width: 96px;
}
.search {
.query{
height: 34px;
}
.enter-input button{
padding: 6px 12px;
}
}
}
.header_list .logo{
float: inherit;
padding-right: 10px;
padding-top: 8px;
padding-bottom: 14px;
text-align: center;
}
div.markdown-body{
padding: 10px 10px 10px 13px;
}
div.markdown-body .edit_btn + *{
margin-top: 0 !important;
}
div.markdown-body .edit_btn{
top: 9px;
}
div.markdown-body pre{
padding: 0.6em;
}
}