kevin/hypothetical
1
0
Fork 0
mirror of https://github.com/prurigro/hypothetical.git synced 2024-11-26 00:51:26 -05:00
Code Issues Projects Releases Packages Wiki Activity

Improve the dashboard edit-list page on mobile

Browse source
This commit is contained in:
Kevin MacMartin 2017-01-04 23:50:17 -05:00
parent 1292201b05
commit 8ba8a0e810
2 changed files with 43 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
resources/assets/sass/dashboard.scss vendored
View file

@ -23,14 +23,21 @@ $fa-font-path: "/fonts";
body { body {
@include font-sans; @include font-sans;
min-width: 440px; min-width: 320px;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.navbar { .navbar {
background-color: $c-dashboard-dark; background-color: $c-dashboard-dark;
.navbar-brand { font-weight: bold; }
.navbar-brand {
font-weight: bold;
@media (max-width: $screen-xs-max) {
font-size: 14px;
}
}
#spark-navbar-collapse { #spark-navbar-collapse {
border: 0; border: 0;
@ -96,7 +103,8 @@ body {
width: 100%; width: 100%;
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
margin-bottom: 0px; margin: 3px 3px 0px 3px;
width: calc(100% - 6px);
} }
} }
@ -251,6 +259,10 @@ body {
padding-top: 4px; padding-top: 4px;
padding-bottom: 4px; padding-bottom: 4px;
@media (max-width: $screen-xs-max) {
margin: 3px;
}
.sort-icon { .sort-icon {
margin-right: 10px; margin-right: 10px;
display: inline-block; display: inline-block;
@ -259,35 +271,49 @@ body {
} }
.title-column { .title-column {
float: left;
padding-top: 6px; padding-top: 6px;
padding-bottom: 6px; padding-bottom: 6px;
padding-left: 0px; padding-left: 0px;
font-family: "Lucida Console", Monaco, monospace; font-family: "Lucida Console", Monaco, monospace;
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
font-size: 12px; text-align: center;
.column {
margin-right: 3px;
display: inline-block;
&.spacer {
display: block;
font-size: 0;
}
}
}
@media (min-width: $screen-sm-min) {
&, .column {
float: left;
} }
.column { .column {
float: left;
margin-right: 10px; margin-right: 10px;
@media (max-width: $screen-sm-max) {
&:nth-child(n+4) { display: none; }
}
@media (max-width: $screen-xs-max) {
&:nth-child(n+2) { display: none; }
} }
} }
} }
.button-column { .button-column {
float: right;
padding-right: 0px; padding-right: 0px;
padding-left: 0px; padding-left: 0px;
@media (max-width: $screen-xs-max) {
padding-bottom: 5px;
text-align: center;
}
@media (min-width: $screen-sm-min) {
float: right;
text-align: right; text-align: right;
}
.btn { .btn {
margin: 3px; margin: 3px;
@ -297,8 +323,7 @@ body {
padding-bottom: 2px; padding-bottom: 2px;
@media (max-width: $screen-xs-max) { @media (max-width: $screen-xs-max) {
height: 20px; min-width: 33%;
font-size: 11px;
} }
} }
} }

2
resources/views/dashboard/edit-list.blade.php
View file

@ -35,7 +35,7 @@
<div class="column">{{ $row[$col] }}</div> <div class="column">{{ $row[$col] }}</div>
@if(!$loop->last) @if(!$loop->last)
<div class="column">|</div> <div class="column spacer">|</div>
@endif @endif
@endif @endif
@endforeach @endforeach