diff options
Diffstat (limited to 'resources/mediawiki.ui/sourcefiles/scss/components/default')
-rw-r--r-- | resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss | 69 | ||||
-rw-r--r-- | resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss | 114 |
2 files changed, 0 insertions, 183 deletions
diff --git a/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss b/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss deleted file mode 100644 index d67810f7..00000000 --- a/resources/mediawiki.ui/sourcefiles/scss/components/default/_buttons.scss +++ /dev/null @@ -1,69 +0,0 @@ -$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 deleted file mode 100644 index a9cec39a..00000000 --- a/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss +++ /dev/null @@ -1,114 +0,0 @@ -// 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 <input> 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 <label> is within an Agora -// form container such as mw-ui-vform -.mw-ui-label { - @include agora-label-styling; // mixins/_forms.scss -} - -// Nesting an input checkbox or radio button inside a label with this class -// improves alignment, e.g. -// <label class="mw-ui-checkbox-label"> -// <input type="checkbox">The label text -// </label> -.mw-ui-checkbox-label, .mw-ui-radio-label { - @include agora-inline-label-styling; -} |