Nemcio/Grav-Admin-Plugin
1
0
Fork 0
mirror of https://github.com/getgrav/grav-plugin-admin.git synced 2025-11-15 09:46:06 +01:00
Code Issues Packages Projects Releases Activity

Improve the header UI in mobile

Browse Source
This commit is contained in:
Flavio Copes
2015-11-10 17:42:15 +01:00
parent 2d0b279f8a
commit adfbc76002
4 changed files with 38 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
themes/grav/css-compiled/template.css
View File

File diff suppressed because one or more lines are too long

2
themes/grav/css-compiled/template.css.map
View File

File diff suppressed because one or more lines are too long

45
themes/grav/scss/template/_admin.scss
View File

@@ -215,16 +215,38 @@ $update-height: 3rem;
height: $topbar-height; height: $topbar-height;
padding: 0 $padding-default; padding: 0 $padding-default;
@include breakpoint(mobile-only) {
height: 7.2rem;
margin-top: -5.5rem;
position: relative;
}
h1 { h1 {
@extend %vertical-align; @extend %vertical-align;
@include breakpoint(mobile-only){ @include breakpoint(mobile-only) {
> i:first-child:before { > i:first-child:before {
content: "\f0c9"; content: "\f0c9";
} }
@include transform(inherit); transform: inherit;
top: 5px; top: 5px;
font-size: 1.2rem; font-size: 1.2rem;
display: block;
text-align: center;
padding: 20px 0px;
margin-top: -90px;
z-index: 2;
}
@media only all and (max-width: 381px) {
margin-top: -138px;
}
.fa-th {
@include breakpoint(mobile-only) {
cursor: pointer;
float: left;
}
} }
} }
@@ -233,13 +255,13 @@ $update-height: 3rem;
padding: 0; padding: 0;
@include breakpoint(mobile-only) { @include breakpoint(mobile-only) {
@include transform(inherit); text-align: center;
top: inherit; display: block;
bottom: 5px; float: none;
position: absolute; margin: 5rem auto 0px;
right: 1rem; padding-top: 70px;
} }
} }
.preview { .preview {
@@ -331,8 +353,8 @@ $update-height: 3rem;
top: $topbar-height + $update-height; top: $topbar-height + $update-height;
@include transition (top 0.15s ease-out); @include transition (top 0.15s ease-out);
@include breakpoint(mobile-only){ @include breakpoint(mobile-only) {
top: 5.2rem; top: 7.2rem;
padding-bottom: 8rem; padding-bottom: 8rem;
padding-top: 0rem; padding-top: 0rem;
} }
@@ -348,6 +370,7 @@ $update-height: 3rem;
padding: 2.5rem; padding: 2.5rem;
@include breakpoint(mobile-only) { @include breakpoint(mobile-only) {
top: 7.2rem;
left: 0; left: 0;
} }
} }
@@ -362,7 +385,7 @@ $update-height: 3rem;
padding: 0 $padding-default 0.5rem; padding: 0 $padding-default 0.5rem;
margin: 0 0 1rem; margin: 0 0 1rem;
border-bottom: 3px solid darken($content-bg, 5%); border-bottom: 3px solid darken($content-bg, 5%);
@include breakpoint(mobile-only){ @include breakpoint(mobile-only){
padding: 0 0 0.5rem; padding: 0 0 0.5rem;
margin: 0 0 1rem !important; margin: 0 0 1rem !important;

5
themes/grav/scss/template/_pages.scss
View File

@@ -222,7 +222,7 @@
right: 0.5rem; right: 0.5rem;
height: 3.5rem; height: 3.5rem;
@include breakpoint(mobile-only){ @include breakpoint(mobile-only) {
width: 100%; width: 100%;
right: 0; right: 0;
top: .25rem; top: .25rem;
@@ -235,8 +235,7 @@
display: inline-block; display: inline-block;
vertical-align: inherit; vertical-align: inherit;
@include breakpoint(mobile-only){ @include breakpoint(mobile-only) {
width: 100%;
} }
} }