From 4ac9fa081a7c045f6a9f1cfc529d82423f485b2e Mon Sep 17 00:00:00 2001 From: Pierre Schmitz Date: Sun, 8 Dec 2013 09:55:49 +0100 Subject: Update to MediaWiki 1.22.0 --- .../sourcefiles/scss/components/_default.scss | 3 + .../sourcefiles/scss/components/_utilities.scss | 17 +++ .../sourcefiles/scss/components/_vector.scss | 4 + .../scss/components/default/_buttons.scss | 69 +++++++++++++ .../scss/components/default/_forms.scss | 114 +++++++++++++++++++++ .../scss/components/vector/_buttons.scss | 19 ++++ .../scss/components/vector/_containers.scss | 5 + .../sourcefiles/scss/components/vector/_forms.scss | 7 ++ .../sourcefiles/scss/mediawiki.ui.default.scss | 16 +++ .../sourcefiles/scss/mediawiki.ui.vector.scss | 15 +++ .../mediawiki.ui/sourcefiles/scss/mixins/_all.scss | 4 + .../sourcefiles/scss/mixins/_effects.scss | 62 +++++++++++ .../sourcefiles/scss/mixins/_forms.scss | 66 ++++++++++++ .../sourcefiles/scss/mixins/_type.scss | 6 ++ .../sourcefiles/scss/mixins/_utilities.scss | 19 ++++ .../sourcefiles/scss/settings/_all.scss | 2 + .../sourcefiles/scss/settings/_colors.scss | 17 +++ .../sourcefiles/scss/settings/_typography.scss | 5 + 18 files changed, 450 insertions(+) create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/_default.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/_utilities.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/_vector.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/vector/_buttons.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/vector/_containers.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/components/vector/_forms.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mediawiki.ui.default.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mediawiki.ui.vector.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mixins/_all.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mixins/_effects.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mixins/_forms.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mixins/_type.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/mixins/_utilities.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/settings/_all.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/settings/_colors.scss create mode 100644 resources/mediawiki.ui/sourcefiles/scss/settings/_typography.scss (limited to 'resources/mediawiki.ui/sourcefiles/scss') diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/_default.scss b/resources/mediawiki.ui/sourcefiles/scss/components/_default.scss new file mode 100644 index 00000000..e7090ebc --- /dev/null +++ b/resources/mediawiki.ui/sourcefiles/scss/components/_default.scss @@ -0,0 +1,3 @@ +@import "utilities"; +@import "default/buttons"; +@import "default/forms"; \ No newline at end of file diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/_utilities.scss b/resources/mediawiki.ui/sourcefiles/scss/components/_utilities.scss new file mode 100644 index 00000000..4f1dba2f --- /dev/null +++ b/resources/mediawiki.ui/sourcefiles/scss/components/_utilities.scss @@ -0,0 +1,17 @@ +// Generic helper classes that could be used in many elements/layouts + +// -------------------------------------------------------------------------- +// Positioning +// -------------------------------------------------------------------------- + +.mw-ui-flush-left { + @include agora-flush-left; +} + +.mw-ui-flush-right { + @include agora-flush-right; +} + +.mw-ui-center-block { + @include agora-center-block; +} \ No newline at end of file diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/_vector.scss b/resources/mediawiki.ui/sourcefiles/scss/components/_vector.scss new file mode 100644 index 00000000..d7cb34ae --- /dev/null +++ b/resources/mediawiki.ui/sourcefiles/scss/components/_vector.scss @@ -0,0 +1,4 @@ +@import "utilities"; +@import "vector/buttons"; +@import "vector/forms"; +@import "vector/containers"; diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss b/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss new file mode 100644 index 00000000..d67810f7 --- /dev/null +++ b/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss @@ -0,0 +1,69 @@ +$buttonBorderRadius: 3px; + +// Button styling +.mw-ui-button { + // Container layout + @include inline-block; + padding: 0.4em 1em 0.4em 1em; + margin: 0; + + // Container styling + @include buttonColors($agoraGray); + @include border-radius($buttonBorderRadius); + + // Content styling + vertical-align: middle; + + text: { + align: center; + decoration: none; + } + + font: { + weight: bold; + } + + // Interaction styling + cursor: pointer; + + &:disabled, + &.mw-ui-disabled { + cursor: default; + } + + // Button sizes and displays + // ----------------------------------------- + &.mw-ui-big { + font: { + size: $baseFontSize * 1.3; + } + } + &.mw-ui-block { + display: block; + width: 100%; + } +} + +// This overrides an underline declaration on a:hover and a:focus in commonElements.css, which the +// class alone isn't specific enough to do +a.mw-ui-button { + text: { + decoration: none; + } +} + +// Button groups +.mw-ui-button-group > * { + @include border-radius(0); + float: left; + + &:first-child{ + @include border-top-left-radius($buttonBorderRadius); + @include border-bottom-left-radius($buttonBorderRadius); + } + + &:last-child{ + @include border-top-right-radius($buttonBorderRadius); + @include border-bottom-right-radius($buttonBorderRadius); + } +} diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss b/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss new file mode 100644 index 00000000..a9cec39a --- /dev/null +++ b/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss @@ -0,0 +1,114 @@ +// Form elements and layouts + +// -------------------------------------------------------------------------- +// Layouts +// -------------------------------------------------------------------------- + +// The FancyCaptcha image CAPTCHA used on WMF wikis drives the width of the +// 'VForm' design, the form can't be narrower than this. +$captchaContainerWidth: 290px; +$defaultFormWidth: $captchaContainerWidth; + +// Style a compact vertical stacked form ("VForm") and the elements in divs +// within it. +.mw-ui-vform { + @include box-sizing(border-box); + + width: $defaultFormWidth; + + // Immediate divs in a vform are block and spaced-out. + & > div { + display: block; + margin: 0 0 15px 0; + padding: 0; + width: 100%; + + // MW currently doesn't use the type attribute everywhere on inputs. + input, + .mw-ui-button { + display: block; + @include box-sizing(border-box); + margin: 0; + width: 100%; + } + + // We exclude these because they'll generally use mw-ui-button. + // Otherwise, we'll unintentionally override that. + input:not([type=button]):not([type=submit]):not([type=file]), { + @include agora-field-styling; // mixins/_forms.scss + } + + label { + display: block; + @include box-sizing(border-box); + @include agora-label-styling; + width: auto; + margin: 0 0 0.2em 0; + padding: 0; + } + + // Override input styling just for checkboxes and radio inputs. + input[type="checkbox"], + input[type="radio"] { + display: inline; + @include box-sizing(content-box); + width: auto; + } + + } + + // HTMLForm uses error, SpecialUserlogin (login and create account) uses + // errorbox. + // TODO move errorbox from mediawiki.special.vforms.css into here. + .error { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + font-size: 0.9em; + margin: 0 0 1em 0; + padding: 0.5em; + color: #cc0000; + border: 1px solid #fac5c5; + background-color: #fae3e3; + text-shadow: 0 1px #fae3e3; + word-wrap: break-word; + } +} + +// -------------------------------------------------------------------------- +// Elements +// -------------------------------------------------------------------------- + +// Apply this to individual elements to style them. +// You generally don't need to use this class on divs within an Agora +// form container such as mw-ui-vform +// XXX DRY: This repeats earlier styling, use an @include agora-div-styling ? +.mw-ui-vform-div { + display: block; + margin: 0 0 15px 0; + padding: 0; + width: 100%; +} + +// Apply mw-ui-input to individual input fields to style them. +// You generally don't need to use this class if is within an Agora +// form container such as mw-ui-vform +.mw-ui-input { + @include agora-field-styling; // mixins/_forms.scss +} + +// Apply mw-ui-label to individual elements to style them. +// You generally don't need to use this class if