Commit fd38baca authored by Chris Shantz's avatar Chris Shantz
Browse files

Merge branch '3.0.x' into prod/3.0.x

parents c7256d60 01baaf08
......@@ -3,8 +3,4 @@
.DS_Store
gesso/
!gesso/gesso_helper
css/pattern-lab.css
css/pattern-lab.scss
css/styles.scss
css/styles.css
css/uw-dashboards.css
css/
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -42,6 +42,31 @@ const compileComponentScripts = () => {
const cssSrc = path.join(__dirname, '..', 'css');
const PLSrc = [
path.join(__dirname, '/source/pattern-lab.scss')
];
const compilePLStyles = () => {
return src(PLSrc)
.pipe(sassGlob())
.pipe(sourcemaps.init())
.pipe(
sass({
includePaths: ['./node_modules/breakpoint-sass/stylesheets'],
precision: 10,
})
)
.pipe(
postcss([
require('postcss-assets')(),
require('autoprefixer')({
remove: false,
}),
])
)
.pipe(dest(cssSrc));
};
const buildConfig = async() => {
const scssDir = path.join(__dirname, '/source/_patterns/00-config');
const ymlDir = path.join(__dirname, './source/_data');
......@@ -211,12 +236,14 @@ const buildComponentScripts = (exports.buildScripts = series(compileComponentScr
const buildStyles = (exports.buildStyles = series(lintStyles, compileStyles, minifyCSS, compileLayoutStyles, minifyLayoutsCSS));
const buildPLStyle = (exports.buildPLStyles = series(compilePLStyles));
const build = (isProduction = true ) => {
const scriptTask = isProduction ? bundleScripts : bundleScriptsDev;
task('bundleScripts', scriptTask)
return series(
buildConfig,
parallel(task('bundleScripts'), buildStyles, buildComponentScripts, buildPatternLab));
parallel(task('bundleScripts'), buildStyles, buildComponentScripts, buildPLStyle, buildPatternLab));
}
exports.build = build(true);
......
......@@ -338,23 +338,6 @@ else if (e.keyCode === 37) {
};
})(jQuery, Drupal);
/**
* @file
* Ckeditor Modal.
*/
(function ($, Drupal) {
if ($.ui && $.ui.dialog) {
orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function (event) {
if ($(event.target).closest('.cke_dialog').length) {
return true;
}
return orig_allowInteraction.apply(this, arguments);
};
}
})(jQuery, Drupal);
/**
* @file
*/
......@@ -390,6 +373,23 @@ else {
};
})(jQuery);
/**
* @file
* Ckeditor Modal.
*/
(function ($, Drupal) {
if ($.ui && $.ui.dialog) {
orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
$.ui.dialog.prototype._allowInteraction = function (event) {
if ($(event.target).closest('.cke_dialog').length) {
return true;
}
return orig_allowInteraction.apply(this, arguments);
};
}
})(jQuery, Drupal);
/**
* @file
*/
......
......@@ -3,21 +3,9 @@
$button-border-radius: 0 !default;
$button-background-color: gesso-color(button, default, background) !default;
$button-background-color-active: gesso-color(
button,
default,
background-active
) !default;
$button-background-color-disabled: gesso-color(
button,
disabled,
background
) !default;
$button-background-color-hover: gesso-color(
button,
default,
background-hover
) !default;
$button-background-color-active: gesso-color( button, default, background-active) !default;
$button-background-color-disabled: gesso-color( button, disabled, background) !default;
$button-background-color-hover: gesso-color( button, default, background-hover) !default;
$button-background-image: none !default;
$button-text-color: gesso-color(button, default, text) !default;
$button-text-color-active: gesso-color(button, default, text-active) !default;
......@@ -48,7 +36,7 @@ $button-font-size: gesso-font-size(1) !default;
display: inline-block;
font-family: gesso-font-family(condensedbook);
font-size: gesso-font-size(1);
font-weight: gesso-font-weight(bold);
font-weight: gesso-font-weight(regular);
letter-spacing: 0.055rem;
line-height: gesso-line-height(base);
max-width:18.125rem;
......
......@@ -67,6 +67,18 @@ $test-color-12: #f00;
right: 0;
width: 100%;
}
@mixin uw-contained-width-reset() {
margin-left:inherit;
margin-right: inherit;
max-width:inherit;
padding: inherit;
@include xl{
padding-left:inherit;
padding-right:inherit;
}
}
// Flexbox display
@mixin flexbox {
......
......@@ -23,6 +23,21 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color: $uw-grey;
}
}
&.local-site-footer{
color: $uw-local-site-footer-background-color;
&:visited{
color: $uw-local-site-footer-background-color;
}
&:hover,
&:focus,
&:active
{
color:$uw-white;
}
}
}
.menu--uw-footer li a{
color: $uw-white;
......@@ -32,7 +47,8 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-gold;
}
}
.uw-site-footer__content a{
.uw-site-footer__content a,
.uw-site-footer__title a{
color: $uw-white;
&:visited,
&:hover,
......@@ -42,6 +58,14 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-white;
}
}
.uw-site-footer__social-media a {
&:visited,
&:hover,
&:focus,
&:active{
color:gesso-grayscale(gray-5);
}
}
.uw-footer__social-directory a{
&:link,
&:visited {
......@@ -52,6 +76,7 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-gold;
}
}
.uw-footer-phone a,
.uw-territorial a{
&:link,
&:visited {
......@@ -68,6 +93,15 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color: $uw-black !important;
}
}
.pager__item a{
&:hover,
&:focus{
color:$uw-black !important;
}
}
.uw-site-footer__content .highlight{
color: $uw-white;
}
}
// Else run the loop on the faculties.
@else {
......@@ -123,7 +157,8 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-gold;
}
}
.uw-site-footer__content a{
.uw-site-footer__content a,
.uw-site-footer__title a{
color: $uw-white;
&:visited,
&:hover,
......@@ -133,6 +168,15 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-white;
}
}
.uw-site-footer__social-media a {
&:visited,
&:hover,
&:focus,
&:active{
color:gesso-grayscale(gray-5);
}
}
.uw-footer__social-directory a{
&:link,
&:visited {
......@@ -172,6 +216,9 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
color:$uw-black;
}
}
.uw-site-footer__content .highlight{
color: $uw-white;
}
}
}
}
......@@ -4,12 +4,32 @@ $form-font-family: gesso-font-family(book) !default;
$form-label-font-family: gesso-font-family(condensedbook) !default;
$form-legend-font-family: gesso-font-family(book) !default;
$form-input-font-family: gesso-font-family(system) !default;
$form-description-color: gesso-grayscale(gray-5) !default;
$form-gap: gesso-spacing(xs);
form{
font-family:$form-font-family;
font-size: gesso-font-size(-1);
font-weight:400;
}
[data-drupal-selector="edit-moderation-state-wrapper"]{
background-color:#ffebc5;
padding:1rem;
.form-item-moderation-state-0-current{
font-style:italic;
label{
font-size:gesso-font-size(0);
font-style:normal;
margin-bottom:0;
}
}
}
// Login screen making width 35rem.
.user-login-form{
margin:0;
max-width:35rem;
}
// Don’t style button elements, since they’re often styled as links for
// accessible widgets. Use the .button class in components/button.
button {
......@@ -43,6 +63,7 @@ fieldset {
// partials/components/button.
input {
line-height: normal;
}
// input[type='button'] {}
......@@ -71,6 +92,7 @@ input {
label,
.label,
.uw-label{
display:block;
font-family: $form-label-font-family;
font-size: gesso-font-size(2);
font-weight: gesso-font-weight(regular);
......@@ -82,18 +104,27 @@ label,
}
.desription{
.desription,
.webform-element-description{
color:$form-description-color;
font-family: $form-font-family;
font-size: gesso-font-size(-1);
font-style: italic;
margin: .25rem 0;
}
// uw custon label css
.webform-client-form {
margin-top: 0.75rem;
}
//.required::after {
// content: "*";
//}
.form-required::after {
color:#e00;
content: "*";
display:inline-block;
font-family:gesso-font-family(system);
font-size: gesso-font-size(2);
font-weight: gesso-font-weight(regular);
margin-left:0.125rem;
}
.option {
display: inline;
......@@ -152,9 +183,7 @@ textarea {
border-top:1px solid gesso-color(ui, generic, background);
bottom: 0;
box-shadow: gesso-box-shadow(6);
display:block;
grid-template-columns:auto;
grid-template-rows:auto;
display:flex;
height:auto;
left: 0;
margin: 0;
......@@ -162,19 +191,19 @@ textarea {
position: fixed;
width: 100%;
z-index: gesso-z-index(overlay);
[data-drupal-selector="edit-preview-toggle"]{
order:10;
}
.button{
margin:0.25rem 0;
max-width:7rem;
}
@include medium {
.button{
margin-bottom:1rem ;
}
column-gap: 0.5rem;
display:grid;
grid-template-columns:8rem 8rem 8rem 12rem 10rem;
grid-template-rows:auto;
gap:$form-gap;
height:4rem;
row-gap: 1rem;
}
.form-item-toggle-content-preview {
......@@ -190,6 +219,18 @@ textarea {
}
}
.webform-submission-form{
.form-actions{
display:flex;
gap:1rem;
margin:0.25rem 0;
.button{
@include button();
height:inherit;
margin:inherit;
}
}
}
// custom form actions
.layout-region-node-footer__content .form-actions{
.button[data-drupal-selector="edit-cancel"]{
......
......@@ -7,13 +7,27 @@ $uw-input-box-shadow-focus: gesso-color(form, input, input-border) !default;
$uw-input-font-family: gesso-font-family(systemmedium) !default;
$uw-input-font-size: gesso-font-size(0) !default;
$uw-input-text-color: gesso-color(form, input, input-color) !default;
$uw-input-padding: rem(gesso-spacing(xs));
$uw-input-padding: 0.46667rem;
.uw-input,
.form-text{
.form-text,
.form-email,
.form-color,
.form-date,
.form-email,
.form-month,
.form-number,
.form-password,
.form-search,
.form-tel,
.form-text,
.form-textarea,
.form-time,
.form-url,
.form-week{
background-color:$uw-input-background-color;
border: 1px solid $uw-input-border-color;
border-radius: 3px;
......@@ -25,14 +39,80 @@ $uw-input-padding: rem(gesso-spacing(xs));
max-width:inherit;
padding: $uw-input-padding;
transition: border-color;
width: auto;
width: 100%;
&:focus {
border: 1px solid $uw-input-border-color-focus;
border: 1px solid $uw-input-border-color-focus !important;
box-shadow: inset 0 1px 3px rgba(0,0,0,.06), 0 0 5px rgba(104,104,104,.7);
outline:$uw-input-border-color-focus;
}
&--submit {
@include button();
font-weight:200 !important;
}
// make the input after prefix be inline
}
.webform-has-field-prefix,
.webform-has-field-suffix,
.captcha {
.form-text{
width:auto !important;
}
}
.bef-toggle{
display:block;
margin:1rem 0;
}
.form-select{
background-color:$uw-input-background-color;
border: 1px solid $uw-input-border-color;
border-radius: 3px;
box-shadow: inset 0 1px 3px $uw-input-border-color;
box-sizing: border-box;
color: $uw-input-text-color;
font-family: $uw-input-font-family;
font-size: $uw-input-font-size;
padding: $uw-input-padding;
transition: border-color;
width: 100%;
.form-item-moderation-state-0-state &{
width:auto;
}
}
input[size="60"] {
max-width: 100%;
width: 100%;
}
// Autocomplete
/* stylelint-disable */
.js {
input {
&.form-autocomplete {
background-position: 99.5% center;
}
}
}
/* stylelint-enable */// Autocomplete ul li a.
.ui-autocomplete {
.ui-menu-item{
.ui-menu-item-wrapper,
a{
color:$uw-black !important;
display: block;
font-family:$uw-input-font-family !important;
margin-right:0.4rem;
text-decoration:none;
&:hover,
&:focus,
&:active{
background:gesso-brand('org-default', uw-gold, lvl1);
}
}
}
}
{% include '@base/02-html-elements/27-input/input.twig' with {
'type': type,
'value': value,
'classes': 'uw-input--submit'
} %}
\ No newline at end of file
'classes': classes,
} %}
......@@ -3,77 +3,85 @@
.uw-footer {
background-color: #000;
margin-top: 0;
min-height: 3rem;
padding: 0;
width: 100%;
&__wrapper {
@include uw-contained-width;
display: grid;
grid-template-columns: 100%;
padding: gesso-spacing(sm);
padding-top: gesso-spacing(sm);
text-size-adjust: none;
@include xs {
grid-template-columns:50% 50%;
}
@include medium {
grid-template-columns: 28% auto 35%;
grid-template-columns: 28% auto 14rem;
}
@include large {
grid-template-columns: 25% auto 30%;
grid-template-columns: 28% auto 16rem;
}
}
&__address {
font-family: gesso-font-family(systemmedium);
font-size: gesso-font-size(-2);
grid-column: 1 / 2;
font-size: gesso-font-size(-1);
-webkit-font-smoothing: antialiased;
grid-column: 1 / 3;
grid-row: 1 / 2;
margin-left: auto;
margin-right: auto;
padding-bottom: gesso-spacing(sm);
padding: gesso-spacing(sm) 0 gesso-spacing(md);
text-align:center;
@include medium {
grid-column: 1 / 3;
font-size: gesso-font-size(-2);
grid-column: 1 / 2;
grid-row: 1 / 2;
margin:0;
padding:0;
text-align:left;
}
@include large {
grid-column: 1 / 2;
grid-row: 1 / 2;
font-size: gesso-font-size(-1);
}
}
&__menu {
grid-column: 1 / 2;
grid-row: 2 / 3;
@include medium {
grid-column: 2 / 3;
grid-row: 1 / 2;
-webkit-font-smoothing: antialiased;
grid-column: 1 / 3;
padding-bottom: gesso-spacing(sm);
@include xs {
grid-column: 1 / 2;
grid-row: 2 / 3;
}
@include large {
@include medium {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
}
&__social {
grid-column: 1 / 2;
//background:$test-color-2;
<