Improve appearance of option bars on mobile
This commit is contained in:
parent
b2a35c469a
commit
7e4116359a
|
@ -7724,16 +7724,24 @@ header #login-popup {
|
|||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
border-style: dashed;
|
||||
border-width: 0px;
|
||||
border-bottom-width: 1px; }
|
||||
border-bottom-width: 1px;
|
||||
padding-bottom: 0.5rem; }
|
||||
@media screen and (min-width: 30em) {
|
||||
.optionbar {
|
||||
flex-direction: row;
|
||||
text-align: left; } }
|
||||
text-align: left;
|
||||
padding-bottom: 0; } }
|
||||
.optionbar.bottom {
|
||||
border-bottom-width: 0px;
|
||||
border-top-width: 1px; }
|
||||
border-top-width: 1px;
|
||||
padding-bottom: 0;
|
||||
padding-top: 0.5rem; }
|
||||
@media screen and (min-width: 30em) {
|
||||
.optionbar.bottom {
|
||||
padding-top: 0; } }
|
||||
.optionbar.center {
|
||||
text-align: center; }
|
||||
.optionbar .options {
|
||||
|
@ -7748,6 +7756,8 @@ header #login-popup {
|
|||
.optionbar .options input[type=button],
|
||||
.optionbar .options input[type=submit] {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
background: none;
|
||||
font-weight: normal;
|
||||
|
@ -8432,6 +8442,8 @@ input[type=submit] {
|
|||
input[type=button].lite,
|
||||
input[type=submit].lite {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
background: none;
|
||||
font-weight: normal;
|
||||
|
|
|
@ -639,18 +639,27 @@ footer {
|
|||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
border-style: dashed;
|
||||
border-width: 0px;
|
||||
border-bottom-width: 1px;
|
||||
padding-bottom: $spacing-small;
|
||||
|
||||
@media #{$breakpoint-not-small} {
|
||||
flex-direction: row;
|
||||
text-align: left;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
border-bottom-width: 0px;
|
||||
border-top-width: 1px;
|
||||
padding-bottom: 0;
|
||||
padding-top: $spacing-small;
|
||||
|
||||
@media #{$breakpoint-not-small} {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.center {
|
||||
|
|
|
@ -46,6 +46,8 @@ will throw an error.
|
|||
|
||||
@mixin lite-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
background: none;
|
||||
font-weight: normal;
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
{{- /*gotype: git.handmade.network/hmn/hmn/src/templates.Pagination*/ -}}
|
||||
<div class="pagination flex">
|
||||
{{ if gt .Current 1 }}
|
||||
<a class="button" href="{{ .PreviousUrl }}">Prev</a>
|
||||
{{ end }}
|
||||
{{ if gt .Total 1 }}
|
||||
{{ if gt .Total 1 }}
|
||||
<div class="pagination flex">
|
||||
{{ if gt .Current 1 }}
|
||||
<a class="button" href="{{ .PreviousUrl }}">Prev</a>
|
||||
{{ end }}
|
||||
{{ if gt .Current 1 }}
|
||||
{{ if gt .Current 2 }}
|
||||
<a class="page button" href="{{ .FirstUrl }}">1</a>
|
||||
|
@ -23,10 +23,8 @@
|
|||
<a class="page button" href="{{ .LastUrl }}">{{ .Total }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
|
||||
{{ end }}
|
||||
{{ if lt .Current .Total }}
|
||||
<a class="button" href="{{ .NextUrl }}">Next</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ if lt .Current .Total }}
|
||||
<a class="button" href="{{ .NextUrl }}">Next</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
|
Loading…
Reference in New Issue