miniflux-legacy/themes/hello/scss/_queries.scss
2015-01-19 19:20:29 -05:00

237 lines
3.1 KiB
SCSS
Executable File

@import "compass/layout/sticky-footer";
@media only screen and (max-width: 480px) {
#login-page {
section {
&.page {
margin: 5px;
width: auto;
}
}
form {
margin: 0 auto;
padding: 10px;
[type="text"],
[type="password"] {
width: 220px;
}
}
}
body {
> header {
}
}
section {
&.page {
}
}
}
@media only screen and (min-width: 481px) and (max-width: 980px) {
}
@media only screen and (max-width: 980px) {
body {
> header {
top: 5px;
left: 20px;
bottom: inherit;
width: auto;
z-index: 999;
background-color: transparent !important;
}
> .page {
width: auto !important;
position: relative;
}
}
// Menu
header {
nav {
width: auto;
margin: auto;
.logo {
display: none;
}
> ul {
margin: auto
}
li {
@include inline-block;
padding: 5px 0;
&:first-child {
display: none;
}
a {
display: block;
color: $theme-background-highlight;
&[href*="action=more"] {
width: 35px;
height: 35px;
line-height: 35px;
@include flat-box($theme-background-highlight, $button-background-grey, 5px);
&:before {
height: 100%;
width: 100%;
line-height: inherit;
}
}
&:before {
color: $theme-background-highlight;
}
}
}
}
}
.page {
.page-header {
h2 {
visibility: hidden;
}
ul {
li {
a,
a:after {
width: 35px;
height: 35px;
line-height: 35px;
}
}
}
}
}
// Menu mobile
.menu-more {
margin-top: 50px;
li {
display: block;
@include flat-box($theme-background-highlight, $button-background-grey, 5px);
margin: 10px auto;
a {
display: block;
// height: 100%;
padding: 10px 20px;
text-decoration: none;
width: 100%;
}
}
}
.items {
article {
padding: {
left: 10px;
right: 10px;
}
.preview {
display: none;
}
}
.item {
&-menu {
display: block;
@include pie-clearfix;
li {
&:first-child {
display: block;
float: left;
}
&:last-child {
float: right;
&:before {
display: none;
visibility: hidden;
}
}
.mark,
.mark:before {
height: 25px;
text-align: center;
width: 25px;
}
.mark {
@include flat-box($theme-background-highlight, $button-background-grey, 5px);
display: block;
position: relative;
overflow: hidden;
text-indent: -999px;
&:before {
position: absolute;
top: 0;
left: 0;
line-height: 25px;
z-index: 999;
text-indent: 0;
}
}
}
}
}
}
#current-item {
padding-top: 35px;
nav {
&.top {
display: none;
}
&.bottom {
display: block;
}
}
> h1 {
float: none;
}
iframe {
width: 100%;
}
}
form {
label {
display: block;
&[for*="form-"] {
width: auto;
}
}
}
.alert {
&.alert-normal {
ul {
margin: 10px 5px;
}
}
}
.hide-mobile {
display: none !important;
}
.hide-desktop {
display: block;
}
}
@media only screen and (max-width: 980px) {
}