diff --git a/composer.json b/composer.json
new file mode 100644
index 0000000000000000000000000000000000000000..b2f79a5e5b117b0c5ed862c87d36ab90cd303686
--- /dev/null
+++ b/composer.json
@@ -0,0 +1,6 @@
+{
+ "name": "uw_wcms_gesso",
+ "description": "Stylings and pattern-lab/gesso for WCMS",
+ "type": "drupal-custom-module",
+ "keywords": ["Drupal"]
+}
\ No newline at end of file
diff --git a/css/styles.css b/css/styles.css
index d2f844cf3082d38515b9c769623c60fceabfab06..123149ce9e6f03330c0ab716017fb7e1fafe3bb2 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -2228,124 +2228,126 @@ svg:not(:root) {
padding-right: 0; } }
/* stylelint-disable-next-line selector-no-qualifying-type */
-.uw-highlighted,
-.block-page-title-block,
-.block-local-tasks-block,
-.node-form,
-.admin-list,
-.js-media-library-view,
-.messages,
-.message,
-.contextual-region.profile,
-.uw-content-moderation,
-form {
+.uw-page .uw-highlighted,
+.uw-page .block-page-title-block,
+.uw-page .block-local-tasks-block,
+.uw-page .node-form,
+.uw-page .admin-list,
+.uw-page .js-media-library-view,
+.uw-page .messages,
+.uw-page .message,
+.uw-page .contextual-region.profile,
+.uw-page form {
margin-left: auto;
margin-right: auto;
max-width: 75rem;
padding: 0 16px;
padding: 1rem; }
@media (min-width: 75rem) {
- .uw-highlighted,
- .block-page-title-block,
- .block-local-tasks-block,
- .node-form,
- .admin-list,
- .js-media-library-view,
- .messages,
- .message,
- .contextual-region.profile,
- .uw-content-moderation,
- form {
+ .uw-page .uw-highlighted,
+ .uw-page .block-page-title-block,
+ .uw-page .block-local-tasks-block,
+ .uw-page .node-form,
+ .uw-page .admin-list,
+ .uw-page .js-media-library-view,
+ .uw-page .messages,
+ .uw-page .message,
+ .uw-page .contextual-region.profile,
+ .uw-page form {
padding-left: 0;
padding-right: 0; } }
+ @media (min-width: 75rem) {
+ .uw-page .uw-highlighted,
+ .uw-page .block-page-title-block,
+ .uw-page .block-local-tasks-block,
+ .uw-page .node-form,
+ .uw-page .admin-list,
+ .uw-page .js-media-library-view,
+ .uw-page .messages,
+ .uw-page .message,
+ .uw-page .contextual-region.profile,
+ .uw-page form {
+ padding: 1rem 0; } }
-.entity-meta__header {
+.uw-page .entity-meta__header {
background-color: #fffbda; }
-.uw-content-moderation__wrapper {
- background-color: #fff1d2;
- border: 1px solid #fad980;
- font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
- font-size: 14.22224px;
- max-width: inherit;
- padding: 16px; }
-
-.ui-dialog .ui-dialog-title {
+.uw-page .ui-dialog .ui-dialog-title {
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
font-size: 1.602rem;
font-weight: 400; }
-.js-media-library-view {
+.uw-page .js-media-library-view {
background: #fafafa;
border: 1px solid #bfbfbf;
border-radius: 2px;
padding: 1rem; }
-.ui-dialog-buttonpane {
+.uw-page .ui-dialog-buttonpane {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3) ,0 0 0 rgba(0, 0, 0, 0.3); }
-.ui-dialog input[size="60"],
-.ui-dialog input[size="120"] {
+.uw-page .ui-dialog input[size="60"],
+.uw-page .ui-dialog input[size="120"] {
max-width: 100%;
width: 100%; }
-.ui-dialog .media-library-widget .fieldset-wrapper {
+.uw-page .ui-dialog .media-library-widget .fieldset-wrapper {
display: block; }
-.ui-dialog .description {
+.uw-page .ui-dialog .description {
font-size: 12.64px;
font-style: italic; }
-.ui-dialog .views-display-link {
+.uw-page .ui-dialog .views-display-link {
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif; }
-.ui-dialog form {
+.uw-page .ui-dialog form {
margin-left: auto;
margin-right: auto;
max-width: 75rem;
padding: 0 16px;
padding: 0 !important; }
@media (min-width: 75rem) {
- .ui-dialog form {
+ .uw-page .ui-dialog form {
padding-left: 0;
padding-right: 0; } }
-.ui-dialog .field--widget-entity-reference-paragraphs {
+.uw-page .ui-dialog .field--widget-entity-reference-paragraphs {
padding: 1rem; }
- .ui-dialog .field--widget-entity-reference-paragraphs .field--widget-entity-reference-paragraphs {
+ .uw-page .ui-dialog .field--widget-entity-reference-paragraphs .field--widget-entity-reference-paragraphs {
padding: 0 !important; }
-.ui-dialog .field--name-field-uw-ec-items {
+.uw-page .ui-dialog .field--name-field-uw-ec-items {
background: inherit;
padding: inherit; }
-.ui-dialog .field--widget-entity-reference-paragraphs td {
+.uw-page .ui-dialog .field--widget-entity-reference-paragraphs td {
background: inherit;
border: 1px solid #ccc;
padding: 1rem; }
-.ui-dialog .field--widget-entity-reference-paragraphs .field-label {
+.uw-page .ui-dialog .field--widget-entity-reference-paragraphs .field-label {
border-width: 1px 1px 0; }
- .ui-dialog .field--widget-entity-reference-paragraphs .field-label .label {
+ .uw-page .ui-dialog .field--widget-entity-reference-paragraphs .field-label .label {
font-size: 18px; }
-.ui-dialog .paragraph-type--uw-para-fact-figure .tabledrag-handle .handle {
+.uw-page .ui-dialog .paragraph-type--uw-para-fact-figure .tabledrag-handle .handle {
margin: 0; }
-.ui-dialog .draggable .tabledrag-handle {
+.uw-page .ui-dialog .draggable .tabledrag-handle {
cursor: move;
float: inherit;
height: inherit;
margin-left: inherit;
overflow: inherit;
text-decoration: none; }
- .ui-dialog .draggable .tabledrag-handle .handle {
+ .uw-page .ui-dialog .draggable .tabledrag-handle .handle {
float: left;
height: 2rem;
padding: 0;
width: 2rem; }
-.ui-dialog .tabledrag-hide {
+.uw-page .ui-dialog .tabledrag-hide {
border-width: 1px 1px 0;
font-family: "BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif;
font-size: 18px;
@@ -2354,98 +2356,98 @@ form {
padding: 0 1rem;
text-align: center; }
-.ui-dialog .odd .form-item,
-.ui-dialog .even .form-item {
+.uw-page .ui-dialog .odd .form-item,
+.uw-page .ui-dialog .even .form-item {
margin-bottom: 0 !important; }
-.ui-dialog .field-multiple-table {
+.uw-page .ui-dialog .field-multiple-table {
min-width: inherit; }
-.ui-dialog .media-library-item--grid {
+.uw-page .ui-dialog .media-library-item--grid {
padding-bottom: 2.5rem; }
-.token-tree-dialog {
+.uw-page .token-tree-dialog {
font-family: "BureauGrot Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif; }
- .token-tree-dialog table td {
+ .uw-page .token-tree-dialog table td {
padding: 0.5rem 1rem; }
-.js .paragraph-type-title {
+.uw-page .js .paragraph-type-title {
flex-basis: 35%; }
-.tabledrag-changed.warning {
+.uw-page .tabledrag-changed.warning {
color: #e00 !important; }
-.layout-builder-form .button,
-.form-actions .button, .layout-builder-form
-button,
+.layout-builder-form .uw-page .button,
+.form-actions .uw-page .button, .layout-builder-form
+.uw-page button,
.form-actions
-button {
+.uw-page button {
font-size: 0.79rem;
height: 2.5rem;
line-height: 2.75;
max-width: inherit;
padding: 0.25rem 0.25rem; }
- .layout-builder-form .button:hover, .layout-builder-form .button:focus,
- .form-actions .button:hover,
- .form-actions .button:focus, .layout-builder-form
- button:hover, .layout-builder-form
- button:focus,
+ .layout-builder-form .uw-page .button:hover, .layout-builder-form .uw-page .button:focus,
+ .form-actions .uw-page .button:hover,
+ .form-actions .uw-page .button:focus, .layout-builder-form
+ .uw-page button:hover, .layout-builder-form
+ .uw-page button:focus,
.form-actions
- button:hover,
+ .uw-page button:hover,
.form-actions
- button:focus {
+ .uw-page button:focus {
padding: 0.25rem 0.25rem; }
-.media-library-content .button,
-.paragraphs-actions .button,
-.paragraph-type-top .button,
-.paragraphs-dropbutton-wrapper .button, .media-library-content
-button,
+.media-library-content .uw-page .button,
+.paragraphs-actions .uw-page .button,
+.paragraph-type-top .uw-page .button,
+.paragraphs-dropbutton-wrapper .uw-page .button, .media-library-content
+.uw-page button,
.paragraphs-actions
-button,
+.uw-page button,
.paragraph-type-top
-button,
+.uw-page button,
.paragraphs-dropbutton-wrapper
-button {
+.uw-page button {
font-size: 0.79rem;
font-weight: 200;
height: inherit;
max-width: 12rem;
padding: 0.5rem 1rem;
width: 100%; }
- .media-library-content .button:hover, .media-library-content .button:focus,
- .paragraphs-actions .button:hover,
- .paragraphs-actions .button:focus,
- .paragraph-type-top .button:hover,
- .paragraph-type-top .button:focus,
- .paragraphs-dropbutton-wrapper .button:hover,
- .paragraphs-dropbutton-wrapper .button:focus, .media-library-content
- button:hover, .media-library-content
- button:focus,
+ .media-library-content .uw-page .button:hover, .media-library-content .uw-page .button:focus,
+ .paragraphs-actions .uw-page .button:hover,
+ .paragraphs-actions .uw-page .button:focus,
+ .paragraph-type-top .uw-page .button:hover,
+ .paragraph-type-top .uw-page .button:focus,
+ .paragraphs-dropbutton-wrapper .uw-page .button:hover,
+ .paragraphs-dropbutton-wrapper .uw-page .button:focus, .media-library-content
+ .uw-page button:hover, .media-library-content
+ .uw-page button:focus,
.paragraphs-actions
- button:hover,
+ .uw-page button:hover,
.paragraphs-actions
- button:focus,
+ .uw-page button:focus,
.paragraph-type-top
- button:hover,
+ .uw-page button:hover,
.paragraph-type-top
- button:focus,
+ .uw-page button:focus,
.paragraphs-dropbutton-wrapper
- button:hover,
+ .uw-page button:hover,
.paragraphs-dropbutton-wrapper
- button:focus {
+ .uw-page button:focus {
padding: 0.5rem 1rem; }
-.ui-dialog .button, .ui-dialog
-button {
+.ui-dialog .uw-page .button, .ui-dialog
+.uw-page button {
margin: 0.5rem 0 0 0; }
-.ui-dialog-buttonset.form-actions .button, .ui-dialog-buttonset.form-actions
-button {
+.ui-dialog-buttonset.form-actions .uw-page .button, .ui-dialog-buttonset.form-actions
+.uw-page button {
max-width: 10rem; }
-.user-login-form .form-actions .button, .user-login-form .form-actions
-button {
+.user-login-form .form-actions .uw-page .button, .user-login-form .form-actions
+.uw-page button {
background-color: #757575;
background-image: none;
border: 0;
@@ -2470,12 +2472,12 @@ button {
vertical-align: top;
white-space: normal;
width: 100%; }
- .user-login-form .form-actions .button:visited, .user-login-form .form-actions
- button:visited {
+ .user-login-form .form-actions .uw-page .button:visited, .user-login-form .form-actions
+ .uw-page button:visited {
color: #fff; }
- .user-login-form .form-actions .button:hover, .user-login-form .form-actions .button:focus, .user-login-form .form-actions
- button:hover, .user-login-form .form-actions
- button:focus {
+ .user-login-form .form-actions .uw-page .button:hover, .user-login-form .form-actions .uw-page .button:focus, .user-login-form .form-actions
+ .uw-page button:hover, .user-login-form .form-actions
+ .uw-page button:focus {
background-color: #eee;
background-image: none;
border: 0;
@@ -2483,31 +2485,31 @@ button {
color: #4e4e4e;
outline: none !important;
text-decoration: none; }
- .user-login-form .form-actions .button:active, .user-login-form .form-actions
- button:active {
+ .user-login-form .form-actions .uw-page .button:active, .user-login-form .form-actions
+ .uw-page button:active {
background-color: #757575;
background-image: none;
color: #fff;
outline: none !important; }
- .user-login-form .form-actions .button[disabled], .user-login-form .form-actions
- button[disabled] {
+ .user-login-form .form-actions .uw-page .button[disabled], .user-login-form .form-actions
+ .uw-page button[disabled] {
background-color: #eee;
background-image: none;
color: #A2A2A2;
cursor: default;
pointer-events: none; }
-.tabledrag-toggle-weight-wrapper .button, .tabledrag-toggle-weight-wrapper
-button {
+.tabledrag-toggle-weight-wrapper .uw-page .button, .tabledrag-toggle-weight-wrapper
+.uw-page button {
font-size: 12.64px;
font-weight: 200;
max-width: 10rem;
padding: 0;
text-align: inherit;
width: inherit; }
- .tabledrag-toggle-weight-wrapper .button:hover, .tabledrag-toggle-weight-wrapper .button:focus, .tabledrag-toggle-weight-wrapper
- button:hover, .tabledrag-toggle-weight-wrapper
- button:focus {
+ .tabledrag-toggle-weight-wrapper .uw-page .button:hover, .tabledrag-toggle-weight-wrapper .uw-page .button:focus, .tabledrag-toggle-weight-wrapper
+ .uw-page button:hover, .tabledrag-toggle-weight-wrapper
+ .uw-page button:focus {
background: none;
font-size: 12.64px;
font-weight: 200;
@@ -2516,14 +2518,14 @@ button {
text-align: inherit;
width: inherit; }
-.media-library-widget__toggle-weight {
+.uw-page .media-library-widget__toggle-weight {
font-size: 12.64px !important;
font-weight: 200;
max-width: 10rem;
padding: 0;
text-align: inherit;
width: inherit; }
- .media-library-widget__toggle-weight:hover, .media-library-widget__toggle-weight:focus {
+ .uw-page .media-library-widget__toggle-weight:hover, .uw-page .media-library-widget__toggle-weight:focus {
background: none;
font-size: 12.64px;
font-weight: 200;
@@ -2532,12 +2534,12 @@ button {
text-align: inherit;
width: inherit; }
-.layouts-dashboards-3 .drow > div,
-.layouts-dashboards-2 .drow > div,
-.layouts-dashboards-1 .drow > div {
+.uw-page .layouts-dashboards-3 .drow > div,
+.uw-page .layouts-dashboards-2 .drow > div,
+.uw-page .layouts-dashboards-1 .drow > div {
box-shadow: none; }
-.uw-admin-label {
+.uw-page .uw-admin-label {
background-color: #757575 !important;
color: #fff;
font-family: Typ1451-Regular,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
@@ -2547,17 +2549,17 @@ button {
position: absolute;
top: -1.5rem !important; }
-.layout-builder__region {
+.uw-page .layout-builder__region {
padding: 0.25rem; }
-.contextual .trigger {
+.uw-page .contextual .trigger {
color: #f03;
width: inherit; }
- .contextual .trigger:focus {
+ .uw-page .contextual .trigger:focus {
color: #25ffcc;
width: inherit; }
-.paragraphs-dropdown-action.button {
+.uw-page .paragraphs-dropdown-action.button {
color: #4e4e4e; }
/* stylelint-disable-next-line selector-no-qualifying-type */
diff --git a/gesso_helper/composer.json b/gesso_helper/composer.json
new file mode 100644
index 0000000000000000000000000000000000000000..e2d5c6903405dccb984fb10ffe5f603308bfe291
--- /dev/null
+++ b/gesso_helper/composer.json
@@ -0,0 +1,21 @@
+{
+ "name": "forumone/gesso_helper",
+ "description": "Provides additional functionality for the Gesso theme.",
+ "type": "drupal-drush",
+ "authors": [
+ {
+ "name": "Forum One",
+ "email": "author@example.com"
+ }
+ ],
+ "require": {
+ "php": ">=5.6.0"
+ },
+ "extra": {
+ "drush": {
+ "services": {
+ "drush.services.yml": "^9"
+ }
+ }
+ }
+}
diff --git a/gesso_helper/drush.services.yml b/gesso_helper/drush.services.yml
new file mode 100644
index 0000000000000000000000000000000000000000..f1db416811e65e9b6096a98883f1e507884e98c0
--- /dev/null
+++ b/gesso_helper/drush.services.yml
@@ -0,0 +1,5 @@
+services:
+ gesso_helper.commands:
+ class: \Drupal\gesso_helper\Commands\GessoHelperCommands
+ tags:
+ - { name: drush.command }
diff --git a/gesso_helper/gesso_helper.info.yml b/gesso_helper/gesso_helper.info.yml
new file mode 100644
index 0000000000000000000000000000000000000000..080abf6f281ecad77e713ea0e2d2684edbb42289
--- /dev/null
+++ b/gesso_helper/gesso_helper.info.yml
@@ -0,0 +1,9 @@
+name: Gesso Helper
+description: Provides additional functionality for the Gesso theme
+type: module
+core_version_requirement: ^8 || ^9
+
+# Information added by drupal-composer/info-rewrite; date of revision: 2020-12-22T18:23:54+00:00.
+version: '8.x-1.x-ISTWCMS-4487-ebremner-relocate-gesso'
+project: 'uw_fdsu_theme_resp'
+datestamp: 1608661434
diff --git a/gesso_helper/gesso_helper.services.yml b/gesso_helper/gesso_helper.services.yml
new file mode 100644
index 0000000000000000000000000000000000000000..b44649366ac7a7c87782df84a409ab67cdf506a2
--- /dev/null
+++ b/gesso_helper/gesso_helper.services.yml
@@ -0,0 +1,6 @@
+services:
+ gesso_helper.gesso_twig_extension:
+ arguments: ['@renderer']
+ class: Drupal\gesso_helper\TwigExtension\GessoExtensionAdapter
+ tags:
+ - { name: twig.extension }
diff --git a/gesso_helper/src/Commands/GessoHelperCommands.php b/gesso_helper/src/Commands/GessoHelperCommands.php
new file mode 100644
index 0000000000000000000000000000000000000000..ba6a1e7b2b9c6e221c5cf79e23a82ec6d2f82ea6
--- /dev/null
+++ b/gesso_helper/src/Commands/GessoHelperCommands.php
@@ -0,0 +1,216 @@
+<?php
+
+/**
+ * @file
+ * Gesso helper commands.
+ *
+ * phpcs:ignoreFile
+ */
+
+namespace Drupal\gesso_helper\Commands;
+
+use Consolidation\SiteAlias\SiteAliasManagerAwareInterface;
+use Consolidation\SiteAlias\SiteAliasManagerAwareTrait;
+use Drush\Drush;
+use Drush\Commands\DrushCommands;
+use Webmozart\PathUtil\Path;
+
+/**
+ * A Drush commandfile.
+ *
+ * In addition to this file, you need a drush.services.yml
+ * in root of your module, and a composer.json file that provides the name
+ * of the services file to use.
+ *
+ * See these files for an example of injecting Drupal services:
+ * - http://cgit.drupalcode.org/devel/tree/src/Commands/DevelCommands.php
+ * - http://cgit.drupalcode.org/devel/tree/drush.services.yml
+ */
+class GessoHelperCommands extends DrushCommands implements SiteAliasManagerAwareInterface {
+
+ use SiteAliasManagerAwareTrait;
+
+ /**
+ * Create a new theme based on the Gesso theme.
+ *
+ * @param $name
+ * The name of your theme.
+ * @param array $options
+ * An associative array of options whose values come from cli, aliases, config, etc.
+ * @option description
+ * A short description of your new theme.
+ * @option machine-name
+ * The machine-readable name of your new theme. This will be auto-generated from the human-readable name if omitted.
+ * @usage drush gesso "New Theme Name"
+ * Creates a new theme called "New Theme Name" with a machine name of "new_theme_name".
+ * @usage drush gesso "New Theme Name" --machine-name=new_theme
+ * Creates a new theme called "New Theme Name" with a machine name of "new_theme".
+ *
+ * @command gesso
+ * @throws \Exception
+ */
+ public function gesso($name, array $options = ['description' => NULL, 'machine-name' => NULL]) {
+ // Get new theme options.
+ if (!isset($name)) {
+ $name = $options['name'];
+ }
+ $machine_name = $options['machine-name'] ?: $this->gesso_machine_name($name);
+ $description = $options['description'];
+
+ // Validate the command.
+ if (!$this->gesso_theme_exists('gesso')) {
+ throw new \Exception(dt('Where is the Gesso theme? I could not find it.'));
+ }
+
+ if ($this->gesso_theme_exists($machine_name)) {
+ throw new \Exception(dt('A theme with that name already exists. The machine-readable name must be unique.'));
+ }
+
+ if (!$machine_name || !preg_match('/^[a-z][a-z0-9_]*$/', $machine_name)) {
+ throw new \Exception(dt('The machine name was invalid or could not be generated properly. It must start '
+ . 'with a letter and may only contain lowercase letters, numbers, and underscores.'));
+ }
+
+ // Get theme paths.
+ $drupalRoot = Drush::bootstrapManager()->getRoot();
+ $gesso_path = Path::join($drupalRoot, drupal_get_path('theme', 'gesso'));
+ $theme_path = substr($gesso_path, 0, strrpos($gesso_path, '/'));
+ $new_path = Path::join($theme_path, $machine_name);
+
+ // Copy the Gesso theme directory recursively to the new theme’s location.
+ drush_op('drush_copy_dir', $gesso_path, $new_path);
+
+ // Remove Gesso’s helper module from the new theme.
+ $this->gesso_recursive_rm(Path::join($new_path, 'gesso_helper'));
+
+ // Rename the .info.yml file.
+ $gesso_info_file = Path::join($new_path, 'gesso.info.yml');
+ $new_info_file = Path::join($new_path, $machine_name . '.info.yml');
+ drush_op('rename', $gesso_info_file, $new_info_file);
+
+ // Update the .info.yml file based on the command options.
+ $changes = [
+ 'Gesso' => $name,
+ 'Sass-based starter theme.' => $description,
+ 'gesso' => $machine_name,
+ ];
+ $this->gesso_file_str_replace($new_info_file, array_keys($changes), $changes);
+
+ // Rename the .breakpoints.yml file.
+ $gesso_info_file = Path::join($new_path, 'gesso.breakpoints.yml');
+ $new_info_file = Path::join($new_path, $machine_name . '.breakpoints.yml');
+ drush_op('rename', $gesso_info_file, $new_info_file);
+
+ // Rename the .libraries.yml file.
+ $gesso_libraries_file = Path::join($new_path, 'gesso.libraries.yml');
+ $new_libraries_file = Path::join($new_path, $machine_name . '.libraries.yml');
+ drush_op('rename', $gesso_libraries_file, $new_libraries_file);
+
+ // Rename the .theme file.
+ $gesso_theme_file = Path::join($new_path, 'gesso.theme');
+ $new_theme_file = Path::join($new_path, $machine_name . '.theme');
+ drush_op('rename', $gesso_theme_file, $new_theme_file);
+
+ // Replace all occurrences of 'gesso' with the machine name of the new theme.
+ $breakpoints_file = $machine_name . '.breakpoints.yml';
+ $libraries_file = $machine_name . '.libraries.yml';
+ $theme_file = $machine_name . '.theme';
+ $files = [
+ $breakpoints_file,
+ $libraries_file,
+ $theme_file,
+ 'js/scripts.js',
+ 'includes/block.inc',
+ 'includes/field.inc',
+ 'includes/form.inc',
+ 'includes/html.inc',
+ 'includes/navigation.inc',
+ 'includes/taxonomy.inc',
+ 'includes/views.inc',
+ ];
+ foreach ($files as $file) {
+ $this->gesso_file_str_replace(Path::join($new_path, $file), 'gesso', $machine_name);
+ }
+
+ // Notify user of the newly created theme.
+ $this->io()->block(dt(
+ "\nThe \"!name\" theme has been created in: !path\n",
+ [
+ '!name' => $name,
+ '!path' => $new_path,
+ ]
+ ), 'SUCCESS', 'fg=black;bg=green', ' ! ');
+
+ // Warn the user that they might have some additional steps.
+ $this->io()->caution(dt('If you want to remove the gesso theme entirely, be sure to copy and rename the '
+ . 'gesso_helper module first.'));
+ $this->io()->note(dt('The gulp commands for !name are still gessoBuild and gessoWatch. If you want to change '
+ . 'those, you will need to modify the gulpfile and any build processes and/or CI tools.', [
+ '!name' => $name,
+ ]));
+ }
+
+ /**
+ * Converts $name to a machine-readable format.
+ */
+ private function gesso_machine_name($name) {
+ $name = str_replace(' ', '_', strtolower($name));
+ $search = [
+ // Remove characters not valid in function names.
+ '/[^a-z0-9_]/',
+ // Functions must begin with an alpha character.
+ '/^[^a-z]+/',
+ ];
+ $name = preg_replace($search, '', $name);
+ $name = str_replace('__', '_', $name);
+ $name = trim($name, '_');
+
+ return $name;
+ }
+
+ /**
+ * Checks if $theme_name already exists in Drupal.
+ */
+ private function gesso_theme_exists($theme_name) {
+ $theme_handler = \Drupal::service('theme_handler');
+ $themes = $theme_handler->listInfo();
+
+ return isset($themes[$theme_name]);
+ }
+
+ /**
+ * Replace strings in a file.
+ */
+ private function gesso_file_str_replace($file_path, $find, $replace) {
+ $file_path = Path::normalize($file_path);
+ $file_contents = file_get_contents($file_path);
+ $file_contents = str_replace($find, $replace, $file_contents);
+ drush_op('file_put_contents', $file_path, $file_contents);
+ }
+
+ /**
+ * Recursively removes all files and subfolders in a directory,
+ * before finally deleting the directory itself.
+ *
+ * @param string $path
+ * Path to the top-level directory.
+ */
+ private function gesso_recursive_rm($path) {
+ if (is_dir($path)) {
+ $dir_contents = scandir($path);
+ foreach ($dir_contents as $item) {
+ if ($item !== '.' && $item !== '..') {
+ $subpath = Path::join($path, $item);
+ if (is_dir($subpath)) {
+ $this->gesso_recursive_rm($subpath);
+ }
+ else {
+ drush_op('unlink', $subpath);
+ }
+ }
+ }
+ drush_op('rmdir', $path);
+ }
+ }
+
+}
diff --git a/gesso_helper/src/TwigExtension/GessoExtensionAdapter.php b/gesso_helper/src/TwigExtension/GessoExtensionAdapter.php
new file mode 100644
index 0000000000000000000000000000000000000000..5bfbcfd16d53254470ef8de78686470a8a05bf5d
--- /dev/null
+++ b/gesso_helper/src/TwigExtension/GessoExtensionAdapter.php
@@ -0,0 +1,31 @@
+<?php
+
+/**
+ * @file
+ * Gesso helper commands.
+ *
+ * phpcs:ignoreFile
+ */
+
+namespace Drupal\gesso_helper\TwigExtension;
+
+/**
+ * Load custom twig functions from Pattern Lab.
+ */
+class GessoExtensionAdapter extends \Twig_Extension {
+
+ /**
+ *
+ */
+ public function __construct() {
+ GessoExtensionLoader::init();
+ }
+
+ /**
+ *
+ */
+ public function getFunctions() {
+ return GessoExtensionLoader::get();
+ }
+
+}
diff --git a/gesso_helper/src/TwigExtension/GessoExtensionLoader.php b/gesso_helper/src/TwigExtension/GessoExtensionLoader.php
new file mode 100644
index 0000000000000000000000000000000000000000..e9e79cf5db9156557371b585cbbafb9ab432bac8
--- /dev/null
+++ b/gesso_helper/src/TwigExtension/GessoExtensionLoader.php
@@ -0,0 +1,56 @@
+<?php
+
+/**
+ * @file
+ * Gesso helper commands.
+ *
+ * phpcs:ignoreFile
+ */
+
+namespace Drupal\gesso_helper\TwigExtension;
+
+/**
+ * Load custom twig functions from Pattern Lab.
+ */
+class GessoExtensionLoader {
+
+ static $objects = [];
+
+ /**
+ *
+ */
+ public static function init() {
+ if (!self::$objects) {
+ static::loadAll();
+ }
+ }
+
+ /**
+ *
+ */
+ public static function get() {
+ return !empty(self::$objects) ? self::$objects : [];
+ }
+
+ /**
+ *
+ */
+ protected static function loadAll() {
+ //$theme = \Drupal::config('system.theme')->get('default');
+ //$themeLocation = drupal_get_path('theme', $theme);
+ //$themePath = DRUPAL_ROOT . '/' . $themeLocation . '/';
+ $uw_wcms_gesso_path = DRUPAL_ROOT . '/' . drupal_get_path('module', 'uw_wcms_gesso') . '/';
+ //$fullPath = $themePath . 'source/_twig-components/functions/';
+ $fullPath = $uw_wcms_gesso_path . 'source/_twig-components/functions/';
+ static::load($fullPath . 'add_attributes.function.drupal.php');
+ }
+
+ /**
+ *
+ */
+ protected static function load($file) {
+ include $file;
+ self::$objects[] = $function;
+ }
+
+}
diff --git a/source/_patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss b/source/_patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss
index d0db5db26b69a9180d289f2dd9260fdfef987e17..ceb30753fb1bbbed32f490c32c37f34aeac39411 100644
--- a/source/_patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss
+++ b/source/_patterns/04-components/00-cms-styles/layout-builder/_layout-builder.scss
@@ -3,276 +3,305 @@
/* stylelint-disable-next-line selector-no-qualifying-type */
// constraining sections of the theme with the site-container
-.uw-highlighted,
-.block-page-title-block,
-.block-local-tasks-block,
-.node-form,
-.admin-list,
-.js-media-library-view,
-.messages,
-.message,
-.contextual-region.profile,
-.uw-content-moderation,
-form {
- @include uw-contained-width;
- padding: rem(gesso-spacing(sm));
-}
-
-// righ column on edit
-.entity-meta__header{
- background-color:#fffbda;
-}
-.uw-content-moderation__wrapper{
- background-color: gesso-color(ui, warning, background);
- border: 1px solid gesso-color(ui, warning, border);
- font-family:gesso-font-family(systemmedium);
- font-size: gesso-font-size(-1);
- max-width:inherit;
- padding: gesso-spacing(sm);
-}
-
-// overlay popuup
-.ui-dialog .ui-dialog-title{
- font-family:gesso-font-family(condensedbook);
- font-size: rem(gesso-font-size(4));
- font-weight:400;
-}
-.js-media-library-view{
- background: gesso-color(form, fieldset, fieldset-background);
- border: 1px solid #bfbfbf;
- border-radius: 2px;
- padding:rem(gesso-spacing(sm));
-}
-
-// button in popup
-.ui-dialog-buttonpane{
- box-shadow: gesso-box-shadow(6);
-}
-
-.ui-dialog{
+.uw-page {
+ .uw-highlighted,
+ .block-page-title-block,
+ .block-local-tasks-block,
+ .node-form,
+ .admin-list,
+ .js-media-library-view,
+ .messages,
+ .message,
+ .contextual-region.profile,
+ form {
+ @include uw-contained-width;
+ padding: rem(gesso-spacing(sm));
+ @include xl {
+ padding: rem(gesso-spacing(sm)) 0;
+ }
+ }
+
+
+ // righ column on edit
+ .entity-meta__header {
+ background-color: #fffbda;
+ }
+
+
+ // overlay popuup
+ .ui-dialog .ui-dialog-title {
+ font-family: gesso-font-family(condensedbook);
+ font-size: rem(gesso-font-size(4));
+ font-weight: 400;
+ }
+
+ .js-media-library-view {
+ background: gesso-color(form, fieldset, fieldset-background);
+ border: 1px solid #bfbfbf;
+ border-radius: 2px;
+ padding: rem(gesso-spacing(sm));
+ }
+
+ // button in popup
+ .ui-dialog-buttonpane {
+ box-shadow: gesso-box-shadow(6);
+ }
+
+ .ui-dialog {
// Reset the widths put from default size values.
input[size="60"],
- input[size="120"]{
+ input[size="120"] {
max-width: 100%;
width: 100%;
}
- .media-library-widget{
- .fieldset-wrapper{
- display:block;
+ .media-library-widget {
+ .fieldset-wrapper {
+ display: block;
+ }
}
- }
- .description{
- font-size: gesso-font-size(-2);
- font-style:italic;
- }
- .views-display-link{
- font-family: $uw-input-font-family;
- }
- form{
- @include uw-contained-width;
- padding:0 !important;
- }
- .field--widget-entity-reference-paragraphs{
- padding:1rem;
- .field--widget-entity-reference-paragraphs{
- padding:0 !important;
+ .description {
+ font-size: gesso-font-size(-2);
+ font-style: italic;
}
- }
- .field--name-field-uw-ec-items{
- background:inherit;
- padding:inherit;
- }
- // Adjusting the presentation of the tables.
- .field--widget-entity-reference-paragraphs td{
- background:inherit;
- border:1px solid gesso-grayscale('gray-3');
- padding:rem(gesso-spacing(sm));
- }
- .field--widget-entity-reference-paragraphs .field-label{
- border-width:1px 1px 0;
- .label{
+
+ .views-display-link {
+ font-family: $uw-input-font-family;
+ }
+
+ form {
+ @include uw-contained-width;
+ padding: 0 !important;
+ }
+
+ .field--widget-entity-reference-paragraphs {
+ padding: 1rem;
+
+ .field--widget-entity-reference-paragraphs {
+ padding: 0 !important;
+ }
+ }
+
+ .field--name-field-uw-ec-items {
+ background: inherit;
+ padding: inherit;
+ }
+
+ // Adjusting the presentation of the tables.
+ .field--widget-entity-reference-paragraphs td {
+ background: inherit;
+ border: 1px solid gesso-grayscale('gray-3');
+ padding: rem(gesso-spacing(sm));
+ }
+
+ .field--widget-entity-reference-paragraphs .field-label {
+ border-width: 1px 1px 0;
+
+ .label {
+ font-size: gesso-font-size(1);
+ }
+ }
+
+ // Adjusting the drag handles ion the draggable tables.
+ .paragraph-type--uw-para-fact-figure .tabledrag-handle .handle {
+ margin: 0;
+ }
+
+ .draggable .tabledrag-handle {
+
+ cursor: move;
+ float: inherit;
+ height: inherit;
+ margin-left: inherit;
+ overflow: inherit;
+ text-decoration: none;
+
+ .handle {
+ float: left;
+ height: 2rem;
+ padding: 0;
+ width: 2rem;
+
+ }
+ }
+
+ .tabledrag-hide {
+ border-width: 1px 1px 0;
+ font-family: gesso-font-family(condensedbook);
font-size: gesso-font-size(1);
+ font-weight: 400;
+ margin: 0;
+ padding: 0 rem(gesso-spacing(sm));
+ text-align: center;
+
}
- }
- // Adjusting the drag handles ion the draggable tables.
- .paragraph-type--uw-para-fact-figure .tabledrag-handle .handle {
- margin:0;
- }
- .draggable .tabledrag-handle{
-
- cursor: move;
- float:inherit;
- height:inherit;
- margin-left: inherit;
- overflow: inherit;
- text-decoration: none;
- .handle{
- float:left;
- height:2rem;
- padding:0;
- width:2rem;
+ // Removes gap at bottom of editor in dialogue
+ .odd .form-item,
+ .even .form-item {
+ margin-bottom: 0 !important;
+ }
+
+ // Resets the min width.
+ .field-multiple-table {
+ min-width: inherit;
+ }
+
+ // Reset media
+ .media-library-item--grid {
+ padding-bottom: rem(gesso-spacing(lg));
}
- }
- .tabledrag-hide{
- border-width: 1px 1px 0;
- font-family:gesso-font-family(condensedbook);
- font-size: gesso-font-size(1);
- font-weight: 400;
- margin:0;
- padding:0 rem(gesso-spacing(sm));
- text-align:center;
}
- // Removes gap at bottom of editor in dialogue
- .odd .form-item,
- .even .form-item{
- margin-bottom:0 !important;
- }
- // Resets the min width.
- .field-multiple-table{
- min-width:inherit;
+
+ // Token dialog popup.
+ .token-tree-dialog {
+ font-family: $form-font-family;
+
+ table td {
+ padding: rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
+ }
}
- // Reset media
- .media-library-item--grid{
- padding-bottom:rem(gesso-spacing(lg));
+
+ // Makes the flex basis accomodate more characters.
+ .js .paragraph-type-title {
+ flex-basis: 35%;
}
-}
-// Token dialog popup.
-.token-tree-dialog{
- font-family: $form-font-family;
- table td{
- padding:rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
+ .tabledrag-changed.warning {
+ color: #e00 !important;
}
-}
-// Makes the flex basis accomodate more characters.
-.js .paragraph-type-title{
- flex-basis: 35%;
-}
-.tabledrag-changed.warning{
- color: #e00 !important;
-}
-
-
-// Edits of buttons in the wcms forms
-.button,
-button{
-
- .layout-builder-form &,
- .form-actions &
- {
- font-size: rem(gesso-font-size(-2));
- height:2.5rem;
- line-height: 2.75;
- max-width: inherit;
- padding:rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
- &:hover,
- &:focus {
- padding:rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
+
+ // Edits of buttons in the wcms forms
+ .button,
+ button {
+
+ .layout-builder-form &,
+ .form-actions & {
+ font-size: rem(gesso-font-size(-2));
+ height: 2.5rem;
+ line-height: 2.75;
+ max-width: inherit;
+ padding: rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
+
+ &:hover,
+ &:focus {
+ padding: rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
+ }
+ }
+
+ .media-library-content &,
+ .paragraphs-actions &,
+ .paragraph-type-top &,
+ .paragraphs-dropbutton-wrapper & {
+ font-size: rem(gesso-font-size(-2));
+ font-weight: 200;
+ height: inherit;
+ //letter-spacing:inherit;
+ max-width: 12rem;
+ padding: rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
+ width: 100%;
+
+ &:hover,
+ &:focus {
+ padding: rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
+ }
+ }
+
+ .ui-dialog & {
+ margin: rem(gesso-spacing(xs)) 0 0 0;
+
+ }
+
+ .ui-dialog-buttonset.form-actions & {
+ max-width: 10rem;
+ }
+
+ .user-login-form .form-actions & {
+ @include button();
+ }
+
+ .tabledrag-toggle-weight-wrapper & {
+ font-size: gesso-font-size(-2);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+
+ &:hover,
+ &:focus {
+ background: none;
+ font-size: gesso-font-size(-2);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+ }
}
}
- .media-library-content &,
- .paragraphs-actions &,
- .paragraph-type-top &,
- .paragraphs-dropbutton-wrapper &{
- font-size: rem(gesso-font-size(-2));
- font-weight:200;
- height:inherit;
- //letter-spacing:inherit;
- max-width:12rem;
- padding:rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
- width:100%;
+
+ // Reset the button in media dialog
+ .media-library-widget__toggle-weight {
+ font-size: gesso-font-size(-2) !important;
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
+
&:hover,
&:focus {
- padding:rem(gesso-spacing(xs)) rem(gesso-spacing(sm));
+ background: none;
+ font-size: gesso-font-size(-2);
+ font-weight: 200;
+ max-width: 10rem;
+ padding: 0;
+ text-align: inherit;
+ width: inherit;
}
}
- .ui-dialog &{
- margin: rem(gesso-spacing(xs)) 0 0 0;
+ // Removce Box shadow on the dashboard boxes.
+ .layouts-dashboards-3 .drow > div,
+ .layouts-dashboards-2 .drow > div,
+ .layouts-dashboards-1 .drow > div {
+ box-shadow: none;
}
- .ui-dialog-buttonset.form-actions &{
- max-width: 10rem;
+
+ // overlay labels
+ .uw-admin-label {
+ background-color: gesso-grayscale('gray-5') !important;
+ color: #fff;
+ font-family: gesso-font-family(system);
+ font-size: gesso-font-size(-2);
+ left: -1px;
+ padding: 0.2rem 1rem;
+ position: absolute;
+ top: -1.5rem !important;;
}
- .user-login-form .form-actions &{
- @include button();
+
+ // Give padding for the admin labels.
+ .layout-builder__region {
+ padding: rem(gesso-spacing(xxs));
}
- .tabledrag-toggle-weight-wrapper &{
- font-size:gesso-font-size(-2);
- font-weight:200;
- max-width:10rem;
- padding:0;
- text-align:inherit;
- width:inherit;
- &:hover,
- &:focus{
- background:none;
- font-size:gesso-font-size(-2);
- font-weight:200;
- max-width:10rem;
- padding:0;
- text-align:inherit;
- width:inherit;
+
+ .contextual .trigger {
+ color: #f03;
+ width: inherit;
+
+ &:focus {
+ color: #25ffcc;
+ width: inherit;
}
}
-}
-// Reset the button in media dialog
-.media-library-widget__toggle-weight{
- font-size:gesso-font-size(-2) !important;
- font-weight:200;
- max-width:10rem;
- padding:0;
- text-align:inherit;
- width:inherit;
- &:hover,
- &:focus{
- background:none;
- font-size:gesso-font-size(-2);
- font-weight:200;
- max-width:10rem;
- padding:0;
- text-align:inherit;
- width:inherit;
- }
-}
-// Removce Box shadow on the dashboard boxes.
-.layouts-dashboards-3 .drow > div,
-.layouts-dashboards-2 .drow > div,
-.layouts-dashboards-1 .drow > div{
- box-shadow:none;
-}
-
-// overlay labels
-.uw-admin-label {
- background-color: gesso-grayscale('gray-5') !important;
- color: #fff;
- font-family:gesso-font-family(system);
- font-size:gesso-font-size(-2);
- left: -1px;
- padding: 0.2rem 1rem;
- position: absolute;
- top: -1.5rem !important;;
-}
-// Give padding for the admin labels.
-.layout-builder__region{
- padding:rem(gesso-spacing(xxs));
-}
-.contextual .trigger{
- color:#f03;
- width:inherit;
-
- &:focus{
- color: #25ffcc;
- width:inherit;
- }
-}
-// Color for button in dialog
-.paragraphs-dropdown-action.button {
- color: gesso-grayscale('gray-6');
+ // Color for button in dialog
+ .paragraphs-dropdown-action.button {
+ color: gesso-grayscale('gray-6');
+ }
}
\ No newline at end of file
diff --git a/uw_wcms_gesso.info.yml b/uw_wcms_gesso.info.yml
new file mode 100644
index 0000000000000000000000000000000000000000..969753ffd7c7edd7c36693463c1aad1b4d663f7d
--- /dev/null
+++ b/uw_wcms_gesso.info.yml
@@ -0,0 +1,23 @@
+name: 'WCMS Gesso'
+description: 'Provides stylinbs to WCMS'
+type: module
+core_version_requirement: '^8 || ^9'
+component-libraries:
+ global:
+ paths:
+ - source/_patterns/01-global
+ base:
+ paths:
+ - source/_patterns/02-base
+ layouts:
+ paths:
+ - source/_patterns/03-layouts
+ components:
+ paths:
+ - source/_patterns/04-components
+ templates:
+ paths:
+ - source/_patterns/05-templates
+ marcos:
+ paths:
+ - source/_macros