kopia lustrzana https://github.com/wagtail/wagtail
Tidy up page edit header
Dan Braghis
Matt Westcott
rodzic
1dc7bc2713
commit
1f8fc4b6d8
|
|
@ -65,10 +65,14 @@ header {
|
|||
|
||||
@include media-breakpoint-down(xs) {
|
||||
// To all hamburger menu to be visible
|
||||
padding-left: $desktop-nice-padding;
|
||||
padding-right: 0;
|
||||
padding-left: 1.6em;
|
||||
padding-right: 1.6em;
|
||||
padding-top: 11px;
|
||||
|
||||
.breadcrumb {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.nice-padding {
|
||||
margin-left: -$desktop-nice-padding;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -99,6 +99,10 @@ $zindex-modal-background: 500;
|
|||
header {
|
||||
padding-left: 2em;
|
||||
padding-right: 100px;
|
||||
|
||||
&.tab-merged {
|
||||
padding-left: 1.6em;
|
||||
}
|
||||
}
|
||||
|
||||
.header-title {
|
||||
|
|
@ -106,12 +110,22 @@ $zindex-modal-background: 500;
|
|||
padding-left: 0 !important;
|
||||
margin-left: -36px;
|
||||
}
|
||||
|
||||
.tab-merged .header-title {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
.modal-dialog {
|
||||
padding: 0 0 2em $menu-width;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
header.tab-merged {
|
||||
padding-left: $desktop-nice-padding;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(xl) {
|
||||
|
|
|
|||
|
|
@ -26,14 +26,13 @@
|
|||
@include transition(border-color 0.2s ease);
|
||||
background-color: $color-teal-darker;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 1.2em;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
padding: 0.7em;
|
||||
color: $color-white;
|
||||
border-top: 0.3em solid $color-teal-darker;
|
||||
max-height: 1.2em;
|
||||
max-height: 1.44em;
|
||||
overflow: hidden;
|
||||
|
||||
&:hover {
|
||||
|
|
@ -68,19 +67,6 @@
|
|||
border-top: 0.3em solid $color-grey-1;
|
||||
}
|
||||
|
||||
li.settings a {
|
||||
&:before {
|
||||
@include font-smoothing;
|
||||
font-family: wagtail;
|
||||
vertical-align: middle;
|
||||
text-transform: none;
|
||||
content: map-get($icons, 'cog');
|
||||
margin-right: 0.5em;
|
||||
font-size: 1.2em;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
// For cases where tab-nav should merge with header
|
||||
&.merged {
|
||||
margin-top: 0;
|
||||
|
|
@ -121,8 +107,8 @@
|
|||
}
|
||||
|
||||
a {
|
||||
padding-left: $desktop-nice-padding - 10;
|
||||
padding-right: $desktop-nice-padding - 10;
|
||||
padding-left: $mobile-nice-padding;
|
||||
padding-right: $mobile-nice-padding;
|
||||
}
|
||||
|
||||
li.settings a {
|
||||
|
|
@ -136,7 +122,7 @@
|
|||
min-width: 0;
|
||||
|
||||
&:first-of-type {
|
||||
padding-left: 2.5em;
|
||||
padding-left: $desktop-nice-padding;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ h1 {
|
|||
h2 {
|
||||
text-transform: uppercase;
|
||||
font-size: 1.3em;
|
||||
font-family: Open Sans;
|
||||
font-family: Open Sans, Arial, sans-serif;
|
||||
font-weight: 600;
|
||||
color: $color-grey-2;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,34 +33,47 @@
|
|||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.915em; // approximately 26px
|
||||
|
||||
&.header-title {
|
||||
text-transform: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.header-title {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.modal-body .header-title h1 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.header-meta {
|
||||
list-style: none;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
border: 0;
|
||||
float: left;
|
||||
height: 1.5em;
|
||||
line-height: 1.5em;
|
||||
margin-top: 1em;
|
||||
padding: 0 .5em;
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.5);
|
||||
line-height: 2em;
|
||||
margin: 1em 0 1.5em;
|
||||
|
||||
.icon {
|
||||
width: 1.25em;
|
||||
height: 1.5em;
|
||||
vertical-align: text-bottom;
|
||||
@include svg-icon(1.25em, text-bottom);
|
||||
|
||||
margin-right: 0.4em;
|
||||
}
|
||||
|
||||
.icon-warning {
|
||||
@include svg-icon();
|
||||
}
|
||||
|
||||
&:first-child .button {
|
||||
margin-left: -1em;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-left: -.5em; // offset the padding
|
||||
}
|
||||
&:last-child {
|
||||
border: none;
|
||||
margin-left: -0.8em;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
|
|
@ -71,11 +84,13 @@
|
|||
.button {
|
||||
font-size: 1em;
|
||||
margin-top: -0.25em; // Account for the button border
|
||||
overflow: auto;
|
||||
overflow: initial;
|
||||
height: 2.5em;
|
||||
line-height: 2.5em;
|
||||
}
|
||||
|
||||
.action-workflow-status {
|
||||
font-weight: 700;
|
||||
font-weight: 600;
|
||||
|
||||
span {
|
||||
font-weight: 500;
|
||||
|
|
@ -85,10 +100,14 @@
|
|||
.human-readable-date {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
.header-title {
|
||||
padding-left: 0;
|
||||
&--status {
|
||||
padding-right: 0.8em;
|
||||
}
|
||||
|
||||
&--type {
|
||||
padding: 0 0.8em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -541,17 +560,25 @@ footer .preview {
|
|||
}
|
||||
}
|
||||
|
||||
.lock-status {
|
||||
display: inline-block;
|
||||
margin: 0 .5em;
|
||||
text-transform: uppercase;
|
||||
width: 4em;
|
||||
}
|
||||
.button.button--live {
|
||||
background-color: $color-white;
|
||||
color: $color-teal;
|
||||
border-radius: 2px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
line-height: 2.3em;
|
||||
padding: 0 0.75em;
|
||||
|
||||
.lock-indicator .button-toggle--on .icon {
|
||||
fill: $color-red;
|
||||
}
|
||||
.icon {
|
||||
@include svg-icon(1.25em);
|
||||
margin-right: 0.25em;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $color-teal-darker;
|
||||
color: $color-white;
|
||||
}
|
||||
}
|
||||
|
||||
.workflow-timeline {
|
||||
list-style: none;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
{% load i18n wagtailadmin_tags %}
|
||||
{% if page.live and page.url is not None %}
|
||||
{% test_page_is_public page as is_public %}
|
||||
<a href="{{ page.url }}" target="_blank" rel="noopener noreferrer" class="button button-small button-nostroke live" title="{% trans 'Visit the live page' %}">
|
||||
<a href="{{ page.url }}" target="_blank" rel="noopener noreferrer" class="button button-nostroke button--live" title="{% trans 'Visit the live page' %}">
|
||||
{% icon name="link-external" class_name="initial" %}
|
||||
{% trans "Live" %}
|
||||
<span class="privacy-indicator-tag {% if is_public %}u-hidden" aria-hidden="true{% endif %}" title="{% trans "This page is live but only available to certain users" %}">({% trans "restricted" %})</span>
|
||||
|
|
|
|||
|
|
@ -20,18 +20,16 @@
|
|||
</div>
|
||||
</div>
|
||||
<ul class="row header-meta">
|
||||
<li>
|
||||
{% include "wagtailadmin/shared/workflow_status.html" with page=page_for_status %}
|
||||
</li>
|
||||
{% include "wagtailadmin/shared/workflow_status.html" with page=page_for_status %}
|
||||
{% if page.get_latest_revision %}
|
||||
<li>
|
||||
<a href="{% url 'wagtailadmin_pages:history' page.id %}" class="button button-small button-nobg button-strokeonhover text-notransform">
|
||||
<a href="{% url 'wagtailadmin_pages:history' page.id %}" class="button button-small button-nobg text-notransform">
|
||||
{% icon "history" class_name="default" %}
|
||||
{% trans "Page history" %}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li>
|
||||
<li class="header-meta--type">
|
||||
{% icon name="doc-empty-inverse" class_name="default" %}
|
||||
{{ content_type.model_class.get_verbose_name }}
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
{% load i18n wagtailadmin_tags %}
|
||||
{% if workflow_state %}
|
||||
<li>
|
||||
<button data-url="{% url 'wagtailadmin_pages:workflow_status' page.id %}"
|
||||
class="button button-small button-nobg button-strokeonhover text-notransform action-workflow-status">
|
||||
class="button button-small button-nobg text-notransform action-workflow-status">
|
||||
{% if workflow_state.status == 'needs_changes' %}
|
||||
{% icon name="warning" %}
|
||||
{% trans "Changes requested" %}
|
||||
|
|
@ -17,7 +18,9 @@
|
|||
{% include "wagtailadmin/shared/last_updated.html" with since_text=since_text last_updated=workflow_state.current_task_state.started_at %}
|
||||
{% endif %}
|
||||
</button>
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="header-meta--status">
|
||||
{% if page.get_latest_revision %}
|
||||
{% if page.get_latest_revision.user %}
|
||||
<span class="avatar small" data-wagtail-tooltip="{{ page.get_latest_revision.user.get_full_name|default:page.get_latest_revision.user.get_username }}"><img src="{% avatar_url page.get_latest_revision.user size=25 %}" alt="" /></span>
|
||||
|
|
@ -31,4 +34,5 @@
|
|||
{% else %}
|
||||
{% trans "Draft" %}
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endif %}
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue