Re-instate back button for item edit forms

This commit is contained in:
Loz Calver 2016-01-22 11:20:56 +00:00
parent ea00c670fd
commit 70f8343475
5 changed files with 26 additions and 9 deletions

View File

@ -336,7 +336,7 @@ form.small .field input.text, form.small .field textarea, form.small .field sele
.cms .ss-ui-button.ui-state-hover, .cms .ss-ui-button:hover { text-decoration: none; background-color: white; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6)); background: -moz-linear-gradient(#ffffff, #e6e6e6); background: -webkit-linear-gradient(#ffffff, #e6e6e6); background: linear-gradient(#ffffff, #e6e6e6); -moz-box-shadow: 0 0 5px #b3b3b3; -webkit-box-shadow: 0 0 5px #b3b3b3; box-shadow: 0 0 5px #b3b3b3; }
.cms .ss-ui-button:active, .cms .ss-ui-button:focus, .cms .ss-ui-button.ui-state-active, .cms .ss-ui-button.ui-state-focus { border: 1px solid #b3b3b3; background-color: white; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #e6e6e6)); background: -moz-linear-gradient(#ffffff, #e6e6e6); background: -webkit-linear-gradient(#ffffff, #e6e6e6); background: linear-gradient(#ffffff, #e6e6e6); -moz-box-shadow: 0 0 5px #b3b3b3 inset; -webkit-box-shadow: 0 0 5px #b3b3b3 inset; box-shadow: 0 0 5px #b3b3b3 inset; }
.cms .ss-ui-button.ss-ui-action-minor span { padding-left: 0; padding-right: 0; }
.cms .ss-ui-button.ss-ui-action-constructive { text-shadow: none; font-weight: bold; color: white; border-color: #1F9433; border-bottom-color: #166a24; background-color: #1F9433; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk0YmU0MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFmOTQzMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #94be42), color-stop(100%, #1f9433)); background: -moz-linear-gradient(#94be42, #1f9433); background: -webkit-linear-gradient(#94be42, #1f9433); background: linear-gradient(#94be42, #1f9433); text-shadow: #1c872f 0 -1px -1px; }
.cms .ss-ui-button.ss-ui-action-constructive { text-shadow: none; font-weight: bold; color: white; border-color: #1F9433; border-bottom-color: #166a24; background-color: #1F9433; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzkzYmU0MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFmOTQzMyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #93be42), color-stop(100%, #1f9433)); background: -moz-linear-gradient(#93be42, #1f9433); background: -webkit-linear-gradient(#93be42, #1f9433); background: linear-gradient(#93be42, #1f9433); text-shadow: #1c872f 0 -1px -1px; }
.cms .ss-ui-button.ss-ui-action-constructive.ui-state-hover, .cms .ss-ui-button.ss-ui-action-constructive:hover { border-color: #166a24; background-color: #1F9433; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E0Y2EzYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIzYTkzYSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a4ca3a), color-stop(100%, #23a93a)); background: -moz-linear-gradient(#a4ca3a, #23a93a); background: -webkit-linear-gradient(#a4ca3a, #23a93a); background: linear-gradient(#a4ca3a, #23a93a); }
.cms .ss-ui-button.ss-ui-action-constructive:active, .cms .ss-ui-button.ss-ui-action-constructive:focus, .cms .ss-ui-button.ss-ui-action-constructive.ui-state-active, .cms .ss-ui-button.ss-ui-action-constructive.ui-state-focus { background-color: #1d8c30; -moz-box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); -webkit-box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); box-shadow: inset 0 1px 3px #17181a, 0 1px 0 rgba(255, 255, 255, 0.6); }
.cms .ss-ui-button.ss-ui-action-destructive { color: #f00; background-color: #e6e6e6; }
@ -354,8 +354,8 @@ form.small .field input.text, form.small .field textarea, form.small .field sele
.cms .ss-ui-button[class*="font-icon-"].active, .cms .ss-ui-button[class*="font-icon-"]:active, .cms .ss-ui-button[class^="font-icon-"].active, .cms .ss-ui-button[class^="font-icon-"]:active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"]:active { -moz-box-shadow: 0 0 3px rgba(191, 194, 196, 0.9) inset; -webkit-box-shadow: 0 0 3px rgba(191, 194, 196, 0.9) inset; box-shadow: 0 0 3px rgba(191, 194, 196, 0.9) inset; background: #dee3e8; color: #4f5861; border: 0; }
.cms .ss-ui-button[class*="font-icon-"] .ui-button-text, .cms .ss-ui-button[class^="font-icon-"] .ui-button-text, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"] .ui-button-text { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; padding: 0; }
.cms .ss-ui-button[class*="font-icon-"] .ui-icon, .cms .ss-ui-button[class^="font-icon-"] .ui-icon, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"] .ui-icon { display: none; }
.cms .ss-ui-button[class*="font-icon-"].no-text, .cms .ss-ui-button[class^="font-icon-"].no-text, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text { padding: 5px 6px; color: #66727d; }
.cms .ss-ui-button[class*="font-icon-"].no-text.active, .cms .ss-ui-button[class*="font-icon-"].no-text:active, .cms .ss-ui-button[class*="font-icon-"].no-text:focus, .cms .ss-ui-button[class*="font-icon-"].no-text:hover, .cms .ss-ui-button[class^="font-icon-"].no-text.active, .cms .ss-ui-button[class^="font-icon-"].no-text:active, .cms .ss-ui-button[class^="font-icon-"].no-text:focus, .cms .ss-ui-button[class^="font-icon-"].no-text:hover, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text.active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:focus, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:hover { background: none; box-shadow: none; color: #383f45; }
.cms .ss-ui-button[class*="font-icon-"].no-text, .cms .ss-ui-button[class^="font-icon-"].no-text, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text { padding: 5px 6px; color: #66717d; }
.cms .ss-ui-button[class*="font-icon-"].no-text.active, .cms .ss-ui-button[class*="font-icon-"].no-text:active, .cms .ss-ui-button[class*="font-icon-"].no-text:focus, .cms .ss-ui-button[class*="font-icon-"].no-text:hover, .cms .ss-ui-button[class^="font-icon-"].no-text.active, .cms .ss-ui-button[class^="font-icon-"].no-text:active, .cms .ss-ui-button[class^="font-icon-"].no-text:focus, .cms .ss-ui-button[class^="font-icon-"].no-text:hover, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text.active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:active, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:focus, .cms .ss-ui-button.ss-ui-button-constructive[class*="font-icon-"].no-text:hover { background: none; box-shadow: none; color: #383e45; }
.cms .ss-ui-buttonset .ui-button { margin-left: -1px; }
.cms .ss-ui-buttonset { margin-left: 1px; }
.cms .ss-ui-loading-icon { background: url(../../images/network-save.gif) no-repeat; display: block; width: 16px; height: 16px; }
@ -529,8 +529,11 @@ body.cms { overflow: hidden; }
.cms-content-header h2 * { vertical-align: middle; }
.cms-content-header .cms-content-header-info { float: left; padding-top: 7px; }
.cms-content-header .cms-content-header-info * { display: inline-block; }
.cms-content-header .cms-content-header-info .breadcrumbs-wrapper { vertical-align: middle; }
.cms-content-header .cms-content-header-info .section-icon { opacity: 0.2; margin-right: 4px; background-repeat: no-repeat; }
.cms-content-header .cms-content-header-info .cms_backlink { vertical-align: middle; }
.cms-content-header .cms-content-header-info .cms_backlink .ss-ui-button { margin-bottom: 8px; margin-left: -8px; line-height: 22px; }
.cms-content-header .cms-content-header-info .cms_backlink .ss-ui-button:before { margin-right: 0; font-size: 22px; }
.cms-content-header .ss-ui-button { line-height: 24px; }
.cms-content-header .ss-ui-button .ui-button-text { line-height: 1.4; }
@ -608,7 +611,7 @@ body.cms { overflow: hidden; }
.ui-tabs .ui-tabs-nav li a { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; outline: none; float: none; font-weight: normal; color: #4f5861; line-height: 32px; padding: 0 12px 0; }
.ui-tabs .ui-tabs-nav li:last-child { margin-right: 0; }
.ui-tabs .ui-tabs-nav .ui-state-default { border: 0; background: transparent; }
.ui-tabs .ui-tabs-nav .ui-state-default a { line-height: 28px; padding-top: 12px; padding-bottom: 8px; color: #66727d; }
.ui-tabs .ui-tabs-nav .ui-state-default a { line-height: 28px; padding-top: 12px; padding-bottom: 8px; color: #66717d; }
.ui-tabs .ui-tabs-nav .ui-state-default a:hover { color: #4f5861; }
.ui-tabs .ui-tabs-nav .ui-state-active { padding-bottom: 1px; background-color: transparent; cursor: text; }
.ui-tabs .ui-tabs-nav .ui-state-active a { border-bottom: 3px solid #66727d; padding-left: 0; padding-right: 0; margin: 0 12px 0; color: #4f5861; }

File diff suppressed because one or more lines are too long

View File

@ -134,6 +134,10 @@ body.cms {
display: inline-block; // align back button and breadcrumbs
}
.breadcrumbs-wrapper {
vertical-align: middle;
}
.section-icon {
opacity: 0.2;
margin-right: 4px;
@ -142,6 +146,17 @@ body.cms {
.cms_backlink {
vertical-align: middle;
.ss-ui-button {
margin-bottom: $grid-x; // Matches the margin on .cms-content-header h2
margin-left: (- $grid-x); // Half of the padding on .cms-content-header
line-height: 22px;
&:before {
margin-right: 0;
font-size: 22px;
}
}
}
}

View File

@ -1,7 +1,5 @@
<% if $Backlink %>
<div class="cms_backlink">
<a class="backlink ss-ui-button cms-panel-link" data-icon="back" href="$Backlink">
<%t BackLink_Button_ss.Back 'Back' %>
</a>
<a class="backlink ss-ui-button cms-panel-link font-icon-left-open-big no-text" href="$Backlink"></a>
</div>
<% end_if %>

View File

@ -3,6 +3,7 @@
<% end_if %>
<div class="cms-content-header north">
<div class="cms-content-header-info">
<% include BackLink_Button %>
<% with $Controller %>
<% include CMSBreadcrumbs %>
<% end_with %>