Commit 989b96b8 authored by Martin Leblanc's avatar Martin Leblanc Committed by Kevin Paxman
Browse files

additional css for form range and css/yml for the mailman form

parent 9cfb715d
This diff is collapsed.
This diff is collapsed.
/**
* @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
*/
......@@ -64,6 +47,76 @@
* @file
*/
/**
* @file
*/
(function ($, Drupal) {
Drupal.behaviors.expandcollapse = {
attach: function (context, settings) {
$(document).ready(function () {
$('.uw-expand-collapse').each(function () {
// Get the id of the expand collapse.
var id = '#uw-expand-collapse-' + $(this).data('id');
// When the expand all button is clicked, expand all the items.
$(id + ' [data-type="expand-all"]').click(function () {
// Find each of the buttons, which are the titles and change
// aria-expanded and add class to show expanded.
$(id + ' .uw-expand-collapse__items button').each(function () {
$(this).attr('aria-expanded', true);
$(this).addClass('uw-expanded');
});
// Find each of the text and add css to display them.
$(id + ' .uw-expand-collapse__items .uw-expand-collapse__text').each(function () {
$(this).css('display', 'block');
});
});
// When the collapse all button is clicked, collapse all the items.
$(id + ' [data-type="collapse-all"]').click(function () {
// Find each of the buttons, which are the titles and change
// aria-expanded and remove class to show collapsed.
$(id + ' .uw-expand-collapse__items button').each(function () {
$(this).attr('aria-expanded', true);
$(this).removeClass('uw-expanded');
});
// Find each of the text and add css to display them.
$(id + ' .uw-expand-collapse__items .uw-expand-collapse__text').each(function () {
$(this).css('display', 'none');
});
});
// Step through each of the titles and add a click function.
$(id + ' .uw-expand-collapse__items button').click(function () {
// If this has an expanded class, remove it and change aria expanded to false.
// Otherwise add the expanded class and set aria-expanded to true.
if ($(this).hasClass('uw-expanded')) {
$(this).attr('aria-expanded', false);
$(this).removeClass('uw-expanded');
}
else {
$(this).attr('aria-expanded', true);
$(this).addClass('uw-expanded');
}
// Toggle the text to show/hide.
$(this).parent().parent().find('.uw-expand-collapse__text').toggle();
})
});
});
}
};
})(jQuery, Drupal);
/**
* @file
*/
......@@ -179,76 +232,6 @@
};
})(jQuery, Drupal);
/**
* @file
*/
(function ($, Drupal) {
Drupal.behaviors.expandcollapse = {
attach: function (context, settings) {
$(document).ready(function () {
$('.uw-expand-collapse').each(function () {
// Get the id of the expand collapse.
var id = '#uw-expand-collapse-' + $(this).data('id');
// When the expand all button is clicked, expand all the items.
$(id + ' [data-type="expand-all"]').click(function () {
// Find each of the buttons, which are the titles and change
// aria-expanded and add class to show expanded.
$(id + ' .uw-expand-collapse__items button').each(function () {
$(this).attr('aria-expanded', true);
$(this).addClass('uw-expanded');
});
// Find each of the text and add css to display them.
$(id + ' .uw-expand-collapse__items .uw-expand-collapse__text').each(function () {
$(this).css('display', 'block');
});
});
// When the collapse all button is clicked, collapse all the items.
$(id + ' [data-type="collapse-all"]').click(function () {
// Find each of the buttons, which are the titles and change
// aria-expanded and remove class to show collapsed.
$(id + ' .uw-expand-collapse__items button').each(function () {
$(this).attr('aria-expanded', true);
$(this).removeClass('uw-expanded');
});
// Find each of the text and add css to display them.
$(id + ' .uw-expand-collapse__items .uw-expand-collapse__text').each(function () {
$(this).css('display', 'none');
});
});
// Step through each of the titles and add a click function.
$(id + ' .uw-expand-collapse__items button').click(function () {
// If this has an expanded class, remove it and change aria expanded to false.
// Otherwise add the expanded class and set aria-expanded to true.
if ($(this).hasClass('uw-expanded')) {
$(this).attr('aria-expanded', false);
$(this).removeClass('uw-expanded');
}
else {
$(this).attr('aria-expanded', true);
$(this).addClass('uw-expanded');
}
// Toggle the text to show/hide.
$(this).parent().parent().find('.uw-expand-collapse__text').toggle();
})
});
});
}
};
})(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 {
......
......@@ -503,4 +503,4 @@ $gesso: (
xxl: 96px,
),
gutter-width: 40px,
);
\ No newline at end of file
);
......@@ -5,7 +5,7 @@ $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);
......@@ -202,7 +202,7 @@ textarea {
.button{
margin-bottom:1rem ;
}
gap:1rem;
gap:$form-gap;
height:4rem;
}
......
......@@ -47,7 +47,7 @@ $uw-input-padding: 0.46667rem;
}
&--submit {
@include button();
font-weight:200 !important;
}
// make the input after prefix be inline
......@@ -78,7 +78,7 @@ $uw-input-padding: 0.46667rem;
width:auto;
}
}
//input[size="60"] {
// max-width: 100%;
// width: 100%;
//}
input[size="60"] {
max-width: 100%;
width: 100%;
}
{% 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,
} %}
......@@ -11,7 +11,9 @@ $form-text-size: gesso-base-font-size() !default;
.form-item {
margin: 0 0 rem(gesso-spacing(sm));
.form--inline .form-checkboxes &{
margin:inherit;
}
}
.form-item__label {
display: block;
......
......@@ -35,7 +35,21 @@ $form-range-track-height: 10px !default;
width: 100%;
}
.form-item--range {
.form-item--range,
.form-type-range {
> label{
margin-bottom:gesso-spacing(md);
}
margin-bottom:gesso-spacing(xl);
output{
&[data-display="above"]{
}
&[data-display="below"]{
}
}
.form-range,
.form-item__range {
appearance: none;
background: transparent;
......@@ -108,7 +122,8 @@ $form-range-track-height: 10px !default;
}
}
&.is-full-width > .form-item__range {
&.is-full-width > .form-item__range,
&.is-full-width > .form-range{
width: 100%;
}
}
.uw-mailman {
padding: rem(gesso-spacing(sm)) 0;
width: 100%;
form{
@include uw-contained-width-reset();
width: 100%;
}
&__label {
display: block;
margin-bottom: rem(gesso-spacing(xs));
&--email {
font-family: gesso-font-family(condensedbook);
font-size:rem(gesso-font-size(3));
font-weight: gesso-font-weight(regular);
}
&__email {
display:grid;
gap:$form-gap;
grid-template-columns: auto 6rem;
@include medium{
grid-template-columns: auto 9rem;
}
}
&__servername {
text-align: center;
}
}
.uw-mailmain__email{
.uw-input--submit{
font-size:rem(gesso-font-size(0));
font-weight: gesso-font-weight(regular);
max-width:8.5rem;
}
}
......@@ -11,7 +11,8 @@
} %}
{% include '@base/02-html-elements/27-input/input--submit.twig' with {
'type': 'submit',
'value': 'Subscribe'
'value': 'Subscribe',
'classes': 'uw-input--submit button--medium'
} %}
</div>
</form>
......
......@@ -2,3 +2,4 @@ mailman:
server: 'lists.uwaterloo.ca (a.k.a. mailman.uwaterloo.ca)'
servername: 'uwweb'
uniqueid: '1111111'
classes: 'uw-input--submit button--medium'
......@@ -21,6 +21,7 @@
margin-right:0.25rem;
}
form {
width: 100%;
ul,li{
list-style: none;
margin:0;
......@@ -31,11 +32,12 @@
font-size:gesso-font-size(-1);
font-weight:200;
letter-spacing:inherit;
padding-left:0.25rem;
padding-left:gesso-spacing(sm);
}
width: 100%;
.uw-input,
.form-text,
select{
width:inherit;
width:100%;
}
.button,
.image-button {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment