bachir/edlp_d8
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated core from 8.4 to 8.5 : bug with login_destination

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2018-03-13 14:01:21 +01:00
parent 0d78da249b
commit e668535a4e
3486 changed files with 89604 additions and 33283 deletions
Download Patch File Download Diff File Expand all files Collapse all files
core/modules/settings_tray/css/off-canvas.base.css
-238
View File
@@ -1,238 +0,0 @@
/**
* @file
* Set base styles for the settings tray.
*/
/* Set some global attributes. */
#drupal-off-canvas *,
#drupal-off-canvas *:not(div) {
background: #444;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
color: #ddd;
}
/* Generic elements. */
#drupal-off-canvas a,
#drupal-off-canvas .link {
border-bottom: none;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
font-size: inherit;
font-weight: normal;
color: #85bef4;
text-decoration: none;
transition: color .5s ease;
}
#drupal-off-canvas a:focus,
#drupal-off-canvas .link:focus,
#drupal-off-canvas a:hover,
#drupal-off-canvas .link:hover {
outline: none;
color: #46a0f5;
}
#drupal-off-canvas hr {
height: 1px;
background: #cccccc;
}
#drupal-off-canvas summary,
#drupal-off-canvas .fieldgroup:not(.form-composite) > legend {
font-weight: bold;
}
#drupal-off-canvas h1,
#drupal-off-canvas .heading-a {
display: block;
font-weight: bold;
font-size: 1.625em;
line-height: 1.875em;
}
#drupal-off-canvas h2,
#drupal-off-canvas .heading-b {
display: block;
font-weight: bold;
margin: 10px 0;
font-size: 1.385em;
}
#drupal-off-canvas h3,
#drupal-off-canvas .heading-c {
display: block;
font-weight: bold;
margin: 10px 0;
font-size: 1.231em;
}
#drupal-off-canvas h4,
#drupal-off-canvas .heading-d {
display: block;
font-weight: bold;
margin: 10px 0;
font-size: 1.154em;
}
#drupal-off-canvas h5,
#drupal-off-canvas .heading-e {
display: block;
font-weight: bold;
margin: 10px 0;
font-size: 1.077em;
}
#drupal-off-canvas h6,
#drupal-off-canvas .heading-f {
display: block;
font-weight: bold;
margin: 10px 0;
font-size: 1.077em;
}
#drupal-off-canvas p {
margin: 1em 0;
}
#drupal-off-canvas dl {
margin: 0 0 20px;
}
#drupal-off-canvas dl dd,
#drupal-off-canvas dl dl {
margin-left: 20px; /* LTR */
margin-bottom: 10px;
}
[dir="rtl"] #drupal-off-canvas dl dd,
[dir="rtl"] #drupal-off-canvas dl dl {
margin-right: 20px;
}
#drupal-off-canvas blockquote {
margin: 1em 40px;
}
#drupal-off-canvas address {
font-style: italic;
}
#drupal-off-canvas u,
#drupal-off-canvas ins {
text-decoration: underline;
}
#drupal-off-canvas s,
#drupal-off-canvas strike,
#drupal-off-canvas del {
text-decoration: line-through;
}
#drupal-off-canvas big {
font-size: larger;
}
#drupal-off-canvas small {
font-size: smaller;
}
#drupal-off-canvas sub {
vertical-align: sub;
font-size: smaller;
line-height: normal;
}
#drupal-off-canvas sup {
vertical-align: super;
font-size: smaller;
line-height: normal;
}
#drupal-off-canvas nobr {
white-space: nowrap;
}
#drupal-off-canvas abbr,
#drupal-off-canvas acronym {
border-bottom: dotted 1px;
background: transparent;
}
#drupal-off-canvas ul {
list-style-type: disc;
list-style-image: none;
}
[dir="rtl"] #drupal-off-canvas .messages__list {
margin-right: 0;
}
#drupal-off-canvas ol {
list-style-type: decimal;
}
#drupal-off-canvas ul li,
#drupal-off-canvas ol li {
display: block;
}
#drupal-off-canvas blockquote,
#drupal-off-canvas code {
margin: 20px 0;
}
#drupal-off-canvas pre {
margin: 20px 0;
white-space: pre-wrap;
}
/* Classes for hidden and visually hidden elements. See hidden.module.css. */
#drupal-off-canvas .hidden {
display: none;
}
#drupal-off-canvas .visually-hidden {
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
height: 1px;
width: 1px;
word-wrap: normal;
}
#drupal-off-canvas .visually-hidden.focusable:active,
#drupal-off-canvas .visually-hidden.focusable:focus {
position: static !important;
clip: auto;
overflow: visible;
height: auto;
width: auto;
}
#drupal-off-canvas .invisible {
visibility: hidden;
}
/* Some system classes. See system.admin.css. */
#drupal-off-canvas .panel {
padding: 5px 5px 15px;
}
#drupal-off-canvas .panel__description {
margin: 0 0 3px;
padding: 2px 0 3px 0;
}
#drupal-off-canvas .compact-link {
margin: 0 0 10px 0;
}
#drupal-off-canvas small .admin-link:before {
content: ' [';
}
#drupal-off-canvas small .admin-link:after {
content: ']';
}
/* Override jQuery UI */
#drupal-off-canvas .ui-widget-content a {
color: #85bef4 !important;
}
/* Message styles */
#drupal-off-canvas .messages {
background: no-repeat 10px 17px;
}
[dir="rtl"] #drupal-off-canvas .messages {
background-position: right 10px top 17px;
}
#drupal-off-canvas .messages abbr {
color: #444;
}
#drupal-off-canvas .messages--status {
background-color: #f3faef;
background-image: url(../../../misc/icons/73b355/check.svg);
color: #325e1c;
}
#drupal-off-canvas .messages--warning {
background-color: #fdf8ed;
background-image: url(../../../misc/icons/e29700/warning.svg);
color: #734c00;
}
#drupal-off-canvas .messages--error {
background-color: #fcf4f2;
background-image: url(../../../misc/icons/e32700/error.svg);
color: #a51b00;
}
#drupal-off-canvas .messages--error div[role="alert"] {
background: transparent;
color: inherit;
}
core/modules/settings_tray/css/off-canvas.button.css
-118
View File
@@ -1,118 +0,0 @@
/**
* @file
* Visual styling for buttons in the off canvas tray.
*
* See seven/css/components/buttons.css
*/
#drupal-off-canvas button,
#drupal-off-canvas .button {
-webkit-appearance: none;
-moz-appearance: none;
margin: 0 0 10px;
padding: 0;
border: 0;
box-shadow: none;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
line-height: normal;
text-transform: none;
text-decoration: none;
cursor: pointer;
}
#drupal-off-canvas button.link {
display: inline;
background: transparent;
font-size: 14px;
color: #85bef4;
transition: color .5s ease;
}
#drupal-off-canvas button.link:hover,
#drupal-off-canvas button.link:focus {
color: #46a0f5;
text-decoration: none;
}
#drupal-off-canvas input[type="submit"].button {
display: inline-block;
position: relative;
width: 100%;
height: auto;
padding: 4px 20px;
border: 0;
border-radius: 20em;
background: #777;
font-weight: 600;
font-size: 14px;
color: #f5f5f5;
text-align: center;
cursor: pointer;
transition: background .5s ease;
}
#drupal-off-canvas input[type="submit"].button:hover,
#drupal-off-canvas input[type="submit"].button:focus,
#drupal-off-canvas input[type="submit"].button:active {
border: 0;
color: #fff;
text-decoration: none;
outline: none;
z-index: 10;
}
#drupal-off-canvas input[type="submit"].button:focus,
#drupal-off-canvas input[type="submit"].button:active {
box-shadow: 0 3px 3px 2px rgba(0,0,0,0.1);
}
#drupal-off-canvas input[type="submit"].button--primary {
border: 0;
background: #277abd;
color: #fff;
margin-top: 15px;
}
#drupal-off-canvas input[type="submit"].button--primary:hover,
#drupal-off-canvas input[type="submit"].button--primary:focus,
#drupal-off-canvas input[type="submit"].button--primary:active {
background: #2b8bd8;
outline: none;
}
#drupal-off-canvas .button-action:before {
margin-left: -0.2em; /* LTR */
padding-right: 0.2em; /* LTR */
font-size: 14px;
line-height: 16px;
}
[dir="rtl"] #drupal-off-canvas .button-action:before {
margin-right: -0.2em;
margin-left: 0;
padding-right: 0;
padding-left: 0.2em;
}
#drupal-off-canvas .no-touchevents .button--small {
font-size: 13px;
padding: 2px 1em;
}
#drupal-off-canvas .button:disabled,
#drupal-off-canvas .button:disabled:active,
#drupal-off-canvas .button.is-disabled,
#drupal-off-canvas .button.is-disabled:active {
border: 0;
background: #555;
color: #5c5c5c;
font-weight: normal;
cursor: default;
}
#drupal-off-canvas .button--danger {
border-radius: 0;
color: #c72100;
font-weight: 400;
text-decoration: none;
}
#drupal-off-canvas .button--danger:hover,
#drupal-off-canvas .button--danger:focus,
#drupal-off-canvas .button--danger:active {
color: #ff2a00;
text-decoration: none;
text-shadow: none;
}
#drupal-off-canvas .button--danger:disabled,
#drupal-off-canvas .button--danger.is-disabled {
color: #737373;
cursor: default;
}
core/modules/settings_tray/css/off-canvas.css
-57
View File
@@ -1,57 +0,0 @@
/**
* @file
* CSS for off-canvas dialog.
*
* @todo Move CSS into core dialog library https://www.drupal.org/node/2784443.
*/
/* Position the off-canvas dialog container outside the right of the viewport. */
.ui-dialog-off-canvas {
box-sizing: border-box;
height: 100%;
overflow: visible;
}
/* Wrap the form that's inside the off-canvas dialog. */
.ui-dialog-off-canvas .ui-dialog-content {
padding: 0 20px;
/* Prevent horizontal scrollbar. */
overflow-x: hidden;
overflow-y: auto;
}
[dir="rtl"] .ui-dialog-off-canvas .ui-dialog-content {
text-align: right;
}
/* Position the dialog-off-canvas tray container outside the right of the viewport. */
.ui-dialog-off-canvas {
box-sizing: border-box;
height: 100%;
overflow: visible;
}
/* Wrap the form that's inside the dialog-off-canvas tray. */
.ui-dialog-off-canvas #drupal-off-canvas {
padding: 0 20px;
/* Prevent horizontal scrollbar. */
overflow-x: hidden;
overflow-y: auto;
}
[dir="rtl"] .ui-dialog-off-canvas #drupal-off-canvas {
text-align: right;
}
/*
* Force the tray to be 100% width at the same breakpoint the dialog system uses
* to expand dialog widths.
*/
@media all and (max-width: 48em) { /* 768px */
.ui-dialog.ui-dialog-off-canvas {
width: 100% !important;
}
/* When tray is at 100% width stop the body from scrolling */
.js-tray-open {
height: 100%;
overflow-y: hidden;
}
}
core/modules/settings_tray/css/off-canvas.details.css
-61
View File
@@ -1,61 +0,0 @@
/**
* @file
* Visual styling for summary and details in the Settings Tray module's off canvas tray.
*/
#drupal-off-canvas details,
#drupal-off-canvas summary {
display: block;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
}
#drupal-off-canvas details,
#drupal-off-canvas summary,
#drupal-off-canvas .ui-dialog-content {
background: #474747;
color: #ddd;
}
#drupal-off-canvas summary a {
color: #ddd;
padding-top: 0;
padding-bottom: 0;
}
#drupal-off-canvas summary a:hover,
#drupal-off-canvas summary a:focus {
color: #fff;
}
#drupal-off-canvas details,
#drupal-off-canvas summary,
#drupal-off-canvas .details-wrapper {
border-width: 0;
/* Cancel out the padding of the parent. */
margin: 0 -20px;
padding: 0 20px;
}
#drupal-off-canvas summary {
text-shadow: none;
padding: 10px 20px;
font-size: 14px;
transition: all .5s ease;
}
#drupal-off-canvas summary:hover,
#drupal-off-canvas summary:focus {
background-color: #222;
outline: none;
}
#drupal-off-canvas details[open] {
padding-bottom: 10px;
}
#drupal-off-canvas details[open] > summary {
background-color: #333;
color: #eee;
}
#drupal-off-canvas details[open] > summary:hover {
background-color: #222;
color: #fff;
}
#drupal-off-canvas details .placeholder {
font: inherit;
color: inherit;
font-style: italic;
background: transparent;
}
core/modules/settings_tray/css/off-canvas.dropbutton.css
-291
View File
@@ -1,291 +0,0 @@
/**
* @file
* Styles for dropbuttons in the off-canvas tray.
*/
#drupal-off-canvas .dropbutton-wrapper,
#drupal-off-canvas .dropbutton-widget {
-webkit-appearance: none;
-moz-appearance: none;
display: block;
position: static;
transition: none;
}
#drupal-off-canvas .dropbutton-widget {
margin: 0;
padding: 0;
border: 0;
background: #277abd;
border-radius: 1em;
font-weight: 600;
color: #fff;
text-transform: none;
text-decoration: none;
text-align: center;
line-height: normal;
cursor: pointer;
transition: background .5s ease;
}
#drupal-off-canvas .dropbutton-widget:hover {
background: #2b8bd8;
}
/*
* Style dropbutton single.
*/
#drupal-off-canvas .dropbutton-single .dropbutton-action a {
padding: 0;
/* Overlap icon for trigger. */
margin-top: -2em;
height: 2.2em;
cursor: pointer;
}
#drupal-off-canvas .dropbutton-single .dropbutton-action:hover,
#drupal-off-canvas .dropbutton-single .dropbutton-action:focus,
#drupal-off-canvas .dropbutton-single .dropbutton-action a:hover,
#drupal-off-canvas .dropbutton-single .dropbutton-action a:focus {
text-decoration: none;
outline: none;
}
#drupal-off-canvas .dropbutton-widget .dropbutton {
margin: 0;
overflow: hidden;
padding: 0;
}
#drupal-off-canvas .dropbutton li,
#drupal-off-canvas .dropbutton a {
display: block;
width: auto;
padding: 4px 0;
text-align: left;
color: #555;
outline: none;
}
#drupal-off-canvas .dropbutton li:hover,
#drupal-off-canvas .dropbutton li:focus,
#drupal-off-canvas .dropbutton a:hover,
#drupal-off-canvas .dropbutton a:focus {
background: transparent;
color: #333;
outline: none;
}
/*
* Style dropbutton multiple.
*/
#drupal-off-canvas .dropbutton-multiple .dropbutton-widget {
width: 2em;
height: 2em;
}
#drupal-off-canvas .dropbutton-multiple .dropbutton-widget:hover {
background-color: #2b8bd8;
}
/* Hide the other actions until the dropbutton is triggered. */
#drupal-off-canvas .dropbutton-multiple .dropbutton .secondary-action {
display: none;
}
/* The toggle to expand the button. */
#drupal-off-canvas .dropbutton-toggle {
position: absolute;
top: 0;
right: 0; /* LTR */
bottom: 0;
display: block;
width: 2em;
color: #fff;
text-indent: 110%;
white-space: nowrap;
}
#drupal-off-canvas .dropbutton-toggle button {
display: block;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
border: 0 solid transparent;
border-bottom-right-radius: 1em; /* LTR */
border-top-right-radius: 1em; /* LTR */
cursor: pointer;
}
#drupal-off-canvas .dropbutton-toggle button:hover,
#drupal-off-canvas .dropbutton-toggle button:focus {
outline: none;
}
/* The toggle arrow. */
#drupal-off-canvas .dropbutton-arrow {
position: absolute;
display: block;
height: 0;
width: 0;
margin-top: 0;
border-bottom-color: transparent;
border-left-color: transparent;
border-right-color: transparent;
border-style: solid;
border-width: 0.3333em 0.3333em 0;
color: #fff;
line-height: 0;
overflow: hidden;
}
#drupal-off-canvas span.dropbutton-arrow {
top: 7px;
right: 7px; /* LTR */
background: transparent;
}
#drupal-off-canvas span.dropbutton-arrow:hover {
background: transparent;
}
#drupal-off-canvas .dropbutton-action > .js-form-submit.form-submit,
#drupal-off-canvas .dropbutton-toggle button {
position: relative;
text-shadow: none;
}
/*
* Dropbuttons when in a table cell.
*/
/* Make sure table cell doesn't collapse around absolute positioned dropbutton. */
#drupal-off-canvas td .dropbutton-single {
min-width: 2em;
}
#drupal-off-canvas td .dropbutton-multiple {
min-width: 2em;
padding-right: 0;
padding-left: 0;
margin-right: 0;
margin-left: 0;
border: 0;
}
#drupal-off-canvas td .dropbutton-multiple .dropbutton-action a,
#drupal-off-canvas td .dropbutton-multiple .dropbutton-action input,
#drupal-off-canvas td .dropbutton-multiple .dropbutton-action button {
width: auto;
padding: 0;
font-size: inherit;
}
#drupal-off-canvas td .dropbutton-wrapper {
margin-bottom: 0;
}
/* Push the widget to the right so text expands left. */
#drupal-off-canvas td .dropbutton-widget {
position: absolute;
right: 12px; /* LTR */
padding: 0;
background: #277abd none;
}
/* Push the wrapper to the right edge of the td. */
#drupal-off-canvas td .dropbutton-single,
#drupal-off-canvas td .dropbutton-multiple {
float: right; /* LTR */
padding-right: 0;
margin-right: 0;
max-width: initial;
min-width: initial;
position: relative;
}
#drupal-off-canvas td .dropbutton-widget .dropbutton {
margin: 0;
width: 2em;
height: 2em;
overflow: hidden;
background: transparent;
}
/* Push text out of the way. */
#drupal-off-canvas td .dropbutton-multiple li,
#drupal-off-canvas td .dropbutton-multiple a {
margin-left: -9999px;
background: transparent;
}
#drupal-off-canvas td .dropbutton-multiple.open .dropbutton li,
#drupal-off-canvas td .dropbutton-multiple.open .dropbutton a {
margin-left: 0;
width: auto;
color: #fff;
}
/* Collapse the button to a circle. */
#drupal-off-canvas td .dropbutton-toggle {
width: 2em;
height: 2em;
border-radius: 1em;
}
#drupal-off-canvas td .dropbutton-wrapper .dropbutton-widget .dropbutton-toggle button {
border: 0;
background: transparent;
}
/* Prevent list item from expanding it's container. */
#drupal-off-canvas td ul.dropbutton li.edit {
width: 2em;
height: 2em;
}
/* Make li text transparent above icon so it's clickable. */
#drupal-off-canvas td .dropbutton-single li.edit.dropbutton-action > a {
color: transparent;
z-index: 1;
}
/* Put pencil icon in place of hidden 'edit' text on single buttons. */
#drupal-off-canvas td .dropbutton-single .edit:before {
content: '.';
display: block;
color: transparent;
background: transparent url(../../../misc/icons/ffffff/pencil.svg) no-repeat center;
background-size: 14px;
}
/* Dropbutton when triggered expands to show secondary items. */
#drupal-off-canvas .dropbutton-multiple.open {
z-index: 100;
}
/* Create visual separation if there is an adjacent button. */
#drupal-off-canvas .dropbutton-multiple.open .dropbutton-widget {
box-shadow: 0 3px 3px 2px rgba(0,0,0,0.5);
}
/* Triggered dropbutton expands to show secondary items. */
#drupal-off-canvas .dropbutton-multiple.open,
#drupal-off-canvas .dropbutton-multiple.open .dropbutton-widget {
display: block;
width: auto;
height: auto;
max-width: none;
min-width: 0;
padding: 0;
overflow: visible;
}
/* Triggered dropbutton in td expands to show secondary items. */
#drupal-off-canvas td .dropbutton-multiple.open .dropbutton,
#drupal-off-canvas .dropbutton-multiple.open .dropbutton .secondary-action {
display: block;
width: auto;
height: auto;
padding-right: 1em; /* LTR */
}
[dir="rtl"] #drupal-off-canvas td .dropbutton-multiple.open .dropbutton {
padding-left: 1em;
padding-right: inherit;
}
#drupal-off-canvas .dropbutton-multiple.open .dropbutton li a {
padding: 2px 1em;
}
/* When open, the toggle arrow points upward. */
#drupal-off-canvas .dropbutton-multiple.open span.dropbutton-arrow {
border-bottom: 0.3333em solid;
border-top-color: transparent;
top: 2px;
}
core/modules/settings_tray/css/off-canvas.form.css
-136
View File
@@ -1,136 +0,0 @@
/**
* @file
* Visual styling for forms in the Settings Tray module's off canvas tray.
*/
#drupal-off-canvas form {
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
color: #ddd;
}
#drupal-off-canvas input[type="checkbox"] {
-webkit-appearance: checkbox;
}
#drupal-off-canvas input[type="radio"] {
-webkit-appearance: radio;
}
#drupal-off-canvas select {
-webkit-appearance: menulist;
-moz-appearance: menulist;
}
#drupal-off-canvas option {
display: block;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
}
#drupal-off-canvas label {
line-height: normal;
font-family: inherit;
font-size: 12px;
font-weight: bold;
color: #ddd;
}
#drupal-off-canvas .visually-hidden {
opacity: 0;
height: 0;
width: 0;
letter-spacing: -2em;
}
#drupal-off-canvas .description,
#drupal-off-canvas .form-item .description,
#drupal-off-canvas .details-description {
color: #ddd;
margin-top: 5px;
font-family: inherit;
font-size: 12px;
font-style: normal;
}
#drupal-off-canvas .details-wrapper .description {
color: #bbb;
}
#drupal-off-canvas .form-item {
margin-bottom: 10px;
margin-top: 10px;
}
/* Set size and position for all inputs. */
#drupal-off-canvas .form-select,
#drupal-off-canvas .form-text,
#drupal-off-canvas .form-tel,
#drupal-off-canvas .form-email,
#drupal-off-canvas .form-url,
#drupal-off-canvas .form-search,
#drupal-off-canvas .form-number,
#drupal-off-canvas .form-color,
#drupal-off-canvas .form-file,
#drupal-off-canvas .form-textarea,
#drupal-off-canvas .form-date,
#drupal-off-canvas .form-time {
box-sizing: border-box;
max-width: 100%;
padding: 6px;
margin: 5px 0 0 0;
border-width: 1px;
border-radius: 2px;
display: block;
font-family: inherit;
font-size: 14px;
color: #333;
line-height: 16px;
}
/* Reduce contrast for fields against dark background. */
#drupal-off-canvas .form-text,
#drupal-off-canvas .form-tel,
#drupal-off-canvas .form-email,
#drupal-off-canvas .form-url,
#drupal-off-canvas .form-search,
#drupal-off-canvas .form-number,
#drupal-off-canvas .form-color,
#drupal-off-canvas .form-file,
#drupal-off-canvas .form-textarea,
#drupal-off-canvas .form-date,
#drupal-off-canvas .form-time {
box-shadow: inset 0 1px 2px rgba(0, 0, 0, .125);
background-color: #eee;
border-color: #333;
color: #595959;
}
#drupal-off-canvas .form-text:focus,
#drupal-off-canvas .form-tel:focus,
#drupal-off-canvas .form-email:focus,
#drupal-off-canvas .form-url:focus,
#drupal-off-canvas .form-search:focus,
#drupal-off-canvas .form-number:focus,
#drupal-off-canvas .form-color:focus,
#drupal-off-canvas .form-file:focus,
#drupal-off-canvas .form-textarea:focus,
#drupal-off-canvas .form-date:focus,
#drupal-off-canvas .form-time:focus {
border-color: #40b6ff;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, .125), 0 0 8px #40b6ff;
background-color: #fff;
}
#drupal-off-canvas td .form-item,
#drupal-off-canvas td .form-select {
margin: 0;
}
#drupal-off-canvas .form-file {
margin-bottom: 5px;
width: 100%;
}
#drupal-off-canvas .form-actions {
text-align: center;
margin: 10px 0;
}
#drupal-off-canvas .ui-autocomplete {
background-color: white;
position: absolute;
top: 0;
left: 0;
cursor: default;
}
#drupal-off-canvas .ui-autocomplete li {
display: block;
}
#drupal-off-canvas .ui-autocomplete li a {
color: #595959 !important;
cursor: pointer;
padding: 5px;
}
core/modules/settings_tray/css/off-canvas.motion.css
-15
View File
@@ -1,15 +0,0 @@
/**
* @file
* Motion effects for off-canvas dialog.
*
* Motion effects are in a separate file so that they can be easily turned off
* to improve performance if desired.
*
* @todo Move motion effects file into a core Off-Canvas library and add a
* configuration option for browser rendering performance to disable this
* file: https://www.drupal.org/node/2784443.
*/
.dialog-off-canvas__main-canvas {
transition: all .7s ease;
}
core/modules/settings_tray/css/off-canvas.reset.css
-388
View File
@@ -1,388 +0,0 @@
/**
* @file
* Reset most HTML elements styles for the off-canvas dialog.
*
* This is a generic reset. Drupal-specific classes are reset in components.
*/
/**
* Do not include div in then initial overrides because including div will
* cause the need for many more overrides in this file.
*/
#drupal-off-canvas *:not(div),
#drupal-off-canvas *:not(svg *),
#drupal-off-canvas *:after,
#drupal-off-canvas *:before {
all: initial;
box-sizing: border-box;
text-shadow: none;
-webkit-font-smoothing: antialiased;
-webkit-tap-highlight-color: initial;
}
/* Reset size and position on elements. */
#drupal-off-canvas a,
#drupal-off-canvas abbr,
#drupal-off-canvas acronym,
#drupal-off-canvas address,
#drupal-off-canvas applet,
#drupal-off-canvas article,
#drupal-off-canvas aside,
#drupal-off-canvas audio,
#drupal-off-canvas b,
#drupal-off-canvas big,
#drupal-off-canvas blockquote,
#drupal-off-canvas body,
#drupal-off-canvas canvas,
#drupal-off-canvas caption,
#drupal-off-canvas cite,
#drupal-off-canvas code,
#drupal-off-canvas dd,
#drupal-off-canvas del,
#drupal-off-canvas dfn,
#drupal-off-canvas dialog,
#drupal-off-canvas dl,
#drupal-off-canvas dt,
#drupal-off-canvas em,
#drupal-off-canvas embed,
#drupal-off-canvas fieldset,
#drupal-off-canvas figcaption,
#drupal-off-canvas figure,
#drupal-off-canvas footer,
#drupal-off-canvas form,
#drupal-off-canvas h1,
#drupal-off-canvas h2,
#drupal-off-canvas h3,
#drupal-off-canvas h4,
#drupal-off-canvas h5,
#drupal-off-canvas h6,
#drupal-off-canvas header,
#drupal-off-canvas hgroup,
#drupal-off-canvas hr,
#drupal-off-canvas html,
#drupal-off-canvas i,
#drupal-off-canvas iframe,
#drupal-off-canvas img,
#drupal-off-canvas ins,
#drupal-off-canvas kbd,
#drupal-off-canvas label,
#drupal-off-canvas legend,
#drupal-off-canvas li,
#drupal-off-canvas main,
#drupal-off-canvas mark,
#drupal-off-canvas menu,
#drupal-off-canvas meter,
#drupal-off-canvas nav,
#drupal-off-canvas object,
#drupal-off-canvas ol,
#drupal-off-canvas output,
#drupal-off-canvas p,
#drupal-off-canvas pre,
#drupal-off-canvas progress,
#drupal-off-canvas q,
#drupal-off-canvas rp,
#drupal-off-canvas rt,
#drupal-off-canvas s,
#drupal-off-canvas samp,
#drupal-off-canvas section,
#drupal-off-canvas small,
#drupal-off-canvas span,
#drupal-off-canvas strike,
#drupal-off-canvas strong,
#drupal-off-canvas sub,
#drupal-off-canvas sup,
#drupal-off-canvas table,
#drupal-off-canvas tbody,
#drupal-off-canvas td,
#drupal-off-canvas tfoot,
#drupal-off-canvas th,
#drupal-off-canvas thead,
#drupal-off-canvas time,
#drupal-off-canvas tr,
#drupal-off-canvas tt,
#drupal-off-canvas u,
#drupal-off-canvas ul,
#drupal-off-canvas var,
#drupal-off-canvas video,
#drupal-off-canvas xmp {
border: 0;
margin: 0;
padding: 0;
font-size: 100%;
}
/*
* Override the default (display: inline) for browsers that do not recognize HTML5 tags.
* IE8 (and lower) requires a shiv: http://ejohn.org/blog/html5-shiv
*/
#drupal-off-canvas article,
#drupal-off-canvas aside,
#drupal-off-canvas figcaption,
#drupal-off-canvas figure,
#drupal-off-canvas footer,
#drupal-off-canvas header,
#drupal-off-canvas hgroup,
#drupal-off-canvas main,
#drupal-off-canvas menu,
#drupal-off-canvas nav,
#drupal-off-canvas section {
display: block;
line-height: normal;
border-radius: 0;
}
/*
* Makes browsers agree.
* IE + Opera = font-weight: bold.
* Gecko + WebKit = font-weight: bolder.
*/
#drupal-off-canvas b,
#drupal-off-canvas strong {
font-weight: bold;
}
#drupal-off-canvas em,
#drupal-off-canvas i {
font-style: italic;
}
#drupal-off-canvas img {
color: transparent;
font-size: 0;
vertical-align: middle;
}
#drupal-off-canvas ul,
#drupal-off-canvas ol {
list-style: none;
}
/* reset table styling. */
#drupal-off-canvas table {
border-collapse: collapse;
border-spacing: 0;
}
#drupal-off-canvas table thead,
#drupal-off-canvas table tbody,
#drupal-off-canvas table tbody tr:nth-child(even),
#drupal-off-canvas table tbody tr:nth-child(odd),
#drupal-off-canvas table tfoot {
border: 0;
background: transparent none;
}
#drupal-off-canvas th,
#drupal-off-canvas td,
#drupal-off-canvas caption {
font-weight: normal;
}
#drupal-off-canvas q {
quotes: none;
}
#drupal-off-canvas q:before,
#drupal-off-canvas q:after {
content: none;
}
#drupal-off-canvas sub,
#drupal-off-canvas sup,
#drupal-off-canvas small {
font-size: 75%;
}
#drupal-off-canvas sub,
#drupal-off-canvas sup {
line-height: 0;
position: relative;
vertical-align: baseline;
}
#drupal-off-canvas sub {
bottom: -0.25em;
}
#drupal-off-canvas sup {
top: -0.5em;
}
/*
* For IE9. Without, occasionally draws shapes
* outside the boundaries of <svg> rectangle.
*/
#drupal-off-canvas svg {
overflow: hidden;
}
/* Specific resets for inputs. */
#drupal-off-canvas input[type="search"]::-webkit-search-decoration {
display: none;
}
#drupal-off-canvas input {
margin: 0;
padding: 0;
}
#drupal-off-canvas input[type="checkbox"],
#drupal-off-canvas input[type="radio"] {
position: static;
margin: 0;
}
#drupal-off-canvas input:invalid,
#drupal-off-canvas button:invalid,
#drupal-off-canvas select:invalid,
#drupal-off-canvas textarea:invalid,
#drupal-off-canvas input:focus,
#drupal-off-canvas button:focus,
#drupal-off-canvas select:focus,
#drupal-off-canvas textarea:focus,
#drupal-off-canvas input[type="file"]:focus,
#drupal-off-canvas input[type="file"]:active,
#drupal-off-canvas input[type="radio"]:focus,
#drupal-off-canvas input[type="radio"]:active,
#drupal-off-canvas input[type="checkbox"]:focus,
#drupal-off-canvas input[type="checkbox"]:active {
box-shadow: none;
z-index: 1;
}
#drupal-off-canvas input[role="button"] {
cursor: pointer;
}
#drupal-off-canvas button,
#drupal-off-canvas input[type="reset"],
#drupal-off-canvas input[type="submit"],
#drupal-off-canvas input[type="button"] {
-webkit-appearance: none;
-moz-appearance: none;
display: inline-block;
background-image: none;
border: 0;
outline: 0;
overflow: visible;
text-shadow: none;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
}
#drupal-off-canvas button:hover,
#drupal-off-canvas input[type="reset"]:hover,
#drupal-off-canvas input[type="submit"]:hover,
#drupal-off-canvas input[type="button"]:hover {
background-image: none;
text-decoration: none;
}
#drupal-off-canvas button:active,
#drupal-off-canvas input[type="reset"]:active,
#drupal-off-canvas input[type="submit"]:active,
#drupal-off-canvas input[type="button"]:active {
background-image: none;
box-shadow: none;
border-color: grey;
}
#drupal-off-canvas button::-moz-focus-inner,
#drupal-off-canvas input[type="reset"]::-moz-focus-inner,
#drupal-off-canvas input[type="submit"]::-moz-focus-inner,
#drupal-off-canvas input[type="button"]::-moz-focus-inner {
border: 0;
padding: 0;
}
#drupal-off-canvas textarea,
#drupal-off-canvas select,
#drupal-off-canvas input[type="date"],
#drupal-off-canvas input[type="datetime"],
#drupal-off-canvas input[type="datetime-local"],
#drupal-off-canvas input[type="email"],
#drupal-off-canvas input[type="month"],
#drupal-off-canvas input[type="number"],
#drupal-off-canvas input[type="password"],
#drupal-off-canvas input[type="search"],
#drupal-off-canvas input[type="tel"],
#drupal-off-canvas input[type="text"],
#drupal-off-canvas input[type="time"],
#drupal-off-canvas input[type="url"],
#drupal-off-canvas input[type="week"] {
height: auto;
vertical-align: middle;
border-radius: 0;
}
#drupal-off-canvas textarea[disabled],
#drupal-off-canvas select[disabled],
#drupal-off-canvas input[type="date"][disabled],
#drupal-off-canvas input[type="datetime"][disabled],
#drupal-off-canvas input[type="datetime-local"][disabled],
#drupal-off-canvas input[type="email"][disabled],
#drupal-off-canvas input[type="month"][disabled],
#drupal-off-canvas input[type="number"][disabled],
#drupal-off-canvas input[type="password"][disabled],
#drupal-off-canvas input[type="search"][disabled],
#drupal-off-canvas input[type="tel"][disabled],
#drupal-off-canvas input[type="text"][disabled],
#drupal-off-canvas input[type="time"][disabled],
#drupal-off-canvas input[type="url"][disabled],
#drupal-off-canvas input[type="week"][disabled] {
background-color: grey;
}
#drupal-off-canvas input[type="hidden"] {
visibility: hidden;
}
#drupal-off-canvas button[disabled],
#drupal-off-canvas input[disabled],
#drupal-off-canvas select[disabled],
#drupal-off-canvas select[disabled] option,
#drupal-off-canvas select[disabled] optgroup,
#drupal-off-canvas textarea[disabled] {
box-shadow: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
}
#drupal-off-canvas input:placeholder,
#drupal-off-canvas textarea:placeholder {
color: grey;
}
#drupal-off-canvas textarea,
#drupal-off-canvas select[size],
#drupal-off-canvas select[multiple] {
height: auto;
}
#drupal-off-canvas select[size="0"],
#drupal-off-canvas select[size="1"] {
height: auto;
}
#drupal-off-canvas textarea {
min-height: 40px;
overflow: auto;
resize: vertical;
width: 100%;
}
#drupal-off-canvas optgroup {
color: black;
font-style: normal;
font-weight: normal;
}
#drupal-off-canvas optgroup::-moz-focus-inner {
border: 0;
padding: 0;
}
#drupal-off-canvas * button {
background: none;
border: 1px solid grey;
color: black;
padding: 0;
text-decoration: none;
overflow: visible;
vertical-align: middle;
width: auto;
}
#drupal-off-canvas * textarea,
#drupal-off-canvas * select,
#drupal-off-canvas *:not(div) textarea,
#drupal-off-canvas *:not(div) select {
background: white;
border: 1px solid grey;
color: black;
padding: 0;
vertical-align: top;
}
/* To standardize off-canvas selection color. */
#drupal-off-canvas ::-moz-selection,
#drupal-off-canvas ::selection {
background-color: rgba(175,175,175,0.5);
color: inherit;
}
core/modules/settings_tray/css/off-canvas.table.css
-90
View File
@@ -1,90 +0,0 @@
/**
* @file
* Visual styling for tables in the Settings Tray module's off canvas tray.
*/
#drupal-off-canvas table * {
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
}
#drupal-off-canvas table {
display: table;
width: 100%;
min-width: calc(100% + 40px);
/* Cancel out the padding of the parent to make the table full width. */
margin: 0 -20px -10px -20px;
border: 0;
border-collapse: collapse;
font-size: 12px;
color: #ddd;
}
#drupal-off-canvas table thead {
display: table-header-group;
}
#drupal-off-canvas table tbody {
display: table-row-group;
}
#drupal-off-canvas tr {
display: table-row;
}
#drupal-off-canvas tr:hover td {
background-color: transparent;
}
#drupal-off-canvas td,
#drupal-off-canvas th {
display: table-cell;
height: auto;
width: auto;
padding: 2px 8px;
vertical-align: middle;
border-bottom: 1px solid #777;
background-color: transparent;
}
[dir="rtl"] #drupal-off-canvas th,
[dir="rtl"] #drupal-off-canvas td {
text-align: right;
}
#drupal-off-canvas th {
font-weight: bold;
color: #bbb;
}
#drupal-off-canvas th.checkbox,
#drupal-off-canvas td.checkbox {
width: 20px;
padding: 0;
text-align: center;
}
#drupal-off-canvas div.checkbox.menu-enabled {
position: static;
display: inline;
width: auto;
}
#drupal-off-canvas th:first-child,
#drupal-off-canvas td:first-child {
width: 150px;
}
/* For lack of a better class, using this to grab the operations th. */
#drupal-off-canvas .tabledrag-has-colspan {
text-align: right;
padding-right: 20px;
}
#drupal-off-canvas td {
padding: 6px 8px;
color: #ddd;
}
/* Hide overflow with ellipsis for links. */
#drupal-off-canvas td a {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
background: transparent;
}
#drupal-off-canvas tr td:first-child,
#drupal-off-canvas tr th:first-child {
padding-left: 20px; /* LTR */
}
[dir="rtl"] #drupal-off-canvas tr td:first-child,
[dir="rtl"] #drupal-off-canvas tr th:first-child {
padding-right: 20px;
}
core/modules/settings_tray/css/off-canvas.tabledrag.css
-122
View File
@@ -1,122 +0,0 @@
/**
* @file
* Table drag behavior for Settings Tray module.
*
* @see tabledrag.js
*/
#drupal-off-canvas .drag {
cursor: move;
}
#drupal-off-canvas tr.region-title {
font-weight: normal;
}
#drupal-off-canvas table .region-message {
color: #fff;
}
#drupal-off-canvas table .region-populated {
display: none;
}
#drupal-off-canvas .add-new .tabledrag-changed {
display: none;
}
#drupal-off-canvas .draggable a.tabledrag-handle {
background-image: none;
margin: 0 5px 0 0;
height: auto;
min-width: 20px;
padding: 0;
overflow: hidden;
float: left; /* LTR */
text-decoration: none;
cursor: move;
}
[dir="rtl"] #drupal-off-canvas .draggable a.tabledrag-handle {
float: right;
margin-right: 0;
margin-left: 5px;
}
#drupal-off-canvas a.tabledrag-handle .handle {
/* Use lighter drag icon against dark background. */
background-color: transparent;
background-image: url(../../../misc/icons/bebebe/move.svg);
background-repeat: no-repeat;
background-position: center;
height: auto;
margin: 0;
padding: 0;
width: auto;
}
#drupal-off-canvas .draggable a.tabledrag-handle:hover .handle,
#drupal-off-canvas .draggable a.tabledrag-handle:focus .handle {
background-image: url(../../../misc/icons/787878/move.svg);
text-decoration: none;
}
#drupal-off-canvas tr td {
transition: background .3s ease;
}
#drupal-off-canvas tr td abbr {
margin-left: 5px; /* LTR */
}
[dir="rtl"] #drupal-off-canvas tr td abbr {
margin-left: 0;
margin-right: 5px;
}
#drupal-off-canvas tr:hover td {
background: #222;
}
#drupal-off-canvas tr.drag td {
background: #111;
}
#drupal-off-canvas tr.drag-previous td {
background: #000;
}
#drupal-off-canvas tr.drag-previous:hover td {
background: #222;
}
body div.tabledrag-changed-warning {
margin-bottom: 0.5em;
font-size: 14px;
}
#drupal-off-canvas .touchevents .draggable td {
padding: 0 10px;
}
#drupal-off-canvas .touchevents .draggable .menu-item__link {
display: inline-block;
padding: 10px 0;
}
#drupal-off-canvas .touchevents a.tabledrag-handle {
height: 44px;
width: 40px;
}
#drupal-off-canvas .touchevents a.tabledrag-handle .handle {
background-position: 40% 19px; /* LTR */
height: 21px;
}
[dir="rtl"] #drupal-off-canvas .touch a.tabledrag-handle .handle {
background-position: right 40% top 19px;
}
#drupal-off-canvas .touchevents .draggable.drag a.tabledrag-handle .handle {
background-position: 50% -32px;
}
#drupal-off-canvas .tabledrag-toggle-weight-wrapper {
padding-top: 10px;
text-align: right; /* LTR */
}
[dir="rtl"] #drupal-off-canvas .tabledrag-toggle-weight-wrapper {
text-align: left;
}
#drupal-off-canvas .indentation {
float: left; /* LTR */
height: auto;
margin: 0 3px 0 -10px; /* LTR */
padding: 0 0 0 10px; /* LTR */
width: auto;
}
[dir="rtl"] #drupal-off-canvas .indentation {
float: right;
margin: 0 -10px 0 3px;
padding: 0 10px 0 0;
}
core/modules/settings_tray/css/off-canvas.theme.css
-93
View File
@@ -1,93 +0,0 @@
/**
* @file
* Styling for the off-canvas ui dialog. Including overrides for jQuery UI.
*/
/* Style the dialog-off-canvas container. */
.ui-dialog.ui-dialog-off-canvas {
background: #444;
border: 0 solid transparent;
border-radius: 0;
box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.3333);
padding: 0;
color: #ddd;
/* Layer the dialog just under the toolbar. */
z-index: 501;
}
/* Style the tray header. */
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
padding: 1em;
background: #2d2d2d;
border: 0;
border-bottom: 1px solid #000;
border-radius: 0;
font-weight: normal;
color: #fff;
}
/* Hide the default jQuery UI dialog close button. */
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close .ui-icon {
visibility: hidden;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close {
background-image: url(../../../misc/icons/bebebe/ex.svg);
background-position: center center;
background-repeat: no-repeat;
background-color: transparent;
border: 0;
position: absolute;
right: 1em;
transition: background .5s ease;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close:hover {
background-image: url(../../../misc/icons/ffffff/ex.svg);
}
[dir="rtl"] .ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close {
left: 1em;
right: auto;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-title {
margin: 0;
/* Push the text away from the icon. */
padding-left: 30px; /* LTR */
padding-right: 0; /* LTR */
/* Ensure that long titles do not overlap the close button. */
max-width: 210px;
font-size: 16px;
font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
text-align: left; /* LTR */
}
[dir="rtl"] .ui-dialog.ui-dialog-off-canvas .ui-dialog-title {
float: right;
text-align: right;
padding-left: 0;
padding-right: 30px;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-title:before {
background: transparent url(../../../misc/icons/ffffff/pencil.svg) no-repeat scroll center center;
background-size: 100% auto;
content: '';
display: block;
height: 100%;
position: absolute;
left: 1em; /* LTR */
top: 0;
width: 20px;
}
[dir="rtl"] .ui-dialog.ui-dialog-off-canvas .ui-dialog-title:before {
left: auto;
right: 1em;
}
/* Override default styling from jQuery UI. */
#drupal-off-canvas .ui-state-default,
#drupal-off-canvas .ui-widget-content .ui-state-default,
#drupal-off-canvas .ui-widget-header .ui-state-default {
border: 0;
font-weight: normal;
font-size: 14px;
color: #333;
}
#drupal-off-canvas .ui-widget-content a {
color: #85bef4;
}
core/modules/settings_tray/css/settings_tray.module.css
+3 -3
View File
@@ -14,10 +14,10 @@
float: right;
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode input {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode input {
pointer-events: none;
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .contextual-links a {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .contextual-links a {
pointer-events: inherit;
}
core/modules/settings_tray/css/settings_tray.motion.css
+5 -5
View File
@@ -8,12 +8,12 @@
/* Transition the edit icon in the toolbar. */
#toolbar-bar.button.toolbar-icon.toolbar-icon.toolbar-icon-edit:before {
transition: all .7s ease;
transition: all 0.7s ease;
}
/* Transition the editables on the page, their contextual links and their hover states. */
.dialog-off-canvas__main-canvas .contextual,
.dialog-off-canvas__main-canvas .js-settings-tray-edit-mode .settings-tray-editable,
.dialog-off-canvas__main-canvas.js-tray-open .js-settings-tray-edit-mode .settings-tray-editable {
transition: all .7s ease;
.dialog-off-canvas-main-canvas .contextual,
.dialog-off-canvas-main-canvas .js-settings-tray-edit-mode .settings-tray-editable,
.dialog-off-canvas-main-canvas.js-off-canvas-dialog-open .js-settings-tray-edit-mode .settings-tray-editable {
transition: all 0.7s ease;
}
core/modules/settings_tray/css/settings_tray.theme.css
+13 -13
View File
@@ -9,7 +9,7 @@
/* Style the edit mode toolbar and tabs. */
#toolbar-bar.js-settings-tray-edit-mode {
background-image: linear-gradient(to bottom,#0c97ed,#1f86c7);
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
}
.js-settings-tray-edit-mode .toolbar-item:not(.toolbar-icon-edit) {
color: #999;
@@ -22,9 +22,9 @@
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item,
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active,
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:focus {
background-color: #50a0e9;
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
color: #ddd;
background-color: #0066a1;
background-image: linear-gradient(to bottom, #0066a1, #005b98);
color: #eee;
text-shadow: none;
font-weight: bold;
outline: none;
@@ -32,13 +32,13 @@
/* Make the hover of the inactive state the same as the active state. */
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item:hover,
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
color: #fff;
}
/* Make the hover of the active state the same as the inactive state. */
.toolbar-tab > .toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
background-color: #2369a6;
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
background-color: #0066a1;
background-image: linear-gradient(to bottom, #0066a1, #005b98);
color: #fff;
}
/* Make the inactive icon grey. */
@@ -60,11 +60,11 @@
}
/* Style the editables while in edit mode. */
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable {
outline: 1px dashed rgba(0,0,0,0.5);
box-shadow: 0 0 0 1px rgba(255,255,255,0.7);
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable {
outline: 1px dashed rgba(0, 0, 0, 0.5);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7);
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable:hover,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable.settings-tray-active-editable {
background-color: rgba(0,0,0,0.2);
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable:hover,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable.settings-tray-active-editable {
background-color: rgba(0, 0, 0, 0.2);
}
core/modules/settings_tray/css/settings_tray.toolbar.css
+8 -9
View File
@@ -20,25 +20,25 @@
/* Style both the edit and editing states of the contextual links toggle tab. */
.toolbar-icon-edit.toolbar-item {
background-color: #50a0e9;
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
background-color: #0066a1;
background-image: linear-gradient(to bottom, #0066a1, #005b98);
color: #eee;
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
font-weight: 700;
-webkit-font-smoothing: antialiased;
}
.toolbar-icon-edit.toolbar-item.is-active {
background-color: #50a0e9;
background-image: linear-gradient(to bottom, #007bc6, #0071b8);
color: #eee;
background-color: #0a7bc1;
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
color: #fff;
text-shadow: 0 1px hsla(0, 0%, 0%, 0.5);
font-weight: 700;
-webkit-font-smoothing: antialiased;
}
.toolbar-tab:hover > .toolbar-icon-edit,
.toolbar-icon-edit:focus .toolbar-item {
background-color: #2369a6;
background-image: linear-gradient(to bottom, #0c97ed, #1f86c7);
background-color: #0a7bc1;
background-image: linear-gradient(to bottom, #0a7bc1, #0a6eb4);
border-color: #1e5c90;
color: #fff;
outline: none;
@@ -59,9 +59,8 @@ button.toolbar-icon.toolbar-icon-edit.toolbar-item:before:focus {
}
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active {
background-image: none;
color: #fff;
}
#toolbar-bar.js-settings-tray-edit-mode button.toolbar-icon.toolbar-icon-edit.toolbar-item.is-active:hover {
background-image: linear-gradient(to bottom, #0094f0, #0e69be);
background-image: linear-gradient(to bottom, #0a6fb4, #0a65aa);
}
core/modules/settings_tray/js/off-canvas.es6.js
-270
View File
@@ -1,270 +0,0 @@
/**
* @file
* Drupal's off-canvas library.
*
* @todo This functionality should extracted into a new core library or a part
* of the current drupal.dialog.ajax library.
* https://www.drupal.org/node/2784443
*
* @private
*/
(($, Drupal, debounce, displace) => {
/**
* Off-canvas dialog implementation using jQuery Dialog.
*
* Transforms the regular dialogs created using Drupal.dialog when the dialog
* element equals '#drupal-off-canvas' into an side-loading dialog.
*
* @namespace
*/
Drupal.offCanvas = {
/**
* The minimum width to use body displace needs to match the width at which
* the tray will be %100 width. @see settings_tray.module.css
* @type {Number}
*/
minDisplaceWidth: 768,
/**
* Wrapper used to position off-canvas dialog.
* @type {jQuery}
*/
$mainCanvasWrapper: $('[data-off-canvas-main-canvas]'),
/**
* Determines if an element is an off-canvas dialog.
*
* @param {jQuery} $element
* The dialog element.
* @return {bool}
* True this is currently an off-canvas dialog.
*/
isOffCanvas($element) {
return $element.is('#drupal-off-canvas');
},
/**
* Remove off-canvas dialog events.
*
* @param {jQuery} $element
* The target element.
*/
removeOffCanvasEvents($element) {
$element.off('.off-canvas');
$(document).off('.off-canvas');
$(window).off('.off-canvas');
},
/**
* Handler fired before an off-canvas dialog has been opened.
* @param {Object} settings
* Settings related to the composition of the dialog.
* @return {undefined}
*/
beforeCreate({ settings, $element }) {
// Clean up previous dialog event handlers.
Drupal.offCanvas.removeOffCanvasEvents($element);
$('body').addClass('js-tray-open');
settings.dialogClass += ' ui-dialog-off-canvas';
// @see http://api.jqueryui.com/position/
settings.position = {
my: 'left top',
at: `${Drupal.offCanvas.getEdge()} top`,
of: window,
};
/**
* Applies initial height to dialog based on window height.
* @see http://api.jqueryui.com/dialog for all dialog options.
*/
settings.height = $(window).height();
},
/**
* Handler fired after an off-canvas dialog has been closed.
* @return {undefined}
*/
beforeClose({ $element }) {
$('body').removeClass('js-tray-open');
// Remove all *.off-canvas events
Drupal.offCanvas.removeOffCanvasEvents($element);
Drupal.offCanvas.$mainCanvasWrapper.css(`padding-${Drupal.offCanvas.getEdge()}`, 0);
},
/**
* Handler fired when an off-canvas dialog has been opened.
* @param {jQuery} $element
* The off-canvas dialog element.
* @param {Object} settings
* Settings related to the composition of the dialog.
* @return {undefined}
*/
afterCreate({ $element, settings }) {
const eventData = { settings, $element, offCanvasDialog: this };
$element
.on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.handleDialogResize)
.on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.bodyPadding);
Drupal.offCanvas.getContainer($element).attr(`data-offset-${Drupal.offCanvas.getEdge()}`, '');
$(window)
.on('resize.off-canvas', eventData, debounce(Drupal.offCanvas.resetSize, 100))
.trigger('resize.off-canvas');
},
/**
* Toggle classes based on title existence.
* Called with Drupal.offCanvas.afterCreate.
* @param {Object} settings
* Settings related to the composition of the dialog.
* @return {undefined}
*/
render({ settings }) {
$('.ui-dialog-off-canvas, .ui-dialog-off-canvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title);
},
/**
* Adjusts the dialog on resize.
*
* @param {jQuery.Event} event
* The event triggered.
* @param {object} event.data
* Data attached to the event.
*/
handleDialogResize(event) {
const $element = event.data.$element;
const $container = Drupal.offCanvas.getContainer($element);
const $offsets = $container.find('> :not(#drupal-off-canvas, .ui-resizable-handle)');
let offset = 0;
// Let scroll element take all the height available.
$element.css({ height: 'auto' });
const modalHeight = $container.height();
$offsets.each((i, e) => {
offset += $(e).outerHeight();
});
// Take internal padding into account.
const scrollOffset = $element.outerHeight() - $element.height();
$element.height(modalHeight - offset - scrollOffset);
},
/**
* Resets the size of the dialog.
*
* @param {jQuery.Event} event
* The event triggered.
* @param {object} event.data
* Data attached to the event.
*/
resetSize(event) {
const offsets = displace.offsets;
const $element = event.data.$element;
const container = Drupal.offCanvas.getContainer($element);
const topPosition = (offsets.top !== 0 ? `+${offsets.top}` : '');
const adjustedOptions = {
// @see http://api.jqueryui.com/position/
position: {
my: `${Drupal.offCanvas.getEdge()} top`,
at: `${Drupal.offCanvas.getEdge()} top${topPosition}`,
of: window,
},
};
container.css({
position: 'fixed',
height: `${$(window).height() - (offsets.top + offsets.bottom)}px`,
});
$element
.dialog('option', adjustedOptions)
.trigger('dialogContentResize.off-canvas');
},
/**
* Adjusts the body padding when the dialog is resized.
*
* @param {jQuery.Event} event
* The event triggered.
* @param {object} event.data
* Data attached to the event.
*/
bodyPadding(event) {
if ($('body').outerWidth() < Drupal.offCanvas.minDisplaceWidth) {
return;
}
const $element = event.data.$element;
const $container = Drupal.offCanvas.getContainer($element);
const $mainCanvasWrapper = Drupal.offCanvas.$mainCanvasWrapper;
const width = $container.outerWidth();
const mainCanvasPadding = $mainCanvasWrapper.css(`padding-${Drupal.offCanvas.getEdge()}`);
if (width !== mainCanvasPadding) {
$mainCanvasWrapper.css(`padding-${Drupal.offCanvas.getEdge()}`, `${width}px`);
$container.attr(`data-offset-${Drupal.offCanvas.getEdge()}`, width);
displace();
}
},
/**
* The HTML element that surrounds the dialog.
* @param {HTMLElement} $element
* The dialog element.
*
* @return {HTMLElement}
* The containing element.
*/
getContainer($element) {
return $element.dialog('widget');
},
/**
* The edge of the screen that the dialog should appear on.
*
* @return {string}
* The edge the tray will be shown on, left or right.
*/
getEdge() {
return document.documentElement.dir === 'rtl' ? 'left' : 'right';
},
};
/**
* Attaches off-canvas dialog behaviors.
*
* @type {Drupal~behavior}
*
* @prop {Drupal~behaviorAttach} attach
* Attaches event listeners for off-canvas dialogs.
*/
Drupal.behaviors.offCanvasEvents = {
attach: () => {
$(window).once('off-canvas').on({
'dialog:beforecreate': (event, dialog, $element, settings) => {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.beforeCreate({ dialog, $element, settings });
}
},
'dialog:aftercreate': (event, dialog, $element, settings) => {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.render({ dialog, $element, settings });
Drupal.offCanvas.afterCreate({ $element, settings });
}
},
'dialog:beforeclose': (event, dialog, $element) => {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.beforeClose({ dialog, $element });
}
},
});
},
};
})(jQuery, Drupal, Drupal.debounce, Drupal.displace);
core/modules/settings_tray/js/off-canvas.js
-149
View File
@@ -1,149 +0,0 @@
/**
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/2815083
* @preserve
**/
(function ($, Drupal, debounce, displace) {
Drupal.offCanvas = {
minDisplaceWidth: 768,
$mainCanvasWrapper: $('[data-off-canvas-main-canvas]'),
isOffCanvas: function isOffCanvas($element) {
return $element.is('#drupal-off-canvas');
},
removeOffCanvasEvents: function removeOffCanvasEvents($element) {
$element.off('.off-canvas');
$(document).off('.off-canvas');
$(window).off('.off-canvas');
},
beforeCreate: function beforeCreate(_ref) {
var settings = _ref.settings,
$element = _ref.$element;
Drupal.offCanvas.removeOffCanvasEvents($element);
$('body').addClass('js-tray-open');
settings.dialogClass += ' ui-dialog-off-canvas';
settings.position = {
my: 'left top',
at: Drupal.offCanvas.getEdge() + ' top',
of: window
};
settings.height = $(window).height();
},
beforeClose: function beforeClose(_ref2) {
var $element = _ref2.$element;
$('body').removeClass('js-tray-open');
Drupal.offCanvas.removeOffCanvasEvents($element);
Drupal.offCanvas.$mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge(), 0);
},
afterCreate: function afterCreate(_ref3) {
var $element = _ref3.$element,
settings = _ref3.settings;
var eventData = { settings: settings, $element: $element, offCanvasDialog: this };
$element.on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.handleDialogResize).on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.bodyPadding);
Drupal.offCanvas.getContainer($element).attr('data-offset-' + Drupal.offCanvas.getEdge(), '');
$(window).on('resize.off-canvas', eventData, debounce(Drupal.offCanvas.resetSize, 100)).trigger('resize.off-canvas');
},
render: function render(_ref4) {
var settings = _ref4.settings;
$('.ui-dialog-off-canvas, .ui-dialog-off-canvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title);
},
handleDialogResize: function handleDialogResize(event) {
var $element = event.data.$element;
var $container = Drupal.offCanvas.getContainer($element);
var $offsets = $container.find('> :not(#drupal-off-canvas, .ui-resizable-handle)');
var offset = 0;
$element.css({ height: 'auto' });
var modalHeight = $container.height();
$offsets.each(function (i, e) {
offset += $(e).outerHeight();
});
var scrollOffset = $element.outerHeight() - $element.height();
$element.height(modalHeight - offset - scrollOffset);
},
resetSize: function resetSize(event) {
var offsets = displace.offsets;
var $element = event.data.$element;
var container = Drupal.offCanvas.getContainer($element);
var topPosition = offsets.top !== 0 ? '+' + offsets.top : '';
var adjustedOptions = {
position: {
my: Drupal.offCanvas.getEdge() + ' top',
at: Drupal.offCanvas.getEdge() + ' top' + topPosition,
of: window
}
};
container.css({
position: 'fixed',
height: $(window).height() - (offsets.top + offsets.bottom) + 'px'
});
$element.dialog('option', adjustedOptions).trigger('dialogContentResize.off-canvas');
},
bodyPadding: function bodyPadding(event) {
if ($('body').outerWidth() < Drupal.offCanvas.minDisplaceWidth) {
return;
}
var $element = event.data.$element;
var $container = Drupal.offCanvas.getContainer($element);
var $mainCanvasWrapper = Drupal.offCanvas.$mainCanvasWrapper;
var width = $container.outerWidth();
var mainCanvasPadding = $mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge());
if (width !== mainCanvasPadding) {
$mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge(), width + 'px');
$container.attr('data-offset-' + Drupal.offCanvas.getEdge(), width);
displace();
}
},
getContainer: function getContainer($element) {
return $element.dialog('widget');
},
getEdge: function getEdge() {
return document.documentElement.dir === 'rtl' ? 'left' : 'right';
}
};
Drupal.behaviors.offCanvasEvents = {
attach: function attach() {
$(window).once('off-canvas').on({
'dialog:beforecreate': function dialogBeforecreate(event, dialog, $element, settings) {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.beforeCreate({ dialog: dialog, $element: $element, settings: settings });
}
},
'dialog:aftercreate': function dialogAftercreate(event, dialog, $element, settings) {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.render({ dialog: dialog, $element: $element, settings: settings });
Drupal.offCanvas.afterCreate({ $element: $element, settings: settings });
}
},
'dialog:beforeclose': function dialogBeforeclose(event, dialog, $element) {
if (Drupal.offCanvas.isOffCanvas($element)) {
Drupal.offCanvas.beforeClose({ dialog: dialog, $element: $element });
}
}
});
}
};
})(jQuery, Drupal, Drupal.debounce, Drupal.displace);
core/modules/settings_tray/js/settings_tray.es6.js
+36 -26
View File
@@ -5,7 +5,7 @@
* @private
*/
(function ($, Drupal) {
(($, Drupal) => {
const blockConfigureSelector = '[data-settings-tray-edit]';
const toggleEditSelector = '[data-drupal-settingstray="toggle"]';
const itemsToToggleSelector = '[data-off-canvas-main-canvas], #toolbar-bar, [data-drupal-settingstray="editable"] a, [data-drupal-settingstray="editable"] button';
@@ -81,9 +81,10 @@
if ($editables.length) {
// Use event capture to prevent clicks on links.
document.querySelector('[data-off-canvas-main-canvas]').addEventListener('click', preventClick, true);
// When a click occurs try and find the settings-tray edit link
// and click it.
/**
* When a click occurs try and find the settings-tray edit link
* and click it.
*/
$editables
.not(contextualItemsSelector)
.on('click.settingstray', (e) => {
@@ -148,6 +149,31 @@
setEditModeState(!isInEditMode());
}
/**
* Prepares Ajax links to work with off-canvas and Settings Tray module.
*/
function prepareAjaxLinks() {
// Find all Ajax instances that use the 'off_canvas' renderer.
Drupal.ajax.instances
/**
* If there is an element and the renderer is 'off_canvas' then we want
* to add our changes.
*/
.filter(instance => instance && $(instance.element).attr('data-dialog-renderer') === 'off_canvas')
/**
* Loop through all Ajax instances that use the 'off_canvas' renderer to
* set active editable ID.
*/
.forEach((instance) => {
// Check to make sure existing dialogOptions aren't overridden.
if (!instance.options.data.hasOwnProperty('dialogOptions')) {
instance.options.data.dialogOptions = {};
}
instance.options.data.dialogOptions.settingsTrayActiveEditableId = $(instance.element).parents('.settings-tray-editable').attr('id');
instance.progress = { type: 'fullscreen' };
});
}
/**
* Reacts to contextual links being added.
*
@@ -159,6 +185,11 @@
* @listens event:drupalContextualLinkAdded
*/
$(document).on('drupalContextualLinkAdded', (event, data) => {
/**
* When contextual links are add we need to set extra properties on the
* instances in Drupal.ajax.instances for them to work with Edit Mode.
*/
prepareAjaxLinks();
// When the first contextual link is added to the page set Edit Mode.
$('body').once('settings_tray.edit_mode_init').each(() => {
@@ -168,12 +199,6 @@
}
});
/**
* Bind Ajax behaviors to all items showing the class.
* @todo Fix contextual links to work with use-ajax links in
* https://www.drupal.org/node/2764931.
*/
Drupal.attachBehaviors(data.$el[0]);
/**
* Bind a listener to all 'Quick edit' links for blocks. Click "Edit"
* button in toolbar to force Contextual Edit which starts Settings Tray
@@ -213,21 +238,6 @@
Drupal.behaviors.toggleEditMode = {
attach() {
$(toggleEditSelector).once('settingstray').on('click.settingstray', toggleEditMode);
// Find all Ajax instances that use the 'off_canvas' renderer.
Drupal.ajax.instances
// If there is an element and the renderer is 'off_canvas' then we want
// to add our changes.
.filter(instance => instance && $(instance.element).attr('data-dialog-renderer') === 'off_canvas')
// Loop through all Ajax instances that use the 'off_canvas' renderer to
// set active editable ID.
.forEach((instance) => {
// Check to make sure existing dialogOptions aren't overridden.
if (!('dialogOptions' in instance.options.data)) {
instance.options.data.dialogOptions = {};
}
instance.options.data.dialogOptions.settingsTrayActiveEditableId = $(instance.element).parents('.settings-tray-editable').attr('id');
instance.progress = { type: 'fullscreen' };
});
},
};
@@ -248,4 +258,4 @@
}
},
});
}(jQuery, Drupal));
})(jQuery, Drupal);
core/modules/settings_tray/js/settings_tray.js
+14 -12
View File
@@ -93,7 +93,21 @@
setEditModeState(!isInEditMode());
}
function prepareAjaxLinks() {
Drupal.ajax.instances.filter(function (instance) {
return instance && $(instance.element).attr('data-dialog-renderer') === 'off_canvas';
}).forEach(function (instance) {
if (!instance.options.data.hasOwnProperty('dialogOptions')) {
instance.options.data.dialogOptions = {};
}
instance.options.data.dialogOptions.settingsTrayActiveEditableId = $(instance.element).parents('.settings-tray-editable').attr('id');
instance.progress = { type: 'fullscreen' };
});
}
$(document).on('drupalContextualLinkAdded', function (event, data) {
prepareAjaxLinks();
$('body').once('settings_tray.edit_mode_init').each(function () {
var editMode = localStorage.getItem('Drupal.contextualToolbar.isViewing') === 'false';
if (editMode) {
@@ -101,8 +115,6 @@
}
});
Drupal.attachBehaviors(data.$el[0]);
data.$el.find(blockConfigureSelector).on('click.settingstray', function () {
if (!isInEditMode()) {
$(toggleEditSelector).trigger('click').trigger('click.settings_tray');
@@ -122,16 +134,6 @@
Drupal.behaviors.toggleEditMode = {
attach: function attach() {
$(toggleEditSelector).once('settingstray').on('click.settingstray', toggleEditMode);
Drupal.ajax.instances.filter(function (instance) {
return instance && $(instance.element).attr('data-dialog-renderer') === 'off_canvas';
}).forEach(function (instance) {
if (!('dialogOptions' in instance.options.data)) {
instance.options.data.dialogOptions = {};
}
instance.options.data.dialogOptions.settingsTrayActiveEditableId = $(instance.element).parents('.settings-tray-editable').attr('id');
instance.progress = { type: 'fullscreen' };
});
}
};
core/modules/settings_tray/settings_tray.api.php
+25 -6
View File
@@ -10,9 +10,28 @@
* @{
* Settings Tray API
*
* @section sec_overview Overview and terminology
*
* The Settings Tray module allows blocks to be configured in a sidebar form
* without leaving the page. For example:
*
* - For every block, one can configure whether to display the block title or
* not, and optionally override it (block configuration).
* - For menu blocks, one can configure which menu levels to display (block
* configuration) but also the menu itself (menu configuration).
* - For the site branding block, one can change which branding elements to
* display (block configuration), but also the site name and slogan (simple
* configuration).
*
* Block visibility conditions are not included the sidebar form.
*
* @section sec_api The API: the form in the Settings Tray
*
* By default, every block will show its built-in form in the Settings Tray.
* By default, the Settings Tray shows any block's built-in form in the
* off-canvas dialog.
*
* @see core/misc/dialog/off-canvas.es6.js
*
* However, many blocks would benefit from a tailored form which either:
* - limits the form items displayed in the Settings Tray to only items that
* affect the content of the rendered block
@@ -32,19 +51,19 @@
* @endcode
*
* In some cases, a block's content is not configurable (for example, the title,
* main content, and help blocks). Such blocks can opt out of providing an
* off-canvas form:
* main content, and help blocks). Such blocks can opt out of providing a
* settings_tray form:
* @code
* forms = {
* "settings_tray" = FALSE,
* },
* @endcode
*
* Finally, blocks that do not specify an off-canvas form using the annotation
* Finally, blocks that do not specify a settings_tray form using the annotation
* above will automatically have it set to their plugin class. For example, the
* "Powered by Drupal" block plugin
* (\Drupal\system\Plugin\Block\SystemPoweredByBlock) automatically gets
* this added to its annotation:
* (\Drupal\system\Plugin\Block\SystemPoweredByBlock) automatically gets this
* added to its annotation:
* @code
* forms = {
* "settings_tray" = "\Drupal\system\Plugin\Block\SystemPoweredByBlock",
core/modules/settings_tray/settings_tray.info.yml
+5 -5
View File
@@ -1,7 +1,7 @@
name: 'Settings Tray'
type: module
description: 'Provides the ability to change the most common configuration from the Drupal front-end.'
package: Core (Experimental)
description: 'Provides a sidebar to configure blocks on the page.'
package: Core
# version: VERSION
# core: 8.x
dependencies:
@@ -9,8 +9,8 @@ dependencies:
- toolbar
- contextual
# Information added by Drupal.org packaging script on 2018-01-03
version: '8.4.4'
# Information added by Drupal.org packaging script on 2018-03-07
version: '8.5.0'
core: '8.x'
project: 'drupal'
datestamp: 1515021228
datestamp: 1520457825
core/modules/settings_tray/settings_tray.libraries.yml
-26
View File
@@ -17,29 +17,3 @@ drupal.settings_tray:
- core/drupal
- core/jquery.once
- core/drupal.ajax
drupal.off_canvas:
version: VERSION
js:
js/off-canvas.js: {}
css:
base:
css/off-canvas.reset.css: {}
css/off-canvas.base.css: {}
css/off-canvas.css: {}
css/off-canvas.theme.css: { group: 200 }
component:
css/off-canvas.motion.css: {}
css/off-canvas.button.css: {}
css/off-canvas.form.css: {}
css/off-canvas.table.css: {}
css/off-canvas.details.css: {}
css/off-canvas.tabledrag.css: {}
css/off-canvas.dropbutton.css: {}
dependencies:
- core/jquery
- core/drupal
- core/drupal.ajax
- core/drupal.announce
- core/drupal.dialog
- core/drupal.dialog.ajax
core/modules/settings_tray/settings_tray.links.contextual.yml
+1 -1
View File
@@ -1,6 +1,6 @@
settings_tray.block_configure:
title: 'Quick edit'
route_name: 'entity.block.off_canvas_form'
route_name: 'entity.block.settings_tray_form'
group: 'block'
options:
attributes:
core/modules/settings_tray/settings_tray.module
+54 -79
View File
@@ -7,9 +7,9 @@
use Drupal\Core\Asset\AttachedAssetsInterface;
use Drupal\Core\Routing\RouteMatchInterface;
use Drupal\settings_tray\Block\BlockEntityOffCanvasForm;
use Drupal\settings_tray\Form\SystemBrandingOffCanvasForm;
use Drupal\settings_tray\Form\SystemMenuOffCanvasForm;
use Drupal\block\entity\Block;
use Drupal\block\BlockInterface;
use Drupal\settings_tray\Block\BlockEntitySettingTrayForm;
/**
* Implements hook_help().
@@ -18,10 +18,15 @@ function settings_tray_help($route_name, RouteMatchInterface $route_match) {
switch ($route_name) {
case 'help.page.settings_tray':
$output = '<h3>' . t('About') . '</h3>';
$output .= '<p>' . t('The Settings Tray module provides an \'edit mode\' in which clicking on a block opens a slide-out tray which allows configuration to be altered without leaving the page.For more information, see the <a href=":settings-tray-documentation">online documentation for the Settings Tray module</a>.', [':settings-tray-documentation' => 'https://www.drupal.org/documentation/modules/settings_tray']) . '</p>';
$output .= '<p>' . t('The Settings Tray module allows users with the <a href=":administer_block_permission">Administer blocks</a> and <a href=":contextual_permission">Use contextual links</a> permissions to edit blocks without visiting a separate page. For more information, see the <a href=":handbook_url">online documentation for the Settings Tray module</a>.', [':handbook_url' => 'https://www.drupal.org/documentation/modules/settings_tray', ':administer_block_permission' => \Drupal::url('user.admin_permissions', [], ['fragment' => 'module-block']), ':contextual_permission' => \Drupal::url('user.admin_permissions', [], ['fragment' => 'module-contextual'])]) . '</p>';
$output .= '<h3>' . t('Uses') . '</h3>';
$output .= '<dl>';
$output .= '<dt>' . t('Editing blocks on the same page in the slide-out tray') . '</dt>';
$output .= '<dt>' . t('Editing blocks in place') . '</dt>';
$output .= '<dd>';
$output .= '<p>' . t('To edit blocks in place, either click the <strong>Edit</strong> button in the toolbar and then click on the block, or choose "Quick edit" from the block\'s contextual link. (See the <a href=":contextual">Contextual Links module help</a> for more information about how to use contextual links.)', [':contextual' => \Drupal::url('help.page', ['name' => 'contextual'])]) . '</p>';
$output .= '<p>' . t('The Settings Tray for the block will open in a sidebar, with a compact form for configuring what the block shows.') . '</p>';
$output .= '<p>' . t('Save the form and the changes will be immediately visible on the page.') . '</p>';
$output .= '</dd>';
$output .= '</dl>';
return ['#markup' => $output];
}
@@ -44,14 +49,38 @@ function settings_tray_contextual_links_view_alter(&$element, $items) {
$element['#links']['settings-trayblock-configure']['title'] = t('Quick edit settings');
}
$element['#attached']['library'][] = 'settings_tray/drupal.off_canvas';
$element['#attached']['library'][] = 'core/drupal.dialog.off_canvas';
}
}
/**
* Checks if a block has overrides.
*
* @param \Drupal\block\BlockInterface $block
* The block to check for overrides.
*
* @return bool
* TRUE if the block has overrides otherwise FALSE.
*
* @internal
*/
function _settings_tray_has_block_overrides(BlockInterface $block) {
// @todo Replace the following with $block->hasOverrides() in https://www.drupal.org/project/drupal/issues/2910353
// and remove this function.
return \Drupal::config($block->getEntityType()->getConfigPrefix() . '.' . $block->id())->hasOverrides();
}
/**
* Implements hook_block_view_alter().
*/
function settings_tray_block_view_alter(array &$build) {
if (isset($build['#contextual_links']['block'])) {
// Ensure that contextual links vary by whether the block has config overrides
// or not.
// @see _contextual_links_to_id()
$build['#contextual_links']['block']['metadata']['has_overrides'] = _settings_tray_has_block_overrides($build['#block']) ? 1 : 0;
}
// Force a new 'data-contextual-id' attribute on blocks when this module is
// enabled so as not to reuse stale data cached client-side.
// @todo Remove when https://www.drupal.org/node/2773591 is fixed.
@@ -60,46 +89,26 @@ function settings_tray_block_view_alter(array &$build) {
];
}
/**
* Implements hook_element_info_alter().
*/
function settings_tray_element_info_alter(&$type) {
if (isset($type['page'])) {
$type['page']['#theme_wrappers']['settings_tray_page_wrapper'] = ['#weight' => -1000];
}
}
/**
* Implements hook_theme().
*/
function settings_tray_theme() {
return [
'settings_tray_page_wrapper' => [
'variables' => ['children' => NULL],
],
];
}
/**
* Implements hook_entity_type_build().
*/
function settings_tray_entity_type_build(array &$entity_types) {
/* @var $entity_types \Drupal\Core\Entity\EntityTypeInterface[] */
$entity_types['block']
->setFormClass('off_canvas', BlockEntityOffCanvasForm::class)
->setLinkTemplate('off_canvas-form', '/admin/structure/block/manage/{block}/off-canvas');
->setFormClass('settings_tray', BlockEntitySettingTrayForm::class)
->setLinkTemplate('settings_tray-form', '/admin/structure/block/manage/{block}/settings-tray');
}
/**
* Implements hook_preprocess_HOOK() for block templates.
*/
function settings_tray_preprocess_block(&$variables) {
// Only blocks that have an settings_tray form will have a "Quick Edit" link.
// We could wait for the contextual links to be initialized on the client
// side, and then add the class and data- attribute below there (via
// JavaScript). But that would mean that it would be impossible to show
// Settings Tray's clickable regions immediately when the page loads. When
// latency is high, this will cause flicker.
// Only blocks that have a settings_tray form and have no configuration
// overrides will have a "Quick Edit" link. We could wait for the contextual
// links to be initialized on the client side, and then add the class and
// data- attribute below there (via JavaScript). But that would mean that it
// would be impossible to show Settings Tray's clickable regions immediately
// when the page loads. When latency is high, this will cause flicker.
// @see \Drupal\settings_tray\Access\BlockPluginHasSettingsTrayFormAccessCheck
/** @var \Drupal\settings_tray\Access\BlockPluginHasSettingsTrayFormAccessCheck $access_checker */
$access_checker = \Drupal::service('access_check.settings_tray.block.settings_tray_form');
@@ -107,10 +116,13 @@ function settings_tray_preprocess_block(&$variables) {
$block_plugin_manager = \Drupal::service('plugin.manager.block');
/** @var \Drupal\Core\Block\BlockPluginInterface $block_plugin */
$block_plugin = $block_plugin_manager->createInstance($variables['plugin_id']);
if ($access_checker->accessBlockPlugin($block_plugin)->isAllowed()) {
// Add class and attributes to all blocks to allow Javascript to target.
$variables['attributes']['class'][] = 'settings-tray-editable';
$variables['attributes']['data-drupal-settingstray'] = 'editable';
if (isset($variables['elements']['#contextual_links']['block']['route_parameters']['block'])) {
$block = Block::load($variables['elements']['#contextual_links']['block']['route_parameters']['block']);
if ($access_checker->accessBlockPlugin($block_plugin)->isAllowed() && !_settings_tray_has_block_overrides($block)) {
// Add class and attributes to all blocks to allow Javascript to target.
$variables['attributes']['class'][] = 'settings-tray-editable';
$variables['attributes']['data-drupal-settingstray'] = 'editable';
}
}
}
@@ -153,47 +165,10 @@ function settings_tray_toolbar_alter(&$items) {
*/
function settings_tray_block_alter(&$definitions) {
foreach ($definitions as &$definition) {
// If a block plugin already defines its own 'settings_tray' form, use that
// form instead of specifying one here.
if (isset($definition['forms']['settings_tray'])) {
continue;
}
switch ($definition['id']) {
// Use specialized forms for certain blocks that do not yet provide the
// form with their own annotation.
// @todo Move these into the corresponding block plugin annotations in
// https://www.drupal.org/node/2896356.
case 'system_menu_block':
$definition['forms']['settings_tray'] = SystemMenuOffCanvasForm::class;
break;
case 'system_branding_block':
$definition['forms']['settings_tray'] = SystemBrandingOffCanvasForm::class;
break;
// No off-canvas form for the page title block, despite it having
// contextual links: it's too confusing that you're editing configuration,
// not content, so the title itself cannot actually be changed.
// @todo Move these into the corresponding block plugin annotations in
// https://www.drupal.org/node/2896356.
case 'page_title_block':
$definition['forms']['settings_tray'] = FALSE;
break;
case 'system_main_block':
$definition['forms']['settings_tray'] = FALSE;
break;
case 'help_block':
$definition['forms']['settings_tray'] = FALSE;
break;
// Otherwise, use the block plugin's normal form rather than
// a custom form for Settings Tray.
default:
$definition['forms']['settings_tray'] = $definition['class'];
break;
// If a block plugin does not define its own 'settings_tray' form, use the
// plugin class itself.
if (!isset($definition['forms']['settings_tray'])) {
$definition['forms']['settings_tray'] = $definition['class'];
}
}
}
core/modules/settings_tray/settings_tray.routing.yml
+12 -4
View File
@@ -1,8 +1,16 @@
entity.block.off_canvas_form:
path: '/admin/structure/block/manage/{block}/off-canvas'
entity.block.settings_tray_form:
path: '/admin/structure/block/manage/{block}/settings-tray'
defaults:
_entity_form: 'block.off_canvas'
_title_callback: '\Drupal\settings_tray\Block\BlockEntityOffCanvasForm::title'
_entity_form: 'block.settings_tray'
_title_callback: '\Drupal\settings_tray\Block\BlockEntitySettingTrayForm::title'
requirements:
_permission: 'administer blocks'
_access_block_plugin_has_settings_tray_form: 'TRUE'
_access_block_has_overrides_settings_tray_form: 'TRUE'
# Deprecated.
# @see entity.block.settings_tray_form
# @see \Drupal\settings_tray\RouteProcessor\BlockEntityOffCanvasFormRouteProcessorBC
# @todo Remove in Drupal 9.0.0.
entity.block.off_canvas_form:
path: ''
core/modules/settings_tray/settings_tray.services.yml
+12 -5
View File
@@ -1,11 +1,18 @@
services:
main_content_renderer.off_canvas:
class: Drupal\settings_tray\Render\MainContent\OffCanvasRenderer
arguments: ['@title_resolver', '@renderer']
access_check.settings_tray.block.has_overrides:
class: Drupal\settings_tray\Access\BlockHasOverridesAccessCheck
tags:
- { name: render.main_content_renderer, format: drupal_dialog.off_canvas }
- { name: access_check, applies_to: _access_block_has_overrides_settings_tray_form }
access_check.settings_tray.block.settings_tray_form:
class: Drupal\settings_tray\Access\BlockPluginHasSettingsTrayFormAccessCheck
tags:
- { name: access_check, applies_to: _access_block_plugin_has_settings_tray_form }
# BC layers.
# @todo Remove in Drupal 9.0.0.
settings_tray.route_processor_off_canvas_form_bc:
class: \Drupal\settings_tray\RouteProcessor\BlockEntityOffCanvasFormRouteProcessorBC
arguments: ['@router.route_provider']
public: false
tags:
- { name: route_processor_outbound }
core/modules/settings_tray/src/Access/BlockHasOverridesAccessCheck.php
+29
View File
@@ -0,0 +1,29 @@
<?php
namespace Drupal\settings_tray\Access;
use Drupal\block\BlockInterface;
use Drupal\Core\Access\AccessResult;
use Drupal\Core\Routing\Access\AccessInterface;
/**
* Determines whether the requested block has a 'settings_tray' form.
*
* @internal
*/
class BlockHasOverridesAccessCheck implements AccessInterface {
/**
* Checks access for accessing a block's 'settings_tray' form.
*
* @param \Drupal\block\BlockInterface $block
* The block whose 'settings_tray' form is being accessed.
*
* @return \Drupal\Core\Access\AccessResultInterface
* The access result.
*/
public function access(BlockInterface $block) {
return AccessResult::allowedIf(!_settings_tray_has_block_overrides($block));
}
}
core/modules/settings_tray/src/Ajax/OpenOffCanvasDialogCommand.php
-73
View File
@@ -1,73 +0,0 @@
<?php
namespace Drupal\settings_tray\Ajax;
use Drupal\Core\Ajax\OpenDialogCommand;
/**
* Defines an AJAX command to open content in a dialog in a off-canvas dialog.
*
* @ingroup ajax
*
* @internal
*/
class OpenOffCanvasDialogCommand extends OpenDialogCommand {
/**
* The dialog width to use if none is provided.
*/
const DEFAULT_DIALOG_WIDTH = 300;
/**
* Constructs an OpenOffCanvasDialogCommand object.
*
* The off-canvas dialog differs from the normal modal provided by
* OpenDialogCommand in that a off-canvas has built in positioning and
* behaviours. Drupal provides a built-in off-canvas dialog for this purpose,
* so the selector is hard-coded in the call to the parent constructor.
*
* @param string $title
* The title of the dialog.
* @param string|array $content
* The content that will be placed in the dialog, either a render array
* or an HTML string.
* @param array $dialog_options
* (optional) Settings to be passed to the dialog implementation. Any
* jQuery UI option can be used. See http://api.jqueryui.com/dialog.
* @param array|null $settings
* (optional) Custom settings that will be passed to the Drupal behaviors
* on the content of the dialog. If left empty, the settings will be
* populated automatically from the current request.
*/
public function __construct($title, $content, array $dialog_options = [], $settings = NULL) {
parent::__construct('#drupal-off-canvas', $title, $content, $dialog_options, $settings);
$this->dialogOptions['modal'] = FALSE;
$this->dialogOptions['autoResize'] = FALSE;
$this->dialogOptions['resizable'] = 'w';
$this->dialogOptions['draggable'] = FALSE;
$this->dialogOptions['drupalAutoButtons'] = FALSE;
// @todo drupal.ajax.js does not respect drupalAutoButtons properly, pass an
// empty set of buttons until https://www.drupal.org/node/2793343 is in.
$this->dialogOptions['buttons'] = [];
if (empty($dialog_options['dialogClass'])) {
$this->dialogOptions['dialogClass'] = 'ui-dialog-off-canvas';
}
// If no width option is provided then use the default width to avoid the
// dialog staying at the width of the previous instance when opened
// more than once, with different widths, on a single page.
if (!isset($this->dialogOptions['width'])) {
$this->dialogOptions['width'] = static::DEFAULT_DIALOG_WIDTH;
}
}
/**
* {@inheritdoc}
*/
public function render() {
$build = parent::render();
$build['effect'] = 'fade';
$build['speed'] = 1000;
return $build;
}
}
core/modules/settings_tray/src/Block/BlockEntityOffCanvasForm.php → core/modules/settings_tray/src/Block/BlockEntitySettingTrayForm.php
+1 -1
View File
@@ -21,7 +21,7 @@ use Drupal\Core\Url;
*
* @internal
*/
class BlockEntityOffCanvasForm extends BlockForm {
class BlockEntitySettingTrayForm extends BlockForm {
/**
* Provides a title callback to get the block's admin label.
core/modules/settings_tray/src/Form/SystemBrandingOffCanvasForm.php
-106
View File
@@ -1,106 +0,0 @@
<?php
namespace Drupal\settings_tray\Form;
use Drupal\Core\Config\ConfigFactoryInterface;
use Drupal\Core\DependencyInjection\ContainerInjectionInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Plugin\PluginFormBase;
use Symfony\Component\DependencyInjection\ContainerInterface;
/**
* The off-canvas form handler for the SystemBrandingBlock.
*
* @see settings_tray_block_alter()
*
* @internal
*/
class SystemBrandingOffCanvasForm extends PluginFormBase implements ContainerInjectionInterface {
/**
* The block plugin.
*
* @var \Drupal\Core\Block\BlockPluginInterface
*/
protected $plugin;
/**
* The config factory.
*
* @var \Drupal\Core\Config\ConfigFactoryInterface
*/
protected $configFactory;
/**
* SystemBrandingOffCanvasForm constructor.
*
* @param \Drupal\Core\Config\ConfigFactoryInterface $config_factory
* The config factory.
*/
public function __construct(ConfigFactoryInterface $config_factory) {
$this->configFactory = $config_factory;
}
/**
* {@inheritdoc}
*/
public static function create(ContainerInterface $container) {
return new static(
$container->get('config.factory')
);
}
/**
* {@inheritdoc}
*/
public function buildConfigurationForm(array $form, FormStateInterface $form_state) {
$form = $this->plugin->buildConfigurationForm($form, $form_state);
$form['block_branding']['#type'] = 'details';
$form['block_branding']['#weight'] = 10;
// Unset links to Site Information form, we can make these changes here.
unset($form['block_branding']['use_site_name']['#description'], $form['block_branding']['use_site_slogan']['#description']);
$site_config = $this->configFactory->getEditable('system.site');
$form['site_information'] = [
'#type' => 'details',
'#title' => t('Site details'),
'#open' => TRUE,
];
$form['site_information']['site_name'] = [
'#type' => 'textfield',
'#title' => t('Site name'),
'#default_value' => $site_config->get('name'),
'#required' => TRUE,
];
$form['site_information']['site_slogan'] = [
'#type' => 'textfield',
'#title' => t('Slogan'),
'#default_value' => $site_config->get('slogan'),
'#description' => t("How this is used depends on your site's theme."),
];
return $form;
}
/**
* {@inheritdoc}
*/
public function validateConfigurationForm(array &$form, FormStateInterface $form_state) {
$this->plugin->validateConfigurationForm($form, $form_state);
}
/**
* {@inheritdoc}
*/
public function submitConfigurationForm(array &$form, FormStateInterface $form_state) {
$site_info = $form_state->getValue('site_information');
$this->configFactory->getEditable('system.site')
->set('name', $site_info['site_name'])
->set('slogan', $site_info['site_slogan'])
->save();
$this->plugin->submitConfigurationForm($form, $form_state);
}
}
core/modules/settings_tray/src/Form/SystemMenuOffCanvasForm.php
-153
View File
@@ -1,153 +0,0 @@
<?php
namespace Drupal\settings_tray\Form;
use Drupal\Component\Plugin\PluginInspectionInterface;
use Drupal\Core\DependencyInjection\ContainerInjectionInterface;
use Drupal\Core\Entity\EntityStorageInterface;
use Drupal\Core\Entity\EntityTypeManagerInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Plugin\PluginFormBase;
use Drupal\Core\Render\Element;
use Drupal\Core\Routing\RedirectDestinationTrait;
use Drupal\Core\StringTranslation\StringTranslationTrait;
use Drupal\Core\StringTranslation\TranslationInterface;
use Drupal\system\MenuInterface;
use Symfony\Component\DependencyInjection\ContainerInterface;
/**
* The off-canvas form handler for the SystemMenuBlock.
*
* @see settings_tray_block_alter()
*
* @internal
*/
class SystemMenuOffCanvasForm extends PluginFormBase implements ContainerInjectionInterface {
use StringTranslationTrait;
use RedirectDestinationTrait;
/**
* The plugin.
*
* @var \Drupal\Core\Block\BlockPluginInterface
*/
protected $plugin;
/**
* The menu entity that the block uses and that will be edited in this form.
*
* @var \Drupal\system\MenuInterface
*/
protected $menu;
/**
* @var \Drupal\Core\Entity\EntityStorageInterface
*/
protected $menuStorage;
/**
* @var \Drupal\Core\Entity\EntityTypeManagerInterface
*/
protected $entityTypeManager;
/**
* SystemMenuOffCanvasForm constructor.
*
* @param \Drupal\Core\Entity\EntityStorageInterface $menu_storage
* @param \Drupal\Core\Entity\EntityTypeManagerInterface $entity_type_manager
* @param \Drupal\Core\StringTranslation\TranslationInterface $string_translation
*/
public function __construct(EntityStorageInterface $menu_storage, EntityTypeManagerInterface $entity_type_manager, TranslationInterface $string_translation) {
$this->menuStorage = $menu_storage;
$this->entityTypeManager = $entity_type_manager;
$this->stringTranslation = $string_translation;
}
/**
* {@inheritdoc}
*/
public static function create(ContainerInterface $container) {
return new static(
$container->get('entity_type.manager')->getStorage('menu'),
$container->get('entity_type.manager'),
$container->get('string_translation')
);
}
/**
* {@inheritdoc}
*/
public function buildConfigurationForm(array $form, FormStateInterface $form_state) {
$form = $this->plugin->buildConfigurationForm([], $form_state);
// Move the menu levels section to the bottom.
$form['menu_levels']['#weight'] = 100;
$form['entity_form'] = [
'#type' => 'details',
'#title' => $this->t('Edit menu %label', ['%label' => $this->menu->label()]),
'#open' => TRUE,
];
$form['entity_form'] += $this->getEntityForm($this->menu)->buildForm([], $form_state);
// Print the menu link titles as text instead of a link.
if (!empty($form['entity_form']['links']['links'])) {
foreach (Element::children($form['entity_form']['links']['links']) as $child) {
$title = $form['entity_form']['links']['links'][$child]['title'][1]['#title'];
$form['entity_form']['links']['links'][$child]['title'][1] = ['#markup' => $title];
}
}
// Change the header text.
$form['entity_form']['links']['links']['#header'][0] = $this->t('Link');
$form['entity_form']['links']['links']['#header'][1]['data'] = $this->t('On');
// Remove the label, ID, description, and buttons from the entity form.
unset($form['entity_form']['label'], $form['entity_form']['id'], $form['entity_form']['description'], $form['entity_form']['actions']);
// Since the overview form is further nested than expected, update the
// #parents. See \Drupal\menu_ui\MenuForm::form().
$form_state->set('menu_overview_form_parents', ['settings', 'entity_form', 'links']);
return $form;
}
/**
* {@inheritdoc}
*/
public function validateConfigurationForm(array &$form, FormStateInterface $form_state) {
$this->plugin->validateConfigurationForm($form, $form_state);
$this->getEntityForm($this->menu)->validateForm($form, $form_state);
}
/**
* {@inheritdoc}
*/
public function submitConfigurationForm(array &$form, FormStateInterface $form_state) {
$this->plugin->submitConfigurationForm($form, $form_state);
$this->getEntityForm($this->menu)->submitForm($form, $form_state);
$this->menu->save();
}
/**
* Gets the entity form for this menu.
*
* @param \Drupal\system\MenuInterface $menu
* The menu entity.
*
* @return \Drupal\Core\Entity\EntityFormInterface
* The entity form.
*/
protected function getEntityForm(MenuInterface $menu) {
$entity_form = $this->entityTypeManager->getFormObject('menu', 'edit');
$entity_form->setEntity($menu);
return $entity_form;
}
/**
* {@inheritdoc}
*/
public function setPlugin(PluginInspectionInterface $plugin) {
$this->plugin = $plugin;
$this->menu = $this->menuStorage->load($this->plugin->getDerivativeId());
}
}
core/modules/settings_tray/src/Render/MainContent/OffCanvasRenderer.php
-63
View File
@@ -1,63 +0,0 @@
<?php
namespace Drupal\settings_tray\Render\MainContent;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Controller\TitleResolverInterface;
use Drupal\Core\Render\MainContent\DialogRenderer;
use Drupal\Core\Render\RendererInterface;
use Drupal\Core\Routing\RouteMatchInterface;
use Drupal\settings_tray\Ajax\OpenOffCanvasDialogCommand;
use Symfony\Component\HttpFoundation\Request;
/**
* Default main content renderer for off-canvas dialog requests.
*
* @internal
*/
class OffCanvasRenderer extends DialogRenderer {
/**
* The renderer.
*
* @var \Drupal\Core\Render\RendererInterface
*/
protected $renderer;
/**
* Constructs a new OffCanvasRenderer.
*
* @param \Drupal\Core\Controller\TitleResolverInterface $title_resolver
* The title resolver.
* @param \Drupal\Core\Render\RendererInterface $renderer
* The renderer.
*/
public function __construct(TitleResolverInterface $title_resolver, RendererInterface $renderer) {
parent::__construct($title_resolver);
$this->renderer = $renderer;
}
/**
* {@inheritdoc}
*/
public function renderResponse(array $main_content, Request $request, RouteMatchInterface $route_match) {
$response = new AjaxResponse();
// First render the main content, because it might provide a title.
$content = $this->renderer->renderRoot($main_content);
// Attach the library necessary for using the OpenOffCanvasDialogCommand and
// set the attachments for this Ajax response.
$main_content['#attached']['library'][] = 'settings_tray/drupal.off_canvas';
$response->setAttachments($main_content['#attached']);
// If the main content doesn't provide a title, use the title resolver.
$title = isset($main_content['#title']) ? $main_content['#title'] : $this->titleResolver->getTitle($request, $route_match->getRouteObject());
// Determine the title: use the title provided by the main content if any,
// otherwise get it from the routing information.
$options = $request->request->get('dialogOptions', []);
$response->addCommand(new OpenOffCanvasDialogCommand($title, $content, $options));
return $response;
}
}
core/modules/settings_tray/src/RouteProcessor/BlockEntityOffCanvasFormRouteProcessorBC.php
+65
View File
@@ -0,0 +1,65 @@
<?php
namespace Drupal\settings_tray\RouteProcessor;
use Drupal\Core\Render\BubbleableMetadata;
use Drupal\Core\RouteProcessor\OutboundRouteProcessorInterface;
use Drupal\Core\Routing\RouteProviderInterface;
use Symfony\Component\Routing\Route;
/**
* Processes the Block entity off-canvas form BC route.
*
* @internal
*/
class BlockEntityOffCanvasFormRouteProcessorBC implements OutboundRouteProcessorInterface {
/**
* The route provider.
*
* @var \Drupal\Core\Routing\RouteProviderInterface
*/
protected $routeProvider;
/**
* Constructs a BlockEntityOffCanvasFormRouteProcessorBC object.
*
* @param \Drupal\Core\Routing\RouteProviderInterface $route_provider
* The route provider.
*/
public function __construct(RouteProviderInterface $route_provider) {
$this->routeProvider = $route_provider;
}
/**
* {@inheritdoc}
*/
public function processOutbound($route_name, Route $route, array &$parameters, BubbleableMetadata $bubbleable_metadata = NULL) {
if ($route_name === 'entity.block.off_canvas_form') {
$redirected_route_name = 'entity.block.settings_tray_form';
@trigger_error(sprintf("The '%s' route is deprecated since version 8.5.x and will be removed in 9.0.0. Use the '%s' route instead.", $route_name, $redirected_route_name), E_USER_DEPRECATED);
static::overwriteRoute($route, $this->routeProvider->getRouteByName($redirected_route_name));
}
}
/**
* Overwrites one route's metadata with the other's.
*
* @param \Symfony\Component\Routing\Route $target_route
* The route whose metadata to overwrite.
* @param \Symfony\Component\Routing\Route $source_route
* The route whose metadata to read from.
*
* @see \Symfony\Component\Routing\Route
*/
protected static function overwriteRoute(Route $target_route, Route $source_route) {
$target_route->setPath($source_route->getPath());
$target_route->setDefaults($source_route->getDefaults());
$target_route->setRequirements($source_route->getRequirements());
$target_route->setOptions($source_route->getOptions());
$target_route->setHost($source_route->getHost());
$target_route->setSchemes($source_route->getSchemes());
$target_route->setMethods($source_route->getMethods());
}
}
core/modules/settings_tray/templates/settings-tray-page-wrapper.html.twig
-26
View File
@@ -1,26 +0,0 @@
{#
/**
* @file
* Default theme implementation for a page wrapper.
*
* For consistent wrapping to {{ page }} render in all themes. The
* "data-off-canvas-main-canvas" attribute is required by the off-canvas dialog.
* This is used by the settings_tray/drupal.off_canvas library to select the
* "main canvas" page element as opposed to the "off canvas" which is the tray
* itself. The "main canvas" element must be resized according to the width of
* the "off canvas" tray so that no portion of the "main canvas" is obstructed
* by the tray. The tray can vary in width when opened and can be resized by the
* user. The "data-off-canvas-main-canvas" attribute cannot be removed without
* breaking the off-canvas dialog functionality.
*
* Available variables:
* - children: Contains the child elements of the page.
*
* @ingroup themeable
*/
#}
{% if children %}
<div class="dialog-off-canvas__main-canvas" data-off-canvas-main-canvas >
{{ children }}
</div>
{% endif %}
core/modules/settings_tray/tests/modules/off_canvas_test/off_canvas_test.info.yml
-15
View File
@@ -1,15 +0,0 @@
name: 'Off-canvas tests'
type: module
description: 'Provides off-canvas test links.'
package: Testing
# version: VERSION
# core: 8.x
dependencies:
- block
- settings_tray
# Information added by Drupal.org packaging script on 2018-01-03
version: '8.4.4'
core: '8.x'
project: 'drupal'
datestamp: 1515021228
core/modules/settings_tray/tests/modules/off_canvas_test/off_canvas_test.routing.yml
-29
View File
@@ -1,29 +0,0 @@
off_canvas_test.links:
path: '/off-canvas-test-links'
defaults:
_controller: '\Drupal\off_canvas_test\Controller\TestController::linksDisplay'
_title: 'Links'
requirements:
_access: 'TRUE'
off_canvas_test.thing1:
path: '/off-canvas-thing1'
defaults:
_controller: '\Drupal\off_canvas_test\Controller\TestController::thing1'
_title: 'Thing 1'
requirements:
_access: 'TRUE'
off_canvas_test.thing2:
path: '/off-canvas-thing2'
defaults:
_controller: '\Drupal\off_canvas_test\Controller\TestController::thing2'
requirements:
_access: 'TRUE'
off_canvas_test.dialog_links:
path: '/off-canvas-dialog-links'
defaults:
_controller: '\Drupal\off_canvas_test\Controller\TestController::otherDialogLinks'
requirements:
_access: 'TRUE'
core/modules/settings_tray/tests/modules/off_canvas_test/src/Controller/TestController.php
-140
View File
@@ -1,140 +0,0 @@
<?php
namespace Drupal\off_canvas_test\Controller;
use Drupal\Component\Serialization\Json;
use Drupal\Core\Url;
/**
* Test controller for 2 different responses.
*/
class TestController {
/**
* Thing1.
*
* @return string
* Return Hello string.
*/
public function thing1() {
return [
'#type' => 'markup',
'#markup' => 'Thing 1 says hello',
];
}
/**
* Thing2.
*
* @return string
* Return Hello string.
*/
public function thing2() {
return [
'#type' => 'markup',
'#markup' => 'Thing 2 says hello',
];
}
/**
* Displays test links that will open in off-canvas dialog.
*
* @return array
* Render array with links.
*/
public function linksDisplay() {
return [
'off_canvas_link_1' => [
'#title' => 'Click Me 1!',
'#type' => 'link',
'#url' => Url::fromRoute('off_canvas_test.thing1'),
'#attributes' => [
'class' => ['use-ajax'],
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
],
'off_canvas_link_2' => [
'#title' => 'Click Me 2!',
'#type' => 'link',
'#url' => Url::fromRoute('off_canvas_test.thing2'),
'#attributes' => [
'class' => ['use-ajax'],
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
'data-dialog-options' => Json::encode([
'width' => 555,
]),
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
],
'other_dialog_links' => [
'#title' => 'Display more links!',
'#type' => 'link',
'#url' => Url::fromRoute('off_canvas_test.dialog_links'),
'#attributes' => [
'class' => ['use-ajax'],
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
],
];
}
/**
* Displays dialogs links to be displayed inside the off-canvas dialog.
*
* This links are used to test opening a modal and another off_canvas link from
* inside the off-canvas dialog.
*
* @todo Update tests to check these links work in the off-canvas dialog.
* https://www.drupal.org/node/2790073
*
* @return array
* Render array with links.
*/
public function otherDialogLinks() {
return [
'#theme' => 'links',
'#links' => [
'modal_link' => [
'title' => 'Open modal!',
'url' => Url::fromRoute('off_canvas_test.thing2'),
'attributes' => [
'class' => ['use-ajax'],
'data-dialog-type' => 'modal',
],
],
'off_canvas_link' => [
'title' => 'Off_canvas link!',
'url' => Url::fromRoute('off_canvas_test.thing2'),
'attributes' => [
'class' => ['use-ajax'],
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
],
],
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
];
}
}
core/modules/settings_tray/tests/modules/settings_tray_override_test/settings_tray_override_test.info.yml
+13
View File
@@ -0,0 +1,13 @@
name: 'Configuration override test for Settings Tray'
type: module
package: Testing
# version: VERSION
# core: 8.x
dependencies:
- settings_tray
# Information added by Drupal.org packaging script on 2018-03-07
version: '8.5.0'
core: '8.x'
project: 'drupal'
datestamp: 1520457825
core/modules/settings_tray/tests/modules/settings_tray_override_test/settings_tray_override_test.services.yml
+5
View File
@@ -0,0 +1,5 @@
services:
settings_tray_override_test.overrider:
class: Drupal\settings_tray_override_test\ConfigOverrider
tags:
- { name: config.factory.override }
core/modules/settings_tray/tests/modules/settings_tray_override_test/src/ConfigOverrider.php
+60
View File
@@ -0,0 +1,60 @@
<?php
namespace Drupal\settings_tray_override_test;
use Drupal\Core\Cache\CacheableMetadata;
use Drupal\Core\Config\ConfigFactoryOverrideInterface;
use Drupal\Core\Config\StorageInterface;
/**
* Provides an overridden block for Settings Tray testing.
*
* @see \Drupal\Tests\settings_tray\FunctionalJavascript\SettingsTrayBlockFormTest::testOverriddenDisabled()
*/
class ConfigOverrider implements ConfigFactoryOverrideInterface {
/**
* {@inheritdoc}
*/
public function loadOverrides($names) {
$overrides = [];
if (in_array('block.block.overridden_block', $names)) {
if (\Drupal::state()->get('settings_tray_override_test.block')) {
$overrides = $overrides + ['block.block.overridden_block' => ['settings' => ['label' => 'Now this will be the label.']]];
}
}
if (in_array('system.site', $names)) {
if (\Drupal::state()->get('settings_tray_override_test.site_name')) {
$overrides = $overrides + ['system.site' => ['name' => 'Llama Fan Club']];
}
}
if (in_array('system.menu.main', $names)) {
if (\Drupal::state()->get('settings_tray_override_test.menu')) {
$overrides = $overrides + ['system.menu.main' => ['label' => 'Labely label']];
}
}
return $overrides;
}
/**
* {@inheritdoc}
*/
public function getCacheSuffix() {
return 'ConfigOverrider';
}
/**
* {@inheritdoc}
*/
public function createConfigObject($name, $collection = StorageInterface::DEFAULT_COLLECTION) {
return NULL;
}
/**
* {@inheritdoc}
*/
public function getCacheableMetadata($name) {
return new CacheableMetadata();
}
}
core/modules/settings_tray/tests/modules/settings_tray_test/settings_tray_test.info.yml
+3 -3
View File
@@ -8,8 +8,8 @@ dependencies:
- block
- settings_tray
# Information added by Drupal.org packaging script on 2018-01-03
version: '8.4.4'
# Information added by Drupal.org packaging script on 2018-03-07
version: '8.5.0'
core: '8.x'
project: 'drupal'
datestamp: 1515021228
datestamp: 1520457825
core/modules/settings_tray/tests/modules/settings_tray_test_css/css/css_fix.theme.css
+2 -2
View File
@@ -1,5 +1,5 @@
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode input {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode input {
pointer-events: inherit !important;
}
/**
core/modules/settings_tray/tests/modules/settings_tray_test_css/settings_tray_test_css.info.yml
+3 -3
View File
@@ -7,8 +7,8 @@ package: Testing
dependencies:
- settings_tray
# Information added by Drupal.org packaging script on 2018-01-03
version: '8.4.4'
# Information added by Drupal.org packaging script on 2018-03-07
version: '8.5.0'
core: '8.x'
project: 'drupal'
datestamp: 1515021228
datestamp: 1520457825
core/modules/settings_tray/tests/src/Functional/BcRoutesTest.php
+33
View File
@@ -0,0 +1,33 @@
<?php
namespace Drupal\Tests\settings_tray\Functional;
use Drupal\Core\Url;
use Drupal\Tests\BrowserTestBase;
/**
* Tests Settings Tray BC routes.
*
* @group settings_tray
* @group legacy
*/
class BcRoutesTest extends BrowserTestBase {
/**
* {@inheritdoc}
*/
public static $modules = [
'settings_tray',
];
/**
* @expectedDeprecation The 'entity.block.off_canvas_form' route is deprecated since version 8.5.x and will be removed in 9.0.0. Use the 'entity.block.settings_tray_form' route instead.
*/
public function testOffCanvasFormRouteBc() {
$block = $this->placeBlock('system_powered_by_block');
$url_for_current_route = Url::fromRoute('entity.block.settings_tray_form', ['block' => $block->id()])->toString(TRUE)->getGeneratedUrl();
$url_for_bc_route = Url::fromRoute('entity.block.off_canvas_form', ['block' => $block->id()])->toString(TRUE)->getGeneratedUrl();
$this->assertSame($url_for_current_route, $url_for_bc_route);
}
}
core/modules/settings_tray/tests/src/Functional/OffCanvasDialogTest.php
-63
View File
@@ -1,63 +0,0 @@
<?php
namespace Drupal\Tests\settings_tray\Functional;
use Drupal\ajax_test\Controller\AjaxTestController;
use Drupal\Component\Serialization\Json;
use Drupal\Core\EventSubscriber\MainContentViewSubscriber;
use Drupal\Tests\BrowserTestBase;
/**
* Performs tests on opening and manipulating dialogs via AJAX commands.
*
* @group settings_tray
*/
class OffCanvasDialogTest extends BrowserTestBase {
/**
* Modules to enable.
*
* @var array
*/
public static $modules = ['ajax_test', 'settings_tray'];
/**
* Test sending AJAX requests to open and manipulate off-canvas dialog.
*/
public function testDialog() {
$this->drupalLogin($this->drupalCreateUser(['administer contact forms']));
// Ensure the elements render without notices or exceptions.
$this->drupalGet('ajax-test/dialog');
// Set up variables for this test.
$dialog_renderable = AjaxTestController::dialogContents();
$dialog_contents = \Drupal::service('renderer')->renderRoot($dialog_renderable);
$off_canvas_expected_response = [
'command' => 'openDialog',
'selector' => '#drupal-off-canvas',
'settings' => NULL,
'data' => $dialog_contents,
'dialogOptions' =>
[
'title' => 'AJAX Dialog & contents',
'modal' => FALSE,
'autoResize' => FALSE,
'resizable' => 'w',
'draggable' => FALSE,
'drupalAutoButtons' => FALSE,
'buttons' => [],
'dialogClass' => 'ui-dialog-off-canvas',
'width' => 300,
],
'effect' => 'fade',
'speed' => 1000,
];
// Emulate going to the JS version of the page and check the JSON response.
$ajax_result = $this->drupalGet('ajax-test/dialog-contents', ['query' => [MainContentViewSubscriber::WRAPPER_FORMAT => 'drupal_dialog.off_canvas']]);
$ajax_result = Json::decode($ajax_result);
$this->assertEqual($off_canvas_expected_response, $ajax_result[3], 'off-canvas dialog JSON response matches.');
}
}
core/modules/settings_tray/tests/src/FunctionalJavascript/OffCanvasTest.php
-123
View File
@@ -1,123 +0,0 @@
<?php
namespace Drupal\Tests\settings_tray\FunctionalJavascript;
/**
* Tests the off-canvas dialog functionality.
*
* @group settings_tray
*/
class OffCanvasTest extends SettingsTrayJavascriptTestBase {
/**
* {@inheritdoc}
*/
public static $modules = [
'block',
'system',
'toolbar',
'settings_tray',
'off_canvas_test',
];
/**
* Tests that non-contextual links will work with the off-canvas dialog.
*/
public function testOffCanvasLinks() {
// Test the same functionality on multiple themes.
foreach ($this->getTestThemes() as $theme) {
$this->enableTheme($theme);
$this->drupalGet('/off-canvas-test-links');
$page = $this->getSession()->getPage();
$web_assert = $this->assertSession();
// Make sure off-canvas dialog is on page when first loaded.
$web_assert->elementNotExists('css', '#drupal-off-canvas');
// Check opening and closing with two separate links.
// Make sure tray updates to new content.
// Check the first link again to make sure the empty title class is
// removed.
foreach (['1', '2', '1'] as $link_index) {
// Click the first test like that should open the page.
$page->clickLink("Click Me $link_index!");
$this->waitForOffCanvasToOpen();
// Check that the canvas is not on the page.
$web_assert->elementExists('css', '#drupal-off-canvas');
// Check that response text is on page.
$web_assert->pageTextContains("Thing $link_index says hello");
$off_canvas_tray = $this->getTray();
// Check that tray is visible.
$this->assertEquals(TRUE, $off_canvas_tray->isVisible());
$header_text = $off_canvas_tray->find('css', '.ui-dialog-title')->getText();
$tray_text = $off_canvas_tray->findById('drupal-off-canvas')->getText();
$this->assertEquals("Thing $link_index says hello", $tray_text);
if ($link_index == '2') {
// Check no title behavior.
$web_assert->elementExists('css', '.ui-dialog-empty-title');
$this->assertEquals("\xc2\xa0", $header_text);
$style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
$this->assertTrue(strstr($style, 'width: 555px;') !== FALSE, 'Dialog width respected.');
$page->clickLink("Click Me 1!");
$this->waitForOffCanvasToOpen();
$style = $page->find('css', '.ui-dialog-off-canvas')->getAttribute('style');
$this->assertTrue(strstr($style, 'width: 555px;') === FALSE, 'Dialog width reset to default.');
}
else {
// Check that header is correct.
$this->assertEquals("Thing $link_index", $header_text);
$web_assert->elementNotExists('css', '.ui-dialog-empty-title');
}
}
}
}
/**
* Tests the body displacement behaves differently at a narrow width.
*/
public function testNarrowWidth() {
$narrow_width_breakpoint = 768;
$offset = 20;
$height = 800;
$page = $this->getSession()->getPage();
$web_assert = $this->assertSession();
// Test the same functionality on multiple themes.
foreach ($this->getTestThemes() as $theme) {
$this->enableTheme($theme);
// Testing at the wider width.
$this->getSession()->resizeWindow($narrow_width_breakpoint + $offset, $height);
$this->drupalGet('/off-canvas-test-links');
$this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on wide page load.');
$page->clickLink("Click Me 1!");
$this->waitForOffCanvasToOpen();
// Check that the main canvas is padded when page is not narrow width and
// tray is open.
$web_assert->elementAttributeContains('css', '.dialog-off-canvas__main-canvas', 'style', 'padding-right');
// Testing at the narrower width.
$this->getSession()->resizeWindow($narrow_width_breakpoint - $offset, $height);
$this->drupalGet('/off-canvas-test-links');
$this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page load.');
$page->clickLink("Click Me 1!");
$this->waitForOffCanvasToOpen();
$this->assertFalse($page->find('css', '.dialog-off-canvas__main-canvas')->hasAttribute('style'), 'Body not padded on narrow page with tray open.');
}
}
/**
* {@inheritdoc}
*/
protected function getTestThemes() {
// Add 'seven' theme. Setting Tray "Edit Mode" will not work with 'seven'
// because it removes all contextual links the off-canvas dialog should.
return array_merge(parent::getTestThemes(), ['seven']);
}
}
core/modules/settings_tray/tests/src/FunctionalJavascript/SettingsTrayBlockFormTest.php
+241 -14
View File
@@ -5,17 +5,20 @@ namespace Drupal\Tests\settings_tray\FunctionalJavascript;
use Drupal\block\Entity\Block;
use Drupal\block_content\Entity\BlockContent;
use Drupal\block_content\Entity\BlockContentType;
use Drupal\menu_link_content\Entity\MenuLinkContent;
use Drupal\settings_tray_test\Plugin\Block\SettingsTrayFormAnnotationIsClassBlock;
use Drupal\settings_tray_test\Plugin\Block\SettingsTrayFormAnnotationNoneBlock;
use Drupal\Tests\contextual\FunctionalJavascript\ContextualLinkClickTrait;
use Drupal\Tests\system\FunctionalJavascript\OffCanvasTestBase;
use Drupal\user\Entity\Role;
use Drupal\user\RoleInterface;
/**
* Testing opening and saving block forms in the off-canvas dialog.
*
* @group settings_tray
*/
class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
class SettingsTrayBlockFormTest extends OffCanvasTestBase {
use ContextualLinkClickTrait;
@@ -34,7 +37,6 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'toolbar',
'contextual',
'settings_tray',
'quickedit',
'search',
'block_content',
'settings_tray_test',
@@ -42,6 +44,9 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
// cause test failures.
'settings_tray_test_css',
'settings_tray_test',
'settings_tray_override_test',
'menu_ui',
'menu_link_content',
];
/**
@@ -57,7 +62,6 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'access contextual links',
'access toolbar',
'administer nodes',
'access in-place editing',
'search content',
]);
$this->drupalLogin($user);
@@ -69,18 +73,22 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
*
* @dataProvider providerTestBlocks
*/
public function testBlocks($theme, $block_plugin, $new_page_text, $element_selector, $label_selector, $button_text, $toolbar_item) {
public function testBlocks($theme, $block_plugin, $new_page_text, $element_selector, $label_selector, $button_text, $toolbar_item, $permissions) {
if ($permissions) {
$this->grantPermissions(Role::load(Role::AUTHENTICATED_ID), $permissions);
}
$web_assert = $this->assertSession();
$page = $this->getSession()->getPage();
$this->enableTheme($theme);
$block = $this->placeBlock($block_plugin);
$block_selector = str_replace('_', '-', $this->getBlockSelector($block));
$block_selector = $this->getBlockSelector($block);
$block_id = $block->id();
$this->drupalGet('user');
$link = $page->find('css', "$block_selector .contextual-links li a");
$this->assertEquals('Quick edit', $link->getText(), "'Quick edit' is the first contextual link for the block.");
$this->assertContains("/admin/structure/block/manage/$block_id/off-canvas?destination=user/2", $link->getAttribute('href'));
$this->assertContains("/admin/structure/block/manage/$block_id/settings-tray?destination=user/2", $link->getAttribute('href'));
if (isset($toolbar_item)) {
// Check that you can open a toolbar tray and it will be closed after
@@ -144,7 +152,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
// suppressed.
$this->openBlockForm("$block_selector {$element_selector}", $block_selector);
$web_assert->elementTextContains('css', '.contextual-toolbar-tab button', 'Editing');
$web_assert->elementAttributeContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-settings-tray-edit-mode');
$web_assert->elementAttributeContains('css', '.dialog-off-canvas-main-canvas', 'class', 'js-settings-tray-edit-mode');
// Simulate press the Escape key.
$this->getSession()->executeScript('jQuery("body").trigger(jQuery.Event("keyup", { keyCode: 27 }));');
$this->waitForOffCanvasToClose();
@@ -152,7 +160,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
$this->assertEditModeDisabled();
$web_assert->elementTextContains('css', '#drupal-live-announce', 'Exited edit mode.');
$web_assert->elementTextNotContains('css', '.contextual-toolbar-tab button', 'Editing');
$web_assert->elementAttributeNotContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-settings-tray-edit-mode');
$web_assert->elementAttributeNotContains('css', '.dialog-off-canvas-main-canvas', 'class', 'js-settings-tray-edit-mode');
}
/**
@@ -170,6 +178,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'label_selector' => 'h2',
'button_text' => 'Save Powered by Drupal',
'toolbar_item' => '#toolbar-item-user',
NULL,
],
"$theme: block-branding" => [
'theme' => $theme,
@@ -179,6 +188,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'label_selector' => "a[rel='home']:last-child",
'button_text' => 'Save Site branding',
'toolbar_item' => '#toolbar-item-administration',
['administer site configuration'],
],
"$theme: block-search" => [
'theme' => $theme,
@@ -188,6 +198,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'label_selector' => 'h2',
'button_text' => 'Save Search form',
'toolbar_item' => NULL,
NULL,
],
// This is the functional JS test coverage accompanying
// \Drupal\Tests\settings_tray\Functional\SettingsTrayTest::testPossibleAnnotations().
@@ -199,6 +210,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'label_selector' => NULL,
'button_text' => NULL,
'toolbar_item' => NULL,
NULL,
],
// This is the functional JS test coverage accompanying
// \Drupal\Tests\settings_tray\Functional\SettingsTrayTest::testPossibleAnnotations().
@@ -210,6 +222,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
'label_selector' => NULL,
'button_text' => NULL,
'toolbar_item' => NULL,
NULL,
],
];
}
@@ -277,7 +290,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
$this->assertNotEmpty($contextual_link);
// When page first loads Edit Mode is not triggered until first contextual
// link is added.
$this->assertElementVisibleAfterWait('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$this->assertElementVisibleAfterWait('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
// Ensure that all other Ajax activity is completed.
$this->assertSession()->assertWaitOnAjaxRequest();
$this->click($block_selector);
@@ -289,6 +302,8 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
* Tests QuickEdit links behavior.
*/
public function testQuickEditLinks() {
$this->container->get('module_installer')->install(['quickedit']);
$this->grantPermissions(Role::load(RoleInterface::AUTHENTICATED_ID), ['access in-place editing']);
$quick_edit_selector = '#quickedit-entity-toolbar';
$node_selector = '[data-quickedit-entity-id="node/1"]';
$body_selector = '[data-quickedit-field-id="node/1/body/en/full"]';
@@ -320,7 +335,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
$this->enableTheme($theme);
$block = $this->placeBlock($block_plugin);
$block_selector = str_replace('_', '-', $this->getBlockSelector($block));
$block_selector = $this->getBlockSelector($block);
// Load the same page twice.
foreach ([1, 2] as $page_load_times) {
$this->drupalGet('node/' . $node->id());
@@ -414,7 +429,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
// The toolbar edit button should read "Editing".
$web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Editing');
// The main canvas element should have the "js-settings-tray-edit-mode" class.
$web_assert->elementExists('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$web_assert->elementExists('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
}
/**
@@ -430,7 +445,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
$web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Edit');
// The main canvas element should NOT have the "js-settings-tray-edit-mode"
// class.
$web_assert->elementNotExists('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$web_assert->elementNotExists('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
}
/**
@@ -506,6 +521,8 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
* "Quick edit settings" is settings_tray.module link.
*/
public function testCustomBlockLinks() {
$this->container->get('module_installer')->install(['quickedit']);
$this->grantPermissions(Role::load(RoleInterface::AUTHENTICATED_ID), ['access in-place editing']);
$this->drupalGet('user');
$page = $this->getSession()->getPage();
$links = $page->findAll('css', "#block-custom .contextual-links li a");
@@ -517,7 +534,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
$href = array_search('Quick edit', $link_labels);
$this->assertEquals('', $href);
$href = array_search('Quick edit settings', $link_labels);
$this->assertTrue(strstr($href, '/admin/structure/block/manage/custom/off-canvas?destination=user/2') !== FALSE);
$this->assertTrue(strstr($href, '/admin/structure/block/manage/custom/settings-tray?destination=user/2') !== FALSE);
}
/**
@@ -530,7 +547,7 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
* The CSS selector.
*/
public function getBlockSelector(Block $block) {
return '#block-' . $block->id();
return '#block-' . str_replace('_', '-', $block->id());
}
/**
@@ -543,6 +560,71 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
return $this->getSession()->getPage()->find('css', static::LABEL_INPUT_SELECTOR)->isVisible();
}
/**
* Tests access to block forms with related configuration is correct.
*/
public function testBlockConfigAccess() {
$page = $this->getSession()->getPage();
$web_assert = $this->assertSession();
// Confirm that System Branding block does not expose Site Name field
// without permission.
$block = $this->placeBlock('system_branding_block');
$this->drupalGet('user');
$this->enableEditMode();
$this->openBlockForm($this->getBlockSelector($block));
// The site name field should not appear because the user doesn't have
// permission.
$web_assert->fieldNotExists('settings[site_information][site_name]');
$page->pressButton('Save Site branding');
$this->assertElementVisibleAfterWait('css', 'div:contains(The block configuration has been saved)');
$web_assert->assertWaitOnAjaxRequest();
// Confirm we did not save changes to the configuration.
$this->assertEquals('Drupal', \Drupal::configFactory()->getEditable('system.site')->get('name'));
$this->grantPermissions(Role::load(Role::AUTHENTICATED_ID), ['administer site configuration']);
$this->drupalGet('user');
$this->openBlockForm($this->getBlockSelector($block));
// The site name field should appear because the user does have permission.
$web_assert->fieldExists('settings[site_information][site_name]');
// Confirm that the Menu block does not expose menu configuration without
// permission.
// Add a link or the menu will not render.
$menu_link_content = MenuLinkContent::create([
'title' => 'This is on the menu',
'menu_name' => 'main',
'link' => ['uri' => 'route:<front>'],
]);
$menu_link_content->save();
$this->assertNotEmpty($menu_link_content->isEnabled());
$menu_without_overrides = \Drupal::configFactory()->getEditable('system.menu.main')->get();
$block = $this->placeBlock('system_menu_block:main');
$this->drupalGet('user');
$web_assert->pageTextContains('This is on the menu');
$this->openBlockForm($this->getBlockSelector($block));
// Edit menu form should not appear because the user doesn't have
// permission.
$web_assert->pageTextNotContains('Edit menu');
$page->pressButton('Save Main navigation');
$this->assertElementVisibleAfterWait('css', 'div:contains(The block configuration has been saved)');
$web_assert->assertWaitOnAjaxRequest();
// Confirm we did not save changes to the menu or the menu link.
$this->assertEquals($menu_without_overrides, \Drupal::configFactory()->getEditable('system.menu.main')->get());
$menu_link_content = MenuLinkContent::load($menu_link_content->id());
$this->assertNotEmpty($menu_link_content->isEnabled());
// Confirm menu is still on the page.
$this->drupalGet('user');
$web_assert->pageTextContains('This is on the menu');
$this->grantPermissions(Role::load(Role::AUTHENTICATED_ID), ['administer menu']);
$this->drupalGet('user');
$web_assert->pageTextContains('This is on the menu');
$this->openBlockForm($this->getBlockSelector($block));
// Edit menu form should appear because the user does have permission.
$web_assert->pageTextContains('Edit menu');
}
/**
* Test that validation errors appear in the off-canvas dialog.
*/
@@ -565,4 +647,149 @@ class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
}
}
/**
* {@inheritdoc}
*/
protected function getTestThemes() {
// Remove 'seven' theme. Setting Tray "Edit Mode" will not work with 'seven'
// because it removes all contextual links the off-canvas dialog should.
return array_filter(parent::getTestThemes(), function ($theme) {
return $theme !== 'seven';
});
}
/**
* Tests that blocks with configuration overrides are disabled.
*/
public function testOverriddenBlock() {
$web_assert = $this->assertSession();
$page = $this->getSession()->getPage();
$overridden_block = $this->placeBlock('system_powered_by_block', [
'id' => 'overridden_block',
'label_display' => 1,
'label' => 'This will be overridden.',
]);
$this->drupalGet('user');
$block_selector = $this->getBlockSelector($overridden_block);
// Confirm the block is marked as Settings Tray editable.
$this->assertEquals('editable', $page->find('css', $block_selector)->getAttribute('data-drupal-settingstray'));
// Confirm the label is not overridden.
$web_assert->elementContains('css', $block_selector, 'This will be overridden.');
$this->enableEditMode();
$this->openBlockForm($block_selector);
// Confirm the block Settings Tray functionality is disabled when block is
// overridden.
$this->container->get('state')->set('settings_tray_override_test.block', TRUE);
$overridden_block->save();
$block_config = \Drupal::configFactory()->getEditable('block.block.overridden_block');
$block_config->set('settings', $block_config->get('settings'))->save();
$this->drupalGet('user');
$this->assertOverriddenBlockDisabled($overridden_block, 'Now this will be the label.');
// Test a non-overridden block does show the form in the off-canvas dialog.
$block = $this->placeBlock('system_powered_by_block', [
'label_display' => 1,
'label' => 'Labely label',
]);
$this->drupalGet('user');
$block_selector = $this->getBlockSelector($block);
// Confirm the block is marked as Settings Tray editable.
$this->assertEquals('editable', $page->find('css', $block_selector)->getAttribute('data-drupal-settingstray'));
// Confirm the label is not overridden.
$web_assert->elementContains('css', $block_selector, 'Labely label');
$this->openBlockForm($block_selector);
}
/**
* Test blocks with overridden related configuration removed when overridden.
*/
public function testOverriddenConfigurationRemoved() {
$web_assert = $this->assertSession();
$page = $this->getSession()->getPage();
$this->grantPermissions(Role::load(Role::AUTHENTICATED_ID), ['administer site configuration', 'administer menu']);
// Confirm the branding block does include 'site_information' section when
// the site name is not overridden.
$branding_block = $this->placeBlock('system_branding_block');
$this->drupalGet('user');
$this->enableEditMode();
$this->openBlockForm($this->getBlockSelector($branding_block));
$web_assert->fieldExists('settings[site_information][site_name]');
// Confirm the branding block does not include 'site_information' section
// when the site name is overridden.
$this->container->get('state')->set('settings_tray_override_test.site_name', TRUE);
$this->drupalGet('user');
$this->openBlockForm($this->getBlockSelector($branding_block));
$web_assert->fieldNotExists('settings[site_information][site_name]');
$page->pressButton('Save Site branding');
$this->assertElementVisibleAfterWait('css', 'div:contains(The block configuration has been saved)');
$web_assert->assertWaitOnAjaxRequest();
// Confirm we did not save changes to the configuration.
$this->assertEquals('Llama Fan Club', \Drupal::configFactory()->get('system.site')->get('name'));
$this->assertEquals('Drupal', \Drupal::configFactory()->getEditable('system.site')->get('name'));
// Add a link or the menu will not render.
$menu_link_content = MenuLinkContent::create([
'title' => 'This is on the menu',
'menu_name' => 'main',
'link' => ['uri' => 'route:<front>'],
]);
$menu_link_content->save();
// Confirm the menu block does include menu section when the menu is not
// overridden.
$menu_block = $this->placeBlock('system_menu_block:main');
$web_assert->assertWaitOnAjaxRequest();
$this->drupalGet('user');
$web_assert->pageTextContains('This is on the menu');
$this->openBlockForm($this->getBlockSelector($menu_block));
$web_assert->elementExists('css', '#menu-overview');
// Confirm the menu block does not include menu section when the menu is
// overridden.
$this->container->get('state')->set('settings_tray_override_test.menu', TRUE);
$this->drupalGet('user');
$web_assert->pageTextContains('This is on the menu');
$menu_with_overrides = \Drupal::configFactory()->get('system.menu.main')->get();
$menu_without_overrides = \Drupal::configFactory()->getEditable('system.menu.main')->get();
$this->openBlockForm($this->getBlockSelector($menu_block));
$web_assert->elementNotExists('css', '#menu-overview');
$page->pressButton('Save Main navigation');
$this->assertElementVisibleAfterWait('css', 'div:contains(The block configuration has been saved)');
$web_assert->assertWaitOnAjaxRequest();
// Confirm we did not save changes to the configuration.
$this->assertEquals('Labely label', \Drupal::configFactory()->get('system.menu.main')->get('label'));
$this->assertEquals('Main navigation', \Drupal::configFactory()->getEditable('system.menu.main')->get('label'));
$this->assertEquals($menu_with_overrides, \Drupal::configFactory()->get('system.menu.main')->get());
$this->assertEquals($menu_without_overrides, \Drupal::configFactory()->getEditable('system.menu.main')->get());
$web_assert->pageTextContains('This is on the menu');
}
/**
* Asserts that an overridden block has Settings Tray disabled.
*
* @param \Drupal\block\Entity\Block $overridden_block
* The overridden block.
* @param string $override_text
* The override text that should appear in the block.
*/
protected function assertOverriddenBlockDisabled(Block $overridden_block, $override_text) {
$web_assert = $this->assertSession();
$page = $this->getSession()->getPage();
$block_selector = $this->getBlockSelector($overridden_block);
$block_id = $overridden_block->id();
// Confirm the block does not have a quick edit link.
$contextual_links = $page->findAll('css', "$block_selector .contextual-links li a");
$this->assertNotEmpty($contextual_links);
foreach ($contextual_links as $link) {
$this->assertNotContains("/admin/structure/block/manage/$block_id/off-canvas", $link->getAttribute('href'));
}
// Confirm the block is not marked as Settings Tray editable.
$this->assertFalse($page->find('css', $block_selector)
->hasAttribute('data-drupal-settingstray'));
// Confirm the text is actually overridden.
$web_assert->elementContains('css', $this->getBlockSelector($overridden_block), $override_text);
}
}
core/modules/settings_tray/tests/src/FunctionalJavascript/SettingsTrayJavascriptTestBase.php
-126
View File
@@ -1,126 +0,0 @@
<?php
namespace Drupal\Tests\settings_tray\FunctionalJavascript;
use Drupal\FunctionalJavascriptTests\JavascriptTestBase;
/**
* Base class contains common test functionality for the Settings Tray module.
*/
abstract class SettingsTrayJavascriptTestBase extends JavascriptTestBase {
/**
* {@inheritdoc}
*/
protected function drupalGet($path, array $options = [], array $headers = []) {
$return = parent::drupalGet($path, $options, $headers);
$this->assertPageLoadComplete();
return $return;
}
/**
* Assert the page is completely loaded.
*
* Ajax requests may happen after page loads. Also for users who have access
* to contextual links the contextual link placeholders will be filled after
* the page is received.
*/
protected function assertPageLoadComplete() {
$this->assertSession()->assertWaitOnAjaxRequest();
if ($this->loggedInUser && $this->loggedInUser->hasPermission('access contextual links')) {
$this->assertAllContextualLinksLoaded();
}
}
/**
* Assert all contextual link areas have be loaded.
*
* Contextual link placeholders will be filled after
* the page is received.
*
* @todo Move this function to https://www.drupal.org/node/2821724.
*/
protected function assertAllContextualLinksLoaded() {
$this->waitForNoElement('[data-contextual-id]:empty');
}
/**
* Enables a theme.
*
* @param string $theme
* The theme.
*/
protected function enableTheme($theme) {
// Enable the theme.
\Drupal::service('theme_installer')->install([$theme]);
$theme_config = \Drupal::configFactory()->getEditable('system.theme');
$theme_config->set('default', $theme);
$theme_config->save();
}
/**
* Waits for off-canvas dialog to open.
*/
protected function waitForOffCanvasToOpen() {
$web_assert = $this->assertSession();
$web_assert->assertWaitOnAjaxRequest();
$this->assertElementVisibleAfterWait('css', '#drupal-off-canvas');
}
/**
* Waits for off-canvas dialog to close.
*/
protected function waitForOffCanvasToClose() {
$this->waitForNoElement('#drupal-off-canvas');
}
/**
* Gets the off-canvas dialog element.
*
* @return \Behat\Mink\Element\NodeElement|null
*/
protected function getTray() {
$tray = $this->getSession()->getPage()->find('css', '.ui-dialog[aria-describedby="drupal-off-canvas"]');
$this->assertEquals(FALSE, empty($tray), 'The tray was found.');
return $tray;
}
/**
* Waits for an element to be removed from the page.
*
* @param string $selector
* CSS selector.
* @param int $timeout
* (optional) Timeout in milliseconds, defaults to 10000.
*/
protected function waitForNoElement($selector, $timeout = 10000) {
$condition = "(typeof jQuery !== 'undefined' && jQuery('$selector').length === 0)";
$this->assertJsCondition($condition, $timeout);
}
/**
* Get themes to test.
*
* @return string[]
* Theme names to test.
*/
protected function getTestThemes() {
return ['bartik', 'stark', 'classy', 'stable'];
}
/**
* Asserts the specified selector is visible after a wait.
*
* @param string $selector
* The selector engine name. See ElementInterface::findAll() for the
* supported selectors.
* @param string|array $locator
* The selector locator.
* @param int $timeout
* (Optional) Timeout in milliseconds, defaults to 10000.
*/
protected function assertElementVisibleAfterWait($selector, $locator, $timeout = 10000) {
$this->assertNotEmpty($this->assertSession()->waitForElementVisible($selector, $locator, $timeout));
}
}
core/modules/settings_tray/tests/src/Unit/Ajax/OpenOffCanvasDialogCommandTest.php
-43
View File
@@ -1,43 +0,0 @@
<?php
namespace Drupal\Tests\settings_tray\Unit\Ajax;
use Drupal\settings_tray\Ajax\OpenOffCanvasDialogCommand;
use Drupal\Tests\UnitTestCase;
/**
* @coversDefaultClass \Drupal\settings_tray\Ajax\OpenOffCanvasDialogCommand
* @group settings_tray
*/
class OpenOffCanvasDialogCommandTest extends UnitTestCase {
/**
* @covers ::render
*/
public function testRender() {
$command = new OpenOffCanvasDialogCommand('Title', '<p>Text!</p>', ['url' => 'example']);
$expected = [
'command' => 'openDialog',
'selector' => '#drupal-off-canvas',
'settings' => NULL,
'data' => '<p>Text!</p>',
'dialogOptions' => [
'url' => 'example',
'title' => 'Title',
'modal' => FALSE,
'autoResize' => FALSE,
'resizable' => 'w',
'draggable' => FALSE,
'drupalAutoButtons' => FALSE,
'buttons' => [],
'dialogClass' => 'ui-dialog-off-canvas',
'width' => 300,
],
'effect' => 'fade',
'speed' => 1000,
];
$this->assertEquals($expected, $command->render());
}
}