mirror of
https://github.com/Hopiu/wagtail.git
synced 2026-05-12 01:03:11 +00:00
Mobile viewport alignment
This commit is contained in:
parent
d0a2573ec8
commit
ad94e689fc
6 changed files with 37 additions and 12 deletions
|
|
@ -29,6 +29,13 @@ header {
|
|||
.col {
|
||||
float: left;
|
||||
margin-right: 2em;
|
||||
|
||||
// @media screen and (max-width: $breakpoint-mobile) {
|
||||
// // To all hamburger menu to be visible
|
||||
// padding-left: 2em;
|
||||
// margin-top: -2px;
|
||||
// No... This fixes the snippet page but breaks all else
|
||||
}
|
||||
}
|
||||
|
||||
.left {
|
||||
|
|
@ -53,6 +60,13 @@ header {
|
|||
&.tab-merged,
|
||||
&.no-border {
|
||||
border: 0;
|
||||
|
||||
@media screen and (max-width: $breakpoint-mobile) {
|
||||
// To all hamburger menu to be visible
|
||||
padding-left: $desktop-nice-padding;
|
||||
padding-top: 11px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.merged.no-border {
|
||||
|
|
@ -151,10 +165,5 @@ header {
|
|||
.col9 {
|
||||
@include column(9);
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
margin-left: -($desktop-nice-padding);
|
||||
margin-right: -($desktop-nice-padding);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -103,9 +103,8 @@ $zindex-modal-background: 500;
|
|||
}
|
||||
|
||||
.header-title {
|
||||
padding-left: 1em!important;
|
||||
/* We need !important as the modal is nested within the page-editor and
|
||||
page-editor.scss is compiled after this file */
|
||||
padding-left: 0em!important;
|
||||
margin-left: -28px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -447,6 +447,8 @@ footer,
|
|||
.breadcrumb {
|
||||
padding-top: 0;
|
||||
background: $color-teal-darker;
|
||||
margin-left: -($desktop-nice-padding);
|
||||
margin-right: -($desktop-nice-padding);
|
||||
|
||||
li {
|
||||
a,
|
||||
|
|
@ -501,6 +503,12 @@ footer,
|
|||
}
|
||||
}
|
||||
|
||||
// @media screen and (max-width: $breakpoint-mobile) {
|
||||
// .breadcrumb {
|
||||
// padding-left: $mobile-nice-padding;
|
||||
// }
|
||||
// }
|
||||
|
||||
// Transitions (resolution agnostic)
|
||||
.content-wrapper,
|
||||
.nav-main,
|
||||
|
|
|
|||
|
|
@ -31,6 +31,13 @@
|
|||
|
||||
.header-title {
|
||||
padding-left: 3.1em;
|
||||
|
||||
@media screen and (max-width: $breakpoint-mobile) {
|
||||
padding-left: 0;
|
||||
margin-left: -28px;
|
||||
// Because it's nested within tab-merged which we've given padding
|
||||
// on mobile viewports due to snippets
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -18,10 +18,11 @@
|
|||
add_text - text for the 'add' button
|
||||
{% endcomment %}
|
||||
<header class="{% if merged %}merged{% endif %} {% if tabbed %}tab-merged{% endif %} {% if search_form %}hasform{% endif %}">
|
||||
<div class="row">
|
||||
<div class="row nice-padding">
|
||||
<div class="left">
|
||||
<div class="col header-title">
|
||||
<h1 class="icon icon-{{ icon }}">{{ title }}{% if subtitle %} <span>{{ subtitle }}</span>{% endif %}</h1>
|
||||
<h1 class="icon icon-{{ icon }}">
|
||||
{{ title }}{% if subtitle %} <span>{{ subtitle }}</span>{% endif %}</h1>
|
||||
</div>
|
||||
{% if search_url %}
|
||||
<form class="col search-form" action="{% url search_url %}{% if query_parameters %}?{{ query_parameters }}{% endif %}" method="get" novalidate>
|
||||
|
|
|
|||
|
|
@ -17,8 +17,9 @@
|
|||
|
||||
<header class="nice-padding">
|
||||
<div class="row row-flush">
|
||||
<div class="left col9 header-title">
|
||||
<h1 class="icon icon-snippet">{% blocktrans with snippet_type_name_plural=model_opts.verbose_name_plural|capfirst %}Snippets <span>{{ snippet_type_name_plural }}</span>{% endblocktrans %}</h1>
|
||||
<div class="left col9 header-snippet">
|
||||
<h1 class="icon icon-snippet">
|
||||
{% blocktrans with snippet_type_name_plural=model_opts.verbose_name_plural|capfirst %}Snippets <span>{{ snippet_type_name_plural }}</span>{% endblocktrans %}</h1>
|
||||
|
||||
{% if is_searchable %}
|
||||
<form class="col search-form" action="{% url 'wagtailsnippets:list' model_opts.app_label model_opts.model_name %}" method="get" novalidate>
|
||||
|
|
|
|||
Loading…
Reference in a new issue