From 7ad1ee2e22a3d961ec7f6de1c76ff904fe8b175f Mon Sep 17 00:00:00 2001 From: Brian Baker Date: Wed, 27 Feb 2013 20:09:35 -0700 Subject: [PATCH 01/25] added bootstrap less files and compiled css inside of f2-example-container namespace --- examples/container-amd/css/README.md | 12 + examples/container-amd/css/bootstrap.min.css | Bin 118028 -> 386408 bytes .../css/bootstrap/accordion.less | 34 + .../container-amd/css/bootstrap/alerts.less | 65 ++ .../css/bootstrap/bootstrap.less | 62 ++ .../css/bootstrap/breadcrumbs.less | 24 + .../css/bootstrap/button-groups.less | 245 +++++++ .../container-amd/css/bootstrap/buttons.less | 231 ++++++ .../container-amd/css/bootstrap/carousel.less | 131 ++++ .../container-amd/css/bootstrap/close.less | 31 + .../container-amd/css/bootstrap/code.less | 58 ++ .../css/bootstrap/component-animations.less | 22 + .../css/bootstrap/dropdowns.less | 210 ++++++ .../container-amd/css/bootstrap/forms.less | 650 +++++++++++++++++ .../container-amd/css/bootstrap/grid.less | 21 + .../css/bootstrap/hero-unit.less | 24 + .../css/bootstrap/labels-badges.less | 72 ++ .../container-amd/css/bootstrap/layouts.less | 16 + .../container-amd/css/bootstrap/mixins.less | 681 ++++++++++++++++++ .../container-amd/css/bootstrap/modals.less | 98 +++ .../container-amd/css/bootstrap/navbar.less | 475 ++++++++++++ .../container-amd/css/bootstrap/navs.less | 384 ++++++++++ .../container-amd/css/bootstrap/pager.less | 40 + .../css/bootstrap/pagination.less | 64 ++ .../container-amd/css/bootstrap/popovers.less | 117 +++ .../css/bootstrap/progress-bars.less | 122 ++++ .../container-amd/css/bootstrap/reset.less | 137 ++++ .../css/bootstrap/responsive-1200px-min.less | 28 + .../css/bootstrap/responsive-767px-max.less | 174 +++++ .../css/bootstrap/responsive-768px-979px.less | 19 + .../css/bootstrap/responsive-navbar.less | 177 +++++ .../css/bootstrap/responsive-utilities.less | 43 ++ .../css/bootstrap/responsive.less | 48 ++ .../css/bootstrap/scaffolding.less | 52 ++ .../container-amd/css/bootstrap/sprites.less | 193 +++++ .../container-amd/css/bootstrap/tables.less | 245 +++++++ .../css/bootstrap/thumbnails.less | 52 ++ .../container-amd/css/bootstrap/tooltip.less | 70 ++ .../container-amd/css/bootstrap/type.less | 221 ++++++ .../css/bootstrap/utilities.less | 30 + .../css/bootstrap/variables.less | 279 +++++++ .../container-amd/css/bootstrap/wells.less | 29 + examples/container-amd/css/container.css | 14 + .../container-amd/css/namespaced-css.less | 4 + examples/container-amd/index.html | 3 +- examples/container/css/README.md | 12 + examples/container/css/bootstrap.min.css | Bin 118028 -> 386408 bytes .../container/css/bootstrap/accordion.less | 34 + examples/container/css/bootstrap/alerts.less | 65 ++ .../container/css/bootstrap/bootstrap.less | 62 ++ .../container/css/bootstrap/breadcrumbs.less | 24 + .../css/bootstrap/button-groups.less | 245 +++++++ examples/container/css/bootstrap/buttons.less | 231 ++++++ .../container/css/bootstrap/carousel.less | 131 ++++ examples/container/css/bootstrap/close.less | 31 + examples/container/css/bootstrap/code.less | 58 ++ .../css/bootstrap/component-animations.less | 22 + .../container/css/bootstrap/dropdowns.less | 210 ++++++ examples/container/css/bootstrap/forms.less | 650 +++++++++++++++++ examples/container/css/bootstrap/grid.less | 21 + .../container/css/bootstrap/hero-unit.less | 24 + .../css/bootstrap/labels-badges.less | 72 ++ examples/container/css/bootstrap/layouts.less | 16 + examples/container/css/bootstrap/mixins.less | 681 ++++++++++++++++++ examples/container/css/bootstrap/modals.less | 98 +++ examples/container/css/bootstrap/navbar.less | 475 ++++++++++++ examples/container/css/bootstrap/navs.less | 384 ++++++++++ examples/container/css/bootstrap/pager.less | 40 + .../container/css/bootstrap/pagination.less | 64 ++ .../container/css/bootstrap/popovers.less | 117 +++ .../css/bootstrap/progress-bars.less | 122 ++++ examples/container/css/bootstrap/reset.less | 137 ++++ .../css/bootstrap/responsive-1200px-min.less | 28 + .../css/bootstrap/responsive-767px-max.less | 174 +++++ .../css/bootstrap/responsive-768px-979px.less | 19 + .../css/bootstrap/responsive-navbar.less | 177 +++++ .../css/bootstrap/responsive-utilities.less | 43 ++ .../container/css/bootstrap/responsive.less | 48 ++ .../container/css/bootstrap/scaffolding.less | 52 ++ examples/container/css/bootstrap/sprites.less | 193 +++++ examples/container/css/bootstrap/tables.less | 245 +++++++ .../container/css/bootstrap/thumbnails.less | 52 ++ examples/container/css/bootstrap/tooltip.less | 70 ++ examples/container/css/bootstrap/type.less | 221 ++++++ .../container/css/bootstrap/utilities.less | 30 + .../container/css/bootstrap/variables.less | 279 +++++++ examples/container/css/bootstrap/wells.less | 29 + examples/container/css/container.css | 14 + examples/container/css/namespaced-css.less | 4 + examples/container/index.html | 2 +- 90 files changed, 11411 insertions(+), 2 deletions(-) create mode 100644 examples/container-amd/css/README.md create mode 100644 examples/container-amd/css/bootstrap/accordion.less create mode 100644 examples/container-amd/css/bootstrap/alerts.less create mode 100644 examples/container-amd/css/bootstrap/bootstrap.less create mode 100644 examples/container-amd/css/bootstrap/breadcrumbs.less create mode 100644 examples/container-amd/css/bootstrap/button-groups.less create mode 100644 examples/container-amd/css/bootstrap/buttons.less create mode 100644 examples/container-amd/css/bootstrap/carousel.less create mode 100644 examples/container-amd/css/bootstrap/close.less create mode 100644 examples/container-amd/css/bootstrap/code.less create mode 100644 examples/container-amd/css/bootstrap/component-animations.less create mode 100644 examples/container-amd/css/bootstrap/dropdowns.less create mode 100644 examples/container-amd/css/bootstrap/forms.less create mode 100644 examples/container-amd/css/bootstrap/grid.less create mode 100644 examples/container-amd/css/bootstrap/hero-unit.less create mode 100644 examples/container-amd/css/bootstrap/labels-badges.less create mode 100644 examples/container-amd/css/bootstrap/layouts.less create mode 100644 examples/container-amd/css/bootstrap/mixins.less create mode 100644 examples/container-amd/css/bootstrap/modals.less create mode 100644 examples/container-amd/css/bootstrap/navbar.less create mode 100644 examples/container-amd/css/bootstrap/navs.less create mode 100644 examples/container-amd/css/bootstrap/pager.less create mode 100644 examples/container-amd/css/bootstrap/pagination.less create mode 100644 examples/container-amd/css/bootstrap/popovers.less create mode 100644 examples/container-amd/css/bootstrap/progress-bars.less create mode 100644 examples/container-amd/css/bootstrap/reset.less create mode 100644 examples/container-amd/css/bootstrap/responsive-1200px-min.less create mode 100644 examples/container-amd/css/bootstrap/responsive-767px-max.less create mode 100644 examples/container-amd/css/bootstrap/responsive-768px-979px.less create mode 100644 examples/container-amd/css/bootstrap/responsive-navbar.less create mode 100644 examples/container-amd/css/bootstrap/responsive-utilities.less create mode 100644 examples/container-amd/css/bootstrap/responsive.less create mode 100644 examples/container-amd/css/bootstrap/scaffolding.less create mode 100644 examples/container-amd/css/bootstrap/sprites.less create mode 100644 examples/container-amd/css/bootstrap/tables.less create mode 100644 examples/container-amd/css/bootstrap/thumbnails.less create mode 100644 examples/container-amd/css/bootstrap/tooltip.less create mode 100644 examples/container-amd/css/bootstrap/type.less create mode 100644 examples/container-amd/css/bootstrap/utilities.less create mode 100644 examples/container-amd/css/bootstrap/variables.less create mode 100644 examples/container-amd/css/bootstrap/wells.less create mode 100644 examples/container-amd/css/namespaced-css.less create mode 100644 examples/container/css/README.md create mode 100644 examples/container/css/bootstrap/accordion.less create mode 100644 examples/container/css/bootstrap/alerts.less create mode 100644 examples/container/css/bootstrap/bootstrap.less create mode 100644 examples/container/css/bootstrap/breadcrumbs.less create mode 100644 examples/container/css/bootstrap/button-groups.less create mode 100644 examples/container/css/bootstrap/buttons.less create mode 100644 examples/container/css/bootstrap/carousel.less create mode 100644 examples/container/css/bootstrap/close.less create mode 100644 examples/container/css/bootstrap/code.less create mode 100644 examples/container/css/bootstrap/component-animations.less create mode 100644 examples/container/css/bootstrap/dropdowns.less create mode 100644 examples/container/css/bootstrap/forms.less create mode 100644 examples/container/css/bootstrap/grid.less create mode 100644 examples/container/css/bootstrap/hero-unit.less create mode 100644 examples/container/css/bootstrap/labels-badges.less create mode 100644 examples/container/css/bootstrap/layouts.less create mode 100644 examples/container/css/bootstrap/mixins.less create mode 100644 examples/container/css/bootstrap/modals.less create mode 100644 examples/container/css/bootstrap/navbar.less create mode 100644 examples/container/css/bootstrap/navs.less create mode 100644 examples/container/css/bootstrap/pager.less create mode 100644 examples/container/css/bootstrap/pagination.less create mode 100644 examples/container/css/bootstrap/popovers.less create mode 100644 examples/container/css/bootstrap/progress-bars.less create mode 100644 examples/container/css/bootstrap/reset.less create mode 100644 examples/container/css/bootstrap/responsive-1200px-min.less create mode 100644 examples/container/css/bootstrap/responsive-767px-max.less create mode 100644 examples/container/css/bootstrap/responsive-768px-979px.less create mode 100644 examples/container/css/bootstrap/responsive-navbar.less create mode 100644 examples/container/css/bootstrap/responsive-utilities.less create mode 100644 examples/container/css/bootstrap/responsive.less create mode 100644 examples/container/css/bootstrap/scaffolding.less create mode 100644 examples/container/css/bootstrap/sprites.less create mode 100644 examples/container/css/bootstrap/tables.less create mode 100644 examples/container/css/bootstrap/thumbnails.less create mode 100644 examples/container/css/bootstrap/tooltip.less create mode 100644 examples/container/css/bootstrap/type.less create mode 100644 examples/container/css/bootstrap/utilities.less create mode 100644 examples/container/css/bootstrap/variables.less create mode 100644 examples/container/css/bootstrap/wells.less create mode 100644 examples/container/css/namespaced-css.less diff --git a/examples/container-amd/css/README.md b/examples/container-amd/css/README.md new file mode 100644 index 00000000..c3a9dbd3 --- /dev/null +++ b/examples/container-amd/css/README.md @@ -0,0 +1,12 @@ +# Namespaced CSS # + +F2 Containers can and should namespace their css so that the container and apps can run separately from any other CSS on the page. The example container is built from Bootstrap's LESS files as described [http://twitter.github.com/bootstrap/extend.html](http://twitter.github.com/bootstrap/extend.html "here"). To build the CSS for yourself, follow the following instructions: + +- [Install Nodejs](http://nodejs.org/ "Install Nodejs") + +The following commands should be run from the command-line: + +- `$> npm install -g less` +- `$> lessc -x .\namespaced-css.les > bootstrap.min.css` + +The namespaced-css.less file simply namespaces all of the Bootstrap css with a `.f2-example-container` namespace. diff --git a/examples/container-amd/css/bootstrap.min.css b/examples/container-amd/css/bootstrap.min.css index 605a28457f7b41985149184a4fa790c4196e406b..64941468c3cb919b019dd6958c8c1d8b8b44359f 100755 GIT binary patch literal 386408 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 o=cGkHN1JbCF7ypWSEMP!r^ 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 p, +.alert-block > ul { + margin-bottom: 0; +} +.alert-block p + p { + margin-top: 5px; +} diff --git a/examples/container-amd/css/bootstrap/bootstrap.less b/examples/container-amd/css/bootstrap/bootstrap.less new file mode 100644 index 00000000..aaa3d8a6 --- /dev/null +++ b/examples/container-amd/css/bootstrap/bootstrap.less @@ -0,0 +1,62 @@ +/*! + * Bootstrap v2.1.1 + * + * Copyright 2012 Twitter, Inc + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Designed and built with all the love in the world @twitter by @mdo and @fat. + */ + +// CSS Reset +@import "reset.less"; + +// Core variables and mixins +@import "variables.less"; // Modify this for custom colors, font-sizes, etc +@import "mixins.less"; + +// Grid system and page structure +@import "scaffolding.less"; +@import "grid.less"; +@import "layouts.less"; + +// Base CSS +@import "type.less"; +@import "code.less"; +@import "forms.less"; +@import "tables.less"; + +// Components: common +@import "sprites.less"; +@import "dropdowns.less"; +@import "wells.less"; +@import "component-animations.less"; +@import "close.less"; + +// Components: Buttons & Alerts +@import "buttons.less"; +@import "button-groups.less"; +@import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less + +// Components: Nav +@import "navs.less"; +@import "navbar.less"; +@import "breadcrumbs.less"; +@import "pagination.less"; +@import "pager.less"; + +// Components: Popovers +@import "modals.less"; +@import "tooltip.less"; +@import "popovers.less"; + +// Components: Misc +@import "thumbnails.less"; +@import "labels-badges.less"; +@import "progress-bars.less"; +@import "accordion.less"; +@import "carousel.less"; +@import "hero-unit.less"; + +// Utility classes +@import "utilities.less"; // Has to be last to override when necessary diff --git a/examples/container-amd/css/bootstrap/breadcrumbs.less b/examples/container-amd/css/bootstrap/breadcrumbs.less new file mode 100644 index 00000000..fd269b31 --- /dev/null +++ b/examples/container-amd/css/bootstrap/breadcrumbs.less @@ -0,0 +1,24 @@ +// +// Breadcrumbs +// -------------------------------------------------- + + +.breadcrumb { + padding: 8px 15px; + margin: 0 0 @baseLineHeight; + list-style: none; + background-color: #f5f5f5; + .border-radius(4px); + li { + display: inline-block; + .ie7-inline-block(); + text-shadow: 0 1px 0 @white; + } + .divider { + padding: 0 5px; + color: #ccc; + } + .active { + color: @grayLight; + } +} diff --git a/examples/container-amd/css/bootstrap/button-groups.less b/examples/container-amd/css/bootstrap/button-groups.less new file mode 100644 index 00000000..62e53f37 --- /dev/null +++ b/examples/container-amd/css/bootstrap/button-groups.less @@ -0,0 +1,245 @@ +// +// Button groups +// -------------------------------------------------- + + +// Make the div behave like a button +.btn-group { + position: relative; + font-size: 0; // remove as part 1 of font-size inline-block hack + vertical-align: middle; // match .btn alignment given font-size hack above + white-space: nowrap; // prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page) + .ie7-restore-left-whitespace(); +} + +// Space out series of button groups +.btn-group + .btn-group { + margin-left: 5px; +} + +// Optional: Group multiple button groups together for a toolbar +.btn-toolbar { + font-size: 0; // Hack to remove whitespace that results from using inline-block + margin-top: @baseLineHeight / 2; + margin-bottom: @baseLineHeight / 2; + .btn-group { + display: inline-block; + .ie7-inline-block(); + } + .btn + .btn, + .btn-group + .btn, + .btn + .btn-group { + margin-left: 5px; + } +} + +// Float them, remove border radius, then re-add to first and last elements +.btn-group > .btn { + position: relative; + .border-radius(0); +} +.btn-group > .btn + .btn { + margin-left: -1px; +} +.btn-group > .btn, +.btn-group > .dropdown-menu { + font-size: @baseFontSize; // redeclare as part 2 of font-size inline-block hack +} + +// Reset fonts for other sizes +.btn-group > .btn-mini { + font-size: 11px; +} +.btn-group > .btn-small { + font-size: 12px; +} +.btn-group > .btn-large { + font-size: 16px; +} + +// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match +.btn-group > .btn:first-child { + margin-left: 0; + -webkit-border-top-left-radius: 4px; + -moz-border-radius-topleft: 4px; + border-top-left-radius: 4px; + -webkit-border-bottom-left-radius: 4px; + -moz-border-radius-bottomleft: 4px; + border-bottom-left-radius: 4px; +} +// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it +.btn-group > .btn:last-child, +.btn-group > .dropdown-toggle { + -webkit-border-top-right-radius: 4px; + -moz-border-radius-topright: 4px; + border-top-right-radius: 4px; + -webkit-border-bottom-right-radius: 4px; + -moz-border-radius-bottomright: 4px; + border-bottom-right-radius: 4px; +} +// Reset corners for large buttons +.btn-group > .btn.large:first-child { + margin-left: 0; + -webkit-border-top-left-radius: 6px; + -moz-border-radius-topleft: 6px; + border-top-left-radius: 6px; + -webkit-border-bottom-left-radius: 6px; + -moz-border-radius-bottomleft: 6px; + border-bottom-left-radius: 6px; +} +.btn-group > .btn.large:last-child, +.btn-group > .large.dropdown-toggle { + -webkit-border-top-right-radius: 6px; + -moz-border-radius-topright: 6px; + border-top-right-radius: 6px; + -webkit-border-bottom-right-radius: 6px; + -moz-border-radius-bottomright: 6px; + border-bottom-right-radius: 6px; +} + +// On hover/focus/active, bring the proper btn to front +.btn-group > .btn:hover, +.btn-group > .btn:focus, +.btn-group > .btn:active, +.btn-group > .btn.active { + z-index: 2; +} + +// On active and open, don't show outline +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle { + outline: 0; +} + + + +// Split button dropdowns +// ---------------------- + +// Give the line between buttons some depth +.btn-group > .btn + .dropdown-toggle { + padding-left: 8px; + padding-right: 8px; + .box-shadow(inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)); + *padding-top: 5px; + *padding-bottom: 5px; +} +.btn-group > .btn-mini + .dropdown-toggle { + padding-left: 5px; + padding-right: 5px; + *padding-top: 2px; + *padding-bottom: 2px; +} +.btn-group > .btn-small + .dropdown-toggle { + *padding-top: 5px; + *padding-bottom: 4px; +} +.btn-group > .btn-large + .dropdown-toggle { + padding-left: 12px; + padding-right: 12px; + *padding-top: 7px; + *padding-bottom: 7px; +} + +.btn-group.open { + + // The clickable button for toggling the menu + // Remove the gradient and set the same inset shadow as the :active state + .dropdown-toggle { + background-image: none; + .box-shadow(inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)); + } + + // Keep the hover's background when dropdown is open + .btn.dropdown-toggle { + background-color: @btnBackgroundHighlight; + } + .btn-primary.dropdown-toggle { + background-color: @btnPrimaryBackgroundHighlight; + } + .btn-warning.dropdown-toggle { + background-color: @btnWarningBackgroundHighlight; + } + .btn-danger.dropdown-toggle { + background-color: @btnDangerBackgroundHighlight; + } + .btn-success.dropdown-toggle { + background-color: @btnSuccessBackgroundHighlight; + } + .btn-info.dropdown-toggle { + background-color: @btnInfoBackgroundHighlight; + } + .btn-inverse.dropdown-toggle { + background-color: @btnInverseBackgroundHighlight; + } +} + + +// Reposition the caret +.btn .caret { + margin-top: 8px; + margin-left: 0; +} +// Carets in other button sizes +.btn-mini .caret, +.btn-small .caret, +.btn-large .caret { + margin-top: 6px; +} +.btn-large .caret { + border-left-width: 5px; + border-right-width: 5px; + border-top-width: 5px; +} +// Upside down carets for .dropup +.dropup .btn-large .caret { + border-bottom: 5px solid @black; + border-top: 0; +} + + + +// Account for other colors +.btn-primary, +.btn-warning, +.btn-danger, +.btn-info, +.btn-success, +.btn-inverse { + .caret { + border-top-color: @white; + border-bottom-color: @white; + } +} + + + +// Vertical button groups +// ---------------------- + +.btn-group-vertical { + display: inline-block; // makes buttons only take up the width they need + .ie7-inline-block(); +} +.btn-group-vertical .btn { + display: block; + float: none; + width: 100%; + .border-radius(0); +} +.btn-group-vertical .btn + .btn { + margin-left: 0; + margin-top: -1px; +} +.btn-group-vertical .btn:first-child { + .border-radius(4px 4px 0 0); +} +.btn-group-vertical .btn:last-child { + .border-radius(0 0 4px 4px); +} +.btn-group-vertical .btn-large:first-child { + .border-radius(6px 6px 0 0); +} +.btn-group-vertical .btn-large:last-child { + .border-radius(0 0 6px 6px); +} diff --git a/examples/container-amd/css/bootstrap/buttons.less b/examples/container-amd/css/bootstrap/buttons.less new file mode 100644 index 00000000..3fd1e95f --- /dev/null +++ b/examples/container-amd/css/bootstrap/buttons.less @@ -0,0 +1,231 @@ +// +// Buttons +// -------------------------------------------------- + + +// Base styles +// -------------------------------------------------- + +// Core +.btn { + display: inline-block; + .ie7-inline-block(); + padding: 4px 14px; + margin-bottom: 0; // For input.btn + font-size: @baseFontSize; + line-height: @baseLineHeight; + *line-height: @baseLineHeight; + text-align: center; + vertical-align: middle; + cursor: pointer; + .buttonBackground(@btnBackground, @btnBackgroundHighlight, @grayDark, 0 1px 1px rgba(255,255,255,.75)); + border: 1px solid @btnBorder; + *border: 0; // Remove the border to prevent IE7's black border on input:focus + border-bottom-color: darken(@btnBorder, 10%); + .border-radius(4px); + .ie7-restore-left-whitespace(); // Give IE7 some love + .box-shadow(inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)); + + // Hover state + &:hover { + color: @grayDark; + text-decoration: none; + background-color: darken(@white, 10%); + *background-color: darken(@white, 15%); /* Buttons in IE7 don't get borders, so darken on hover */ + background-position: 0 -15px; + + // transition is only when going to hover, otherwise the background + // behind the gradient (there for IE<=9 fallback) gets mismatched + .transition(background-position .1s linear); + } + + // Focus state for keyboard and accessibility + &:focus { + .tab-focus(); + } + + // Active state + &.active, + &:active { + background-color: darken(@white, 10%); + background-color: darken(@white, 15%) e("\9"); + background-image: none; + outline: 0; + .box-shadow(inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)); + } + + // Disabled state + &.disabled, + &[disabled] { + cursor: default; + background-color: darken(@white, 10%); + background-image: none; + .opacity(65); + .box-shadow(none); + } + +} + + + +// Button Sizes +// -------------------------------------------------- + +// Large +.btn-large { + padding: 9px 14px; + font-size: @baseFontSize + 2px; + line-height: normal; + .border-radius(5px); +} +.btn-large [class^="icon-"] { + margin-top: 2px; +} + +// Small +.btn-small { + padding: 3px 9px; + font-size: @baseFontSize - 2px; + line-height: @baseLineHeight - 2px; +} +.btn-small [class^="icon-"] { + margin-top: 0; +} + +// Mini +.btn-mini { + padding: 2px 6px; + font-size: @baseFontSize - 3px; + line-height: @baseLineHeight - 3px; +} + + +// Block button +// ------------------------- + +.btn-block { + display: block; + width: 100%; + padding-left: 0; + padding-right: 0; + .box-sizing(border-box); +} + +// Vertically space out multiple block buttons +.btn-block + .btn-block { + margin-top: 5px; +} + +// Specificity overrides +input[type="submit"], +input[type="reset"], +input[type="button"] { + &.btn-block { + width: 100%; + } +} + + + +// Alternate buttons +// -------------------------------------------------- + +// Provide *some* extra contrast for those who can get it +.btn-primary.active, +.btn-warning.active, +.btn-danger.active, +.btn-success.active, +.btn-info.active, +.btn-inverse.active { + color: rgba(255,255,255,.75); +} + +// Set the backgrounds +// ------------------------- +.btn { + // reset here as of 2.0.3 due to Recess property order + border-color: #c5c5c5; + border-color: rgba(0,0,0,.15) rgba(0,0,0,.15) rgba(0,0,0,.25); +} +.btn-primary { + .buttonBackground(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight); +} +// Warning appears are orange +.btn-warning { + .buttonBackground(@btnWarningBackground, @btnWarningBackgroundHighlight); +} +// Danger and error appear as red +.btn-danger { + .buttonBackground(@btnDangerBackground, @btnDangerBackgroundHighlight); +} +// Success appears as green +.btn-success { + .buttonBackground(@btnSuccessBackground, @btnSuccessBackgroundHighlight); +} +// Info appears as a neutral blue +.btn-info { + .buttonBackground(@btnInfoBackground, @btnInfoBackgroundHighlight); +} +// Inverse appears as dark gray +.btn-inverse { + .buttonBackground(@btnInverseBackground, @btnInverseBackgroundHighlight); +} + + +// Cross-browser Jank +// -------------------------------------------------- + +button.btn, +input[type="submit"].btn { + + // Firefox 3.6 only I believe + &::-moz-focus-inner { + padding: 0; + border: 0; + } + + // IE7 has some default padding on button controls + *padding-top: 3px; + *padding-bottom: 3px; + + &.btn-large { + *padding-top: 7px; + *padding-bottom: 7px; + } + &.btn-small { + *padding-top: 3px; + *padding-bottom: 3px; + } + &.btn-mini { + *padding-top: 1px; + *padding-bottom: 1px; + } +} + + +// Link buttons +// -------------------------------------------------- + +// Make a button look and behave like a link +.btn-link, +.btn-link:active, +.btn-link[disabled] { + background-color: transparent; + background-image: none; + .box-shadow(none); +} +.btn-link { + border-color: transparent; + cursor: pointer; + color: @linkColor; + .border-radius(0); +} +.btn-link:hover { + color: @linkColorHover; + text-decoration: underline; + background-color: transparent; +} +.btn-link[disabled]:hover { + color: @grayDark; + text-decoration: none; +} diff --git a/examples/container-amd/css/bootstrap/carousel.less b/examples/container-amd/css/bootstrap/carousel.less new file mode 100644 index 00000000..33f98ac4 --- /dev/null +++ b/examples/container-amd/css/bootstrap/carousel.less @@ -0,0 +1,131 @@ +// +// Carousel +// -------------------------------------------------- + + +.carousel { + position: relative; + margin-bottom: @baseLineHeight; + line-height: 1; +} + +.carousel-inner { + overflow: hidden; + width: 100%; + position: relative; +} + +.carousel { + + .item { + display: none; + position: relative; + .transition(.6s ease-in-out left); + } + + // Account for jankitude on images + .item > img { + display: block; + line-height: 1; + } + + .active, + .next, + .prev { display: block; } + + .active { + left: 0; + } + + .next, + .prev { + position: absolute; + top: 0; + width: 100%; + } + + .next { + left: 100%; + } + .prev { + left: -100%; + } + .next.left, + .prev.right { + left: 0; + } + + .active.left { + left: -100%; + } + .active.right { + left: 100%; + } + +} + +// Left/right controls for nav +// --------------------------- + +.carousel-control { + position: absolute; + top: 40%; + left: 15px; + width: 40px; + height: 40px; + margin-top: -20px; + font-size: 60px; + font-weight: 100; + line-height: 30px; + color: @white; + text-align: center; + background: @grayDarker; + border: 3px solid @white; + .border-radius(23px); + .opacity(50); + + // we can't have this transition here + // because webkit cancels the carousel + // animation if you trip this while + // in the middle of another animation + // ;_; + // .transition(opacity .2s linear); + + // Reposition the right one + &.right { + left: auto; + right: 15px; + } + + // Hover state + &:hover { + color: @white; + text-decoration: none; + .opacity(90); + } +} + + +// Caption for text below images +// ----------------------------- + +.carousel-caption { + position: absolute; + left: 0; + right: 0; + bottom: 0; + padding: 15px; + background: @grayDark; + background: rgba(0,0,0,.75); +} +.carousel-caption h4, +.carousel-caption p { + color: @white; + line-height: @baseLineHeight; +} +.carousel-caption h4 { + margin: 0 0 5px; +} +.carousel-caption p { + margin-bottom: 0; +} diff --git a/examples/container-amd/css/bootstrap/close.less b/examples/container-amd/css/bootstrap/close.less new file mode 100644 index 00000000..c71a508f --- /dev/null +++ b/examples/container-amd/css/bootstrap/close.less @@ -0,0 +1,31 @@ +// +// Close icons +// -------------------------------------------------- + + +.close { + float: right; + font-size: 20px; + font-weight: bold; + line-height: @baseLineHeight; + color: @black; + text-shadow: 0 1px 0 rgba(255,255,255,1); + .opacity(20); + &:hover { + color: @black; + text-decoration: none; + cursor: pointer; + .opacity(40); + } +} + +// Additional properties for button version +// iOS requires the button element instead of an anchor tag. +// If you want the anchor version, it requires `href="#"`. +button.close { + padding: 0; + cursor: pointer; + background: transparent; + border: 0; + -webkit-appearance: none; +} \ No newline at end of file diff --git a/examples/container-amd/css/bootstrap/code.less b/examples/container-amd/css/bootstrap/code.less new file mode 100644 index 00000000..f1851a07 --- /dev/null +++ b/examples/container-amd/css/bootstrap/code.less @@ -0,0 +1,58 @@ +// +// Code (inline and blocK) +// -------------------------------------------------- + + +// Inline and block code styles +code, +pre { + padding: 0 3px 2px; + #font > #family > .monospace; + font-size: @baseFontSize - 2; + color: @grayDark; + .border-radius(3px); +} + +// Inline code +code { + padding: 2px 4px; + color: #d14; + background-color: #f7f7f9; + border: 1px solid #e1e1e8; +} + +// Blocks of code +pre { + display: block; + padding: (@baseLineHeight - 1) / 2; + margin: 0 0 @baseLineHeight / 2; + font-size: @baseFontSize - 1; // 14px to 13px + line-height: @baseLineHeight; + word-break: break-all; + word-wrap: break-word; + white-space: pre; + white-space: pre-wrap; + background-color: #f5f5f5; + border: 1px solid #ccc; // fallback for IE7-8 + border: 1px solid rgba(0,0,0,.15); + .border-radius(4px); + + // Make prettyprint styles more spaced out for readability + &.prettyprint { + margin-bottom: @baseLineHeight; + } + + // Account for some code outputs that place code tags in pre tags + code { + padding: 0; + color: inherit; + background-color: transparent; + border: 0; + } +} + +// Enable scrollable blocks of code +.pre-scrollable { + max-height: 340px; + overflow-y: scroll; +} \ No newline at end of file diff --git a/examples/container-amd/css/bootstrap/component-animations.less b/examples/container-amd/css/bootstrap/component-animations.less new file mode 100644 index 00000000..d614263a --- /dev/null +++ b/examples/container-amd/css/bootstrap/component-animations.less @@ -0,0 +1,22 @@ +// +// Component animations +// -------------------------------------------------- + + +.fade { + opacity: 0; + .transition(opacity .15s linear); + &.in { + opacity: 1; + } +} + +.collapse { + position: relative; + height: 0; + overflow: hidden; + .transition(height .35s ease); + &.in { + height: auto; + } +} diff --git a/examples/container-amd/css/bootstrap/dropdowns.less b/examples/container-amd/css/bootstrap/dropdowns.less new file mode 100644 index 00000000..390c3749 --- /dev/null +++ b/examples/container-amd/css/bootstrap/dropdowns.less @@ -0,0 +1,210 @@ +// +// Dropdown menus +// -------------------------------------------------- + + +// Use the .menu class on any
  • element within the topbar or ul.tabs and you'll get some superfancy dropdowns +.dropup, +.dropdown { + position: relative; +} +.dropdown-toggle { + // The caret makes the toggle a bit too tall in IE7 + *margin-bottom: -3px; +} +.dropdown-toggle:active, +.open .dropdown-toggle { + outline: 0; +} + +// Dropdown arrow/caret +// -------------------- +.caret { + display: inline-block; + width: 0; + height: 0; + vertical-align: top; + border-top: 4px solid @black; + border-right: 4px solid transparent; + border-left: 4px solid transparent; + content: ""; +} + +// Place the caret +.dropdown .caret { + margin-top: 8px; + margin-left: 2px; +} + +// The dropdown menu (ul) +// ---------------------- +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: @zindexDropdown; + display: none; // none by default, but block on "open" of the menu + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; // override default ul + list-style: none; + background-color: @dropdownBackground; + border: 1px solid #ccc; // Fallback for IE7-8 + border: 1px solid @dropdownBorder; + *border-right-width: 2px; + *border-bottom-width: 2px; + .border-radius(6px); + .box-shadow(0 5px 10px rgba(0,0,0,.2)); + -webkit-background-clip: padding-box; + -moz-background-clip: padding; + background-clip: padding-box; + + // Aligns the dropdown menu to right + &.pull-right { + right: 0; + left: auto; + } + + // Dividers (basically an hr) within the dropdown + .divider { + .nav-divider(@dropdownDividerTop, @dropdownDividerBottom); + } + + // Links within the dropdown menu + a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: normal; + line-height: @baseLineHeight; + color: @dropdownLinkColor; + white-space: nowrap; + } +} + +// Hover state +// ----------- +.dropdown-menu li > a:hover, +.dropdown-menu li > a:focus, +.dropdown-submenu:hover > a { + text-decoration: none; + color: @dropdownLinkColorHover; + background-color: @dropdownLinkBackgroundHover; + #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%)); +} + +// Active state +// ------------ +.dropdown-menu .active > a, +.dropdown-menu .active > a:hover { + color: @dropdownLinkColorHover; + text-decoration: none; + outline: 0; + background-color: @dropdownLinkBackgroundActive; + #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%)); +} + +// Disabled state +// -------------- +// Gray out text and ensure the hover state remains gray +.dropdown-menu .disabled > a, +.dropdown-menu .disabled > a:hover { + color: @grayLight; +} +// Nuke hover effects +.dropdown-menu .disabled > a:hover { + text-decoration: none; + background-color: transparent; + cursor: default; +} + +// Open state for the dropdown +// --------------------------- +.open { + // IE7's z-index only goes to the nearest positioned ancestor, which would + // make the menu appear below buttons that appeared later on the page + *z-index: @zindexDropdown; + + & > .dropdown-menu { + display: block; + } +} + +// Right aligned dropdowns +// --------------------------- +.pull-right > .dropdown-menu { + right: 0; + left: auto; +} + +// Allow for dropdowns to go bottom up (aka, dropup-menu) +// ------------------------------------------------------ +// Just add .dropup after the standard .dropdown class and you're set, bro. +// TODO: abstract this so that the navbar fixed styles are not placed here? +.dropup, +.navbar-fixed-bottom .dropdown { + // Reverse the caret + .caret { + border-top: 0; + border-bottom: 4px solid @black; + content: ""; + } + // Different positioning for bottom up menu + .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 1px; + } +} + +// Sub menus +// --------------------------- +.dropdown-submenu { + position: relative; +} +.dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -6px; + margin-left: -1px; + -webkit-border-radius: 0 6px 6px 6px; + -moz-border-radius: 0 6px 6px 6px; + border-radius: 0 6px 6px 6px; +} +.dropdown-submenu:hover > .dropdown-menu { + display: block; +} + +.dropdown-submenu > a:after { + display: block; + content: " "; + float: right; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + border-width: 5px 0 5px 5px; + border-left-color: darken(@dropdownBackground, 20%); + margin-top: 5px; + margin-right: -10px; +} +.dropdown-submenu:hover > a:after { + border-left-color: @dropdownLinkColorHover; +} + + +// Tweak nav headers +// ----------------- +// Increase padding from 15px to 20px on sides +.dropdown .dropdown-menu .nav-header { + padding-left: 20px; + padding-right: 20px; +} + +// Typeahead +// --------- +.typeahead { + margin-top: 2px; // give it some space to breathe + .border-radius(4px); +} diff --git a/examples/container-amd/css/bootstrap/forms.less b/examples/container-amd/css/bootstrap/forms.less new file mode 100644 index 00000000..f8d8562b --- /dev/null +++ b/examples/container-amd/css/bootstrap/forms.less @@ -0,0 +1,650 @@ +// +// Forms +// -------------------------------------------------- + + +// GENERAL STYLES +// -------------- + +// Make all forms have space below them +form { + margin: 0 0 @baseLineHeight; +} + +fieldset { + padding: 0; + margin: 0; + border: 0; +} + +// Groups of fields with labels on top (legends) +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: @baseLineHeight; + font-size: @baseFontSize * 1.5; + line-height: @baseLineHeight * 2; + color: @grayDark; + border: 0; + border-bottom: 1px solid #e5e5e5; + + // Small + small { + font-size: @baseLineHeight * .75; + color: @grayLight; + } +} + +// Set font for forms +label, +input, +button, +select, +textarea { + #font > .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here +} +input, +button, +select, +textarea { + font-family: @baseFontFamily; // And only set font-family here for those that need it (note the missing label element) +} + +// Identify controls by their labels +label { + display: block; + margin-bottom: 5px; +} + +// Form controls +// ------------------------- + +// Shared size and type resets +select, +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { + display: inline-block; + height: @baseLineHeight; + padding: 4px 6px; + margin-bottom: 9px; + font-size: @baseFontSize; + line-height: @baseLineHeight; + color: @gray; + .border-radius(@inputBorderRadius); +} + +// Reset appearance properties for textual inputs and textarea +// Declare width for legacy (can't be on input[type=*] selectors or it's too specific) +input, +textarea, +.uneditable-input { + width: 206px; // plus 12px padding and 2px border +} +// Reset height since textareas have rows +textarea { + height: auto; +} +// Everything else +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { + background-color: @inputBackground; + border: 1px solid @inputBorder; + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); + .transition(~"border linear .2s, box-shadow linear .2s"); + + // Focus state + &:focus { + border-color: rgba(82,168,236,.8); + outline: 0; + outline: thin dotted \9; /* IE6-9 */ + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)); + } +} + +// Position radios and checkboxes better +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + *margin-top: 0; /* IE7 */ + margin-top: 1px \9; /* IE8-9 */ + line-height: normal; + cursor: pointer; +} + +// Reset width of input images, buttons, radios, checkboxes +input[type="file"], +input[type="image"], +input[type="submit"], +input[type="reset"], +input[type="button"], +input[type="radio"], +input[type="checkbox"] { + width: auto; // Override of generic input selector +} + +// Set the height of select and file controls to match text inputs +select, +input[type="file"] { + height: 30px; /* In IE7, the height of the select element cannot be changed by height, only font-size */ + *margin-top: 4px; /* For IE7, add top margin to align select with labels */ + line-height: 30px; +} + +// Make select elements obey height by applying a border +select { + width: 220px; // default input width + 10px of padding that doesn't get applied + border: 1px solid @inputBorder; + background-color: @inputBackground; // Chrome on Linux and Mobile Safari need background-color +} + +// Make multiple select elements height not fixed +select[multiple], +select[size] { + height: auto; +} + +// Focus for select, file, radio, and checkbox +select:focus, +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + .tab-focus(); +} + + +// Uneditable inputs +// ------------------------- + +// Make uneditable inputs look inactive +.uneditable-input, +.uneditable-textarea { + color: @grayLight; + background-color: darken(@inputBackground, 1%); + border-color: @inputBorder; + .box-shadow(inset 0 1px 2px rgba(0,0,0,.025)); + cursor: not-allowed; +} + +// For text that needs to appear as an input but should not be an input +.uneditable-input { + overflow: hidden; // prevent text from wrapping, but still cut it off like an input does + white-space: nowrap; +} + +// Make uneditable textareas behave like a textarea +.uneditable-textarea { + width: auto; + height: auto; +} + + +// Placeholder +// ------------------------- + +// Placeholder text gets special styles because when browsers invalidate entire lines if it doesn’t understand a selector +input, +textarea { + .placeholder(); +} + + +// CHECKBOXES & RADIOS +// ------------------- + +// Indent the labels to position radios/checkboxes as hanging +.radio, +.checkbox { + min-height: 18px; // clear the floating input if there is no label text + padding-left: 18px; +} +.radio input[type="radio"], +.checkbox input[type="checkbox"] { + float: left; + margin-left: -18px; +} + +// Move the options list down to align with labels +.controls > .radio:first-child, +.controls > .checkbox:first-child { + padding-top: 5px; // has to be padding because margin collaspes +} + +// Radios and checkboxes on same line +// TODO v3: Convert .inline to .control-inline +.radio.inline, +.checkbox.inline { + display: inline-block; + padding-top: 5px; + margin-bottom: 0; + vertical-align: middle; +} +.radio.inline + .radio.inline, +.checkbox.inline + .checkbox.inline { + margin-left: 10px; // space out consecutive inline controls +} + + + +// INPUT SIZES +// ----------- + +// General classes for quick sizes +.input-mini { width: 60px; } +.input-small { width: 90px; } +.input-medium { width: 150px; } +.input-large { width: 210px; } +.input-xlarge { width: 270px; } +.input-xxlarge { width: 530px; } + +// Grid style input sizes +input[class*="span"], +select[class*="span"], +textarea[class*="span"], +.uneditable-input[class*="span"], +// Redeclare since the fluid row class is more specific +.row-fluid input[class*="span"], +.row-fluid select[class*="span"], +.row-fluid textarea[class*="span"], +.row-fluid .uneditable-input[class*="span"] { + float: none; + margin-left: 0; +} +// Ensure input-prepend/append never wraps +.input-append input[class*="span"], +.input-append .uneditable-input[class*="span"], +.input-prepend input[class*="span"], +.input-prepend .uneditable-input[class*="span"], +.row-fluid input[class*="span"], +.row-fluid select[class*="span"], +.row-fluid textarea[class*="span"], +.row-fluid .uneditable-input[class*="span"], +.row-fluid .input-prepend [class*="span"], +.row-fluid .input-append [class*="span"] { + display: inline-block; +} + + + +// GRID SIZING FOR INPUTS +// ---------------------- + +// Grid sizes +#grid > .input(@gridColumnWidth, @gridGutterWidth); + +// Control row for multiple inputs per line +.controls-row { + .clearfix(); // Clear the float from controls +} +.controls-row [class*="span"] { + float: left; // Float to collapse white-space for proper grid alignment +} + + + + +// DISABLED STATE +// -------------- + +// Disabled and read-only inputs +input[disabled], +select[disabled], +textarea[disabled], +input[readonly], +select[readonly], +textarea[readonly] { + cursor: not-allowed; + background-color: @inputDisabledBackground; +} +// Explicitly reset the colors here +input[type="radio"][disabled], +input[type="checkbox"][disabled], +input[type="radio"][readonly], +input[type="checkbox"][readonly] { + background-color: transparent; +} + + + + +// FORM FIELD FEEDBACK STATES +// -------------------------- + +// Warning +.control-group.warning { + .formFieldState(@warningText, @warningText, @warningBackground); +} +// Error +.control-group.error { + .formFieldState(@errorText, @errorText, @errorBackground); +} +// Success +.control-group.success { + .formFieldState(@successText, @successText, @successBackground); +} +// Success +.control-group.info { + .formFieldState(@infoText, @infoText, @infoBackground); +} + +// HTML5 invalid states +// Shares styles with the .control-group.error above +input:focus:required:invalid, +textarea:focus:required:invalid, +select:focus:required:invalid { + color: #b94a48; + border-color: #ee5f5b; + &:focus { + border-color: darken(#ee5f5b, 10%); + .box-shadow(0 0 6px lighten(#ee5f5b, 20%)); + } +} + + + +// FORM ACTIONS +// ------------ + +.form-actions { + padding: (@baseLineHeight - 1) 20px @baseLineHeight; + margin-top: @baseLineHeight; + margin-bottom: @baseLineHeight; + background-color: @formActionsBackground; + border-top: 1px solid #e5e5e5; + .clearfix(); // Adding clearfix to allow for .pull-right button containers +} + + + +// HELP TEXT +// --------- + +.help-block, +.help-inline { + color: lighten(@textColor, 15%); // lighten the text some for contrast +} + +.help-block { + display: block; // account for any element using help-block + margin-bottom: @baseLineHeight / 2; +} + +.help-inline { + display: inline-block; + .ie7-inline-block(); + vertical-align: middle; + padding-left: 5px; +} + + + +// INPUT GROUPS +// ------------ + +// Allow us to put symbols and text within the input field for a cleaner look +.input-append, +.input-prepend { + margin-bottom: 5px; + font-size: 0; + white-space: nowrap; // Prevent span and input from separating + + input, + select, + .uneditable-input { + position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness + margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms + *margin-left: 0; + font-size: @baseFontSize; + vertical-align: top; + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + // Make input on top when focused so blue border and shadow always show + &:focus { + z-index: 2; + } + } + .add-on { + display: inline-block; + width: auto; + height: @baseLineHeight; + min-width: 16px; + padding: 4px 5px; + font-size: @baseFontSize; + font-weight: normal; + line-height: @baseLineHeight; + text-align: center; + text-shadow: 0 1px 0 @white; + background-color: @grayLighter; + border: 1px solid #ccc; + } + .add-on, + .btn { + vertical-align: top; + .border-radius(0); + } + .active { + background-color: lighten(@green, 30); + border-color: @green; + } +} +.input-prepend { + .add-on, + .btn { + margin-right: -1px; + } + .add-on:first-child, + .btn:first-child { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } +} +.input-append { + input, + select, + .uneditable-input { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } + .add-on, + .btn { + margin-left: -1px; + } + .add-on:last-child, + .btn:last-child { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} +// Remove all border-radius for inputs with both prepend and append +.input-prepend.input-append { + input, + select, + .uneditable-input { + .border-radius(0); + } + .add-on:first-child, + .btn:first-child { + margin-right: -1px; + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } + .add-on:last-child, + .btn:last-child { + margin-left: -1px; + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} + + + +// SEARCH FORM +// ----------- + +input.search-query { + padding-right: 14px; + padding-right: 4px \9; + padding-left: 14px; + padding-left: 4px \9; /* IE7-8 doesn't have border-radius, so don't indent the padding */ + margin-bottom: 0; // Remove the default margin on all inputs + .border-radius(15px); +} + +/* Allow for input prepend/append in search forms */ +.form-search .input-append .search-query, +.form-search .input-prepend .search-query { + .border-radius(0); // Override due to specificity +} +.form-search .input-append .search-query { + .border-radius(14px 0 0 14px); +} +.form-search .input-append .btn { + .border-radius(0 14px 14px 0); +} +.form-search .input-prepend .search-query { + .border-radius(0 14px 14px 0); +} +.form-search .input-prepend .btn { + .border-radius(14px 0 0 14px); +} + + + + +// HORIZONTAL & VERTICAL FORMS +// --------------------------- + +// Common properties +// ----------------- + +.form-search, +.form-inline, +.form-horizontal { + input, + textarea, + select, + .help-inline, + .uneditable-input, + .input-prepend, + .input-append { + display: inline-block; + .ie7-inline-block(); + margin-bottom: 0; + vertical-align: middle; + } + // Re-hide hidden elements due to specifity + .hide { + display: none; + } +} +.form-search label, +.form-inline label, +.form-search .btn-group, +.form-inline .btn-group { + display: inline-block; +} +// Remove margin for input-prepend/-append +.form-search .input-append, +.form-inline .input-append, +.form-search .input-prepend, +.form-inline .input-prepend { + margin-bottom: 0; +} +// Inline checkbox/radio labels (remove padding on left) +.form-search .radio, +.form-search .checkbox, +.form-inline .radio, +.form-inline .checkbox { + padding-left: 0; + margin-bottom: 0; + vertical-align: middle; +} +// Remove float and margin, set to inline-block +.form-search .radio input[type="radio"], +.form-search .checkbox input[type="checkbox"], +.form-inline .radio input[type="radio"], +.form-inline .checkbox input[type="checkbox"] { + float: left; + margin-right: 3px; + margin-left: 0; +} + + +// Margin to space out fieldsets +.control-group { + margin-bottom: @baseLineHeight / 2; +} + +// Legend collapses margin, so next element is responsible for spacing +legend + .control-group { + margin-top: @baseLineHeight; + -webkit-margin-top-collapse: separate; +} + +// Horizontal-specific styles +// -------------------------- + +.form-horizontal { + // Increase spacing between groups + .control-group { + margin-bottom: @baseLineHeight; + .clearfix(); + } + // Float the labels left + .control-label { + float: left; + width: @horizontalComponentOffset - 20; + padding-top: 5px; + text-align: right; + } + // Move over all input controls and content + .controls { + // Super jank IE7 fix to ensure the inputs in .input-append and input-prepend + // don't inherit the margin of the parent, in this case .controls + *display: inline-block; + *padding-left: 20px; + margin-left: @horizontalComponentOffset; + *margin-left: 0; + &:first-child { + *padding-left: @horizontalComponentOffset; + } + } + // Remove bottom margin on block level help text since that's accounted for on .control-group + .help-block { + margin-bottom: 0; + } + // And apply it only to .help-block instances that follow a form control + input, + select, + textarea { + + .help-block { + margin-top: @baseLineHeight / 2; + } + } + // Move over buttons in .form-actions to align with .controls + .form-actions { + padding-left: @horizontalComponentOffset; + } +} diff --git a/examples/container-amd/css/bootstrap/grid.less b/examples/container-amd/css/bootstrap/grid.less new file mode 100644 index 00000000..750d2035 --- /dev/null +++ b/examples/container-amd/css/bootstrap/grid.less @@ -0,0 +1,21 @@ +// +// Grid system +// -------------------------------------------------- + + +// Fixed (940px) +#grid > .core(@gridColumnWidth, @gridGutterWidth); + +// Fluid (940px) +#grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth); + +// Reset utility classes due to specificity +[class*="span"].hide, +.row-fluid [class*="span"].hide { + display: none; +} + +[class*="span"].pull-right, +.row-fluid [class*="span"].pull-right { + float: right; +} diff --git a/examples/container-amd/css/bootstrap/hero-unit.less b/examples/container-amd/css/bootstrap/hero-unit.less new file mode 100644 index 00000000..672b7d7c --- /dev/null +++ b/examples/container-amd/css/bootstrap/hero-unit.less @@ -0,0 +1,24 @@ +// +// Hero unit +// -------------------------------------------------- + + +.hero-unit { + padding: 60px; + margin-bottom: 30px; + background-color: @heroUnitBackground; + .border-radius(6px); + h1 { + margin-bottom: 0; + font-size: 60px; + line-height: 1; + color: @heroUnitHeadingColor; + letter-spacing: -1px; + } + p { + font-size: 18px; + font-weight: 200; + line-height: @baseLineHeight * 1.5; + color: @heroUnitLeadColor; + } +} diff --git a/examples/container-amd/css/bootstrap/labels-badges.less b/examples/container-amd/css/bootstrap/labels-badges.less new file mode 100644 index 00000000..2f15fec0 --- /dev/null +++ b/examples/container-amd/css/bootstrap/labels-badges.less @@ -0,0 +1,72 @@ +// +// Labels and badges +// -------------------------------------------------- + + +// Base classes +.label, +.badge { + font-size: @baseFontSize * .846; + font-weight: bold; + line-height: 14px; // ensure proper line-height if floated + color: @white; + vertical-align: baseline; + white-space: nowrap; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + background-color: @grayLight; +} +// Set unique padding and border-radii +.label { + padding: 1px 4px 2px; + .border-radius(3px); +} +.badge { + padding: 1px 9px 2px; + .border-radius(9px); +} + +// Hover state, but only for links +a { + &.label:hover, + &.badge:hover { + color: @white; + text-decoration: none; + cursor: pointer; + } +} + +// Colors +// Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute) +.label, +.badge { + // Important (red) + &-important { background-color: @errorText; } + &-important[href] { background-color: darken(@errorText, 10%); } + // Warnings (orange) + &-warning { background-color: @orange; } + &-warning[href] { background-color: darken(@orange, 10%); } + // Success (green) + &-success { background-color: @successText; } + &-success[href] { background-color: darken(@successText, 10%); } + // Info (turquoise) + &-info { background-color: @infoText; } + &-info[href] { background-color: darken(@infoText, 10%); } + // Inverse (black) + &-inverse { background-color: @grayDark; } + &-inverse[href] { background-color: darken(@grayDark, 10%); } +} + +// Quick fix for labels/badges in buttons +.btn { + .label, + .badge { + position: relative; + top: -1px; + } +} +.btn-mini { + .label, + .badge { + top: 0; + } +} diff --git a/examples/container-amd/css/bootstrap/layouts.less b/examples/container-amd/css/bootstrap/layouts.less new file mode 100644 index 00000000..24a20621 --- /dev/null +++ b/examples/container-amd/css/bootstrap/layouts.less @@ -0,0 +1,16 @@ +// +// Layouts +// -------------------------------------------------- + + +// Container (centered, fixed-width layouts) +.container { + .container-fixed(); +} + +// Fluid layouts (left aligned, with sidebar, min- & max-width content) +.container-fluid { + padding-right: @gridGutterWidth; + padding-left: @gridGutterWidth; + .clearfix(); +} \ No newline at end of file diff --git a/examples/container-amd/css/bootstrap/mixins.less b/examples/container-amd/css/bootstrap/mixins.less new file mode 100644 index 00000000..67f1c0af --- /dev/null +++ b/examples/container-amd/css/bootstrap/mixins.less @@ -0,0 +1,681 @@ +// +// Mixins +// -------------------------------------------------- + + +// UTILITY MIXINS +// -------------------------------------------------- + +// Clearfix +// -------- +// For clearing floats like a boss h5bp.com/q +.clearfix { + *zoom: 1; + &:before, + &:after { + display: table; + content: ""; + // Fixes Opera/contenteditable bug: + // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952 + line-height: 0; + } + &:after { + clear: both; + } +} + +// Webkit-style focus +// ------------------ +.tab-focus() { + // Default + outline: thin dotted #333; + // Webkit + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} + +// Center-align a block level element +// ---------------------------------- +.center-block() { + display: block; + margin-left: auto; + margin-right: auto; +} + +// IE7 inline-block +// ---------------- +.ie7-inline-block() { + *display: inline; /* IE7 inline-block hack */ + *zoom: 1; +} + +// IE7 likes to collapse whitespace on either side of the inline-block elements. +// Ems because we're attempting to match the width of a space character. Left +// version is for form buttons, which typically come after other elements, and +// right version is for icons, which come before. Applying both is ok, but it will +// mean that space between those elements will be .6em (~2 space characters) in IE7, +// instead of the 1 space in other browsers. +.ie7-restore-left-whitespace() { + *margin-left: .3em; + + &:first-child { + *margin-left: 0; + } +} + +.ie7-restore-right-whitespace() { + *margin-right: .3em; +} + +// Sizing shortcuts +// ------------------------- +.size(@height, @width) { + width: @width; + height: @height; +} +.square(@size) { + .size(@size, @size); +} + +// Placeholder text +// ------------------------- +.placeholder(@color: @placeholderText) { + &:-moz-placeholder { + color: @color; + } + &:-ms-input-placeholder { + color: @color; + } + &::-webkit-input-placeholder { + color: @color; + } +} + +// Text overflow +// ------------------------- +// Requires inline-block or block for proper styling +.text-overflow() { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +// CSS image replacement +// ------------------------- +// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 +.hide-text { + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; +} + + +// FONTS +// -------------------------------------------------- + +#font { + #family { + .serif() { + font-family: @serifFontFamily; + } + .sans-serif() { + font-family: @sansFontFamily; + } + .monospace() { + font-family: @monoFontFamily; + } + } + .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + font-size: @size; + font-weight: @weight; + line-height: @lineHeight; + } + .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .serif; + #font > .shorthand(@size, @weight, @lineHeight); + } + .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .sans-serif; + #font > .shorthand(@size, @weight, @lineHeight); + } + .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .monospace; + #font > .shorthand(@size, @weight, @lineHeight); + } +} + + +// FORMS +// -------------------------------------------------- + +// Block level inputs +.input-block-level { + display: block; + width: 100%; + min-height: 30px; // Make inputs at least the height of their button counterpart + .box-sizing(border-box); // Makes inputs behave like true block-level elements +} + + + +// Mixin for form field states +.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) { + // Set the text color + > label, + .help-block, + .help-inline { + color: @textColor; + } + // Style inputs accordingly + .checkbox, + .radio, + input, + select, + textarea { + color: @textColor; + } + input, + select, + textarea { + border-color: @borderColor; + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work + &:focus { + border-color: darken(@borderColor, 10%); + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%)); + } + } + // Give a small background color for input-prepend/-append + .input-prepend .add-on, + .input-append .add-on { + color: @textColor; + background-color: @backgroundColor; + border-color: @textColor; + } +} + + + +// CSS3 PROPERTIES +// -------------------------------------------------- + +// Border Radius +.border-radius(@radius) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; +} + +// Single Corner Border Radius +.border-top-left-radius(@radius) { + -webkit-border-top-left-radius: @radius; + -moz-border-radius-topleft: @radius; + border-top-left-radius: @radius; +} +.border-top-right-radius(@radius) { + -webkit-border-top-right-radius: @radius; + -moz-border-radius-topright: @radius; + border-top-right-radius: @radius; +} +.border-bottom-right-radius(@radius) { + -webkit-border-bottom-right-radius: @radius; + -moz-border-radius-bottomright: @radius; + border-bottom-right-radius: @radius; +} +.border-bottom-left-radius(@radius) { + -webkit-border-bottom-left-radius: @radius; + -moz-border-radius-bottomleft: @radius; + border-bottom-left-radius: @radius; +} + +// Single Side Border Radius +.border-top-radius(@radius) { + .border-top-right-radius(@radius); + .border-top-left-radius(@radius); +} +.border-right-radius(@radius) { + .border-top-right-radius(@radius); + .border-bottom-right-radius(@radius); +} +.border-bottom-radius(@radius) { + .border-bottom-right-radius(@radius); + .border-bottom-left-radius(@radius); +} +.border-left-radius(@radius) { + .border-top-left-radius(@radius); + .border-bottom-left-radius(@radius); +} + +// Drop shadows +.box-shadow(@shadowA, @shadowB:X, ...){ + // Multiple shadow solution from http://toekneestuck.com/blog/2012/05/15/less-css-arguments-variable/ + @props: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`; + -webkit-box-shadow: @props; + -moz-box-shadow: @props; + box-shadow: @props; +} + +// Transitions +.transition(@transition) { + -webkit-transition: @transition; + -moz-transition: @transition; + -o-transition: @transition; + transition: @transition; +} +.transition-delay(@transition-delay) { + -webkit-transition-delay: @transition-delay; + -moz-transition-delay: @transition-delay; + -o-transition-delay: @transition-delay; + transition-delay: @transition-delay; +} + +// Transformations +.rotate(@degrees) { + -webkit-transform: rotate(@degrees); + -moz-transform: rotate(@degrees); + -ms-transform: rotate(@degrees); + -o-transform: rotate(@degrees); + transform: rotate(@degrees); +} +.scale(@ratio) { + -webkit-transform: scale(@ratio); + -moz-transform: scale(@ratio); + -ms-transform: scale(@ratio); + -o-transform: scale(@ratio); + transform: scale(@ratio); +} +.translate(@x, @y) { + -webkit-transform: translate(@x, @y); + -moz-transform: translate(@x, @y); + -ms-transform: translate(@x, @y); + -o-transform: translate(@x, @y); + transform: translate(@x, @y); +} +.skew(@x, @y) { + -webkit-transform: skew(@x, @y); + -moz-transform: skew(@x, @y); + -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885 + -o-transform: skew(@x, @y); + transform: skew(@x, @y); +} +.translate3d(@x, @y, @z) { + -webkit-transform: translate3d(@x, @y, @z); + -moz-transform: translate3d(@x, @y, @z); + -o-transform: translate3d(@x, @y, @z); + transform: translate3d(@x, @y, @z); +} + +// Backface visibility +// Prevent browsers from flickering when using CSS 3D transforms. +// Default value is `visible`, but can be changed to `hidden +// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples +.backface-visibility(@visibility){ + -webkit-backface-visibility: @visibility; + -moz-backface-visibility: @visibility; + backface-visibility: @visibility; +} + +// Background clipping +// Heads up: FF 3.6 and under need "padding" instead of "padding-box" +.background-clip(@clip) { + -webkit-background-clip: @clip; + -moz-background-clip: @clip; + background-clip: @clip; +} + +// Background sizing +.background-size(@size){ + -webkit-background-size: @size; + -moz-background-size: @size; + -o-background-size: @size; + background-size: @size; +} + + +// Box sizing +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} + +// User select +// For selecting text on the page +.user-select(@select) { + -webkit-user-select: @select; + -moz-user-select: @select; + -ms-user-select: @select; + -o-user-select: @select; + user-select: @select; +} + +// Resize anything +.resizable(@direction) { + resize: @direction; // Options: horizontal, vertical, both + overflow: auto; // Safari fix +} + +// CSS3 Content Columns +.content-columns(@columnCount, @columnGap: @gridGutterWidth) { + -webkit-column-count: @columnCount; + -moz-column-count: @columnCount; + column-count: @columnCount; + -webkit-column-gap: @columnGap; + -moz-column-gap: @columnGap; + column-gap: @columnGap; +} + +// Optional hyphenation +.hyphens(@mode: auto) { + word-wrap: break-word; + -webkit-hyphens: @mode; + -moz-hyphens: @mode; + -ms-hyphens: @mode; + -o-hyphens: @mode; + hyphens: @mode; +} + +// Opacity +.opacity(@opacity) { + opacity: @opacity / 100; + filter: ~"alpha(opacity=@{opacity})"; +} + + + +// BACKGROUNDS +// -------------------------------------------------- + +// Add an alphatransparency value to any background or border color (via Elyse Holladay) +#translucent { + .background(@color: @white, @alpha: 1) { + background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha); + } + .border(@color: @white, @alpha: 1) { + border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha); + .background-clip(padding-box); + } +} + +// Gradient Bar Colors for buttons and alerts +.gradientBar(@primaryColor, @secondaryColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) { + color: @textColor; + text-shadow: @textShadow; + #gradient > .vertical(@primaryColor, @secondaryColor); + border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%); + border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%); +} + +// Gradients +#gradient { + .horizontal(@startColor: #555, @endColor: #333) { + background-color: @endColor; + background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(to right, @startColor, @endColor); // Standard, IE10 + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down + } + .vertical(@startColor: #555, @endColor: #333) { + background-color: mix(@startColor, @endColor, 60%); + background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10 + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down + } + .directional(@startColor: #555, @endColor: #333, @deg: 45deg) { + background-color: @endColor; + background-repeat: repeat-x; + background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10 + } + .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) { + background-color: mix(@midColor, @endColor, 80%); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor)); + background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor); + background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-repeat: no-repeat; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback + } + .radial(@innerColor: #555, @outerColor: #333) { + background-color: @outerColor; + background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor)); + background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor); + background-image: -moz-radial-gradient(circle, @innerColor, @outerColor); + background-image: -o-radial-gradient(circle, @innerColor, @outerColor); + background-repeat: no-repeat; + } + .striped(@color: #555, @angle: 45deg) { + background-color: @color; + background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent)); + background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + } +} +// Reset filters for IE +.reset-filter() { + filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)")); +} + + + +// COMPONENT MIXINS +// -------------------------------------------------- + +// Horizontal dividers +// ------------------------- +// Dividers (basically an hr) within dropdowns and nav lists +.nav-divider(@top: #e5e5e5, @bottom: @white) { + // IE7 needs a set width since we gave a height. Restricting just + // to IE7 to keep the 1px left/right space in other browsers. + // It is unclear where IE is getting the extra space that we need + // to negative-margin away, but so it goes. + *width: 100%; + height: 1px; + margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px + *margin: -5px 0 5px; + overflow: hidden; + background-color: @top; + border-bottom: 1px solid @bottom; +} + +// Button backgrounds +// ------------------ +.buttonBackground(@startColor, @endColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) { + // gradientBar will set the background to a pleasing blend of these, to support IE<=9 + .gradientBar(@startColor, @endColor, @textColor, @textShadow); + *background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */ + .reset-filter(); + + // in these cases the gradient won't cover the background, so we override + &:hover, &:active, &.active, &.disabled, &[disabled] { + color: @textColor; + background-color: @endColor; + *background-color: darken(@endColor, 5%); + } + + // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves + &:active, + &.active { + background-color: darken(@endColor, 10%) e("\9"); + } +} + +// Navbar vertical align +// ------------------------- +// Vertically center elements in the navbar. +// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin. +.navbarVerticalAlign(@elementHeight) { + margin-top: (@navbarHeight - @elementHeight) / 2; +} + + + +// Grid System +// ----------- + +// Centered container element +.container-fixed() { + margin-right: auto; + margin-left: auto; + .clearfix(); +} + +// Table columns +.tableColumns(@columnSpan: 1) { + float: none; // undo default grid column styles + width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells + margin-left: 0; // undo default grid column styles +} + +// Make a Grid +// Use .makeRow and .makeColumn to assign semantic layouts grid system behavior +.makeRow() { + margin-left: @gridGutterWidth * -1; + .clearfix(); +} +.makeColumn(@columns: 1, @offset: 0) { + float: left; + margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2); + width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); +} + +// The Grid +#grid { + + .core (@gridColumnWidth, @gridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~".span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .offsetX (@index) when (@index > 0) { + (~".offset@{index}") { .offset(@index); } + .offsetX(@index - 1); + } + .offsetX (0) {} + + .offset (@columns) { + margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1)); + } + + .span (@columns) { + width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + } + + .row { + margin-left: @gridGutterWidth * -1; + .clearfix(); + } + + [class*="span"] { + float: left; + min-height: 1px; // prevent collapsing columns + margin-left: @gridGutterWidth; + } + + // Set the container width, and override it for fixed navbars in media queries + .container, + .navbar-static-top .container, + .navbar-fixed-top .container, + .navbar-fixed-bottom .container { .span(@gridColumns); } + + // generate .spanX and .offsetX + .spanX (@gridColumns); + .offsetX (@gridColumns); + + } + + .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~".span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .offsetX (@index) when (@index > 0) { + (~'.offset@{index}') { .offset(@index); } + (~'.offset@{index}:first-child') { .offsetFirstChild(@index); } + .offsetX(@index - 1); + } + .offsetX (0) {} + + .offset (@columns) { + margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2); + *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%); + } + + .offsetFirstChild (@columns) { + margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth); + *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + } + + .span (@columns) { + width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); + *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%); + } + + .row-fluid { + width: 100%; + .clearfix(); + [class*="span"] { + .input-block-level(); + float: left; + margin-left: @fluidGridGutterWidth; + *margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + } + [class*="span"]:first-child { + margin-left: 0; + } + + // generate .spanX and .offsetX + .spanX (@gridColumns); + .offsetX (@gridColumns); + } + + } + + .input(@gridColumnWidth, @gridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .span(@columns) { + width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14; + } + + input, + textarea, + .uneditable-input { + margin-left: 0; // override margin-left from core grid system + } + + // Space grid-sized controls properly if multiple per line + .controls-row [class*="span"] + [class*="span"] { + margin-left: @gridGutterWidth; + } + + // generate .spanX + .spanX (@gridColumns); + + } + +} diff --git a/examples/container-amd/css/bootstrap/modals.less b/examples/container-amd/css/bootstrap/modals.less new file mode 100644 index 00000000..81cacb7a --- /dev/null +++ b/examples/container-amd/css/bootstrap/modals.less @@ -0,0 +1,98 @@ +// +// Modals +// -------------------------------------------------- + + +// Recalculate z-index where appropriate, +// but only apply to elements within modal +.modal-open .modal { + .dropdown-menu { z-index: @zindexDropdown + @zindexModal; } + .dropdown.open { *z-index: @zindexDropdown + @zindexModal; } + .popover { z-index: @zindexPopover + @zindexModal; } + .tooltip { z-index: @zindexTooltip + @zindexModal; } +} + +// Background +.modal-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: @zindexModalBackdrop; + background-color: @black; + // Fade for backdrop + &.fade { opacity: 0; } +} + +.modal-backdrop, +.modal-backdrop.fade.in { + .opacity(80); +} + +// Base modal +.modal { + position: fixed; + top: 50%; + left: 50%; + z-index: @zindexModal; + overflow: auto; + width: 560px; + margin: -250px 0 0 -280px; + background-color: @white; + border: 1px solid #999; + border: 1px solid rgba(0,0,0,.3); + *border: 1px solid #999; /* IE6-7 */ + .border-radius(6px); + .box-shadow(0 3px 7px rgba(0,0,0,0.3)); + .background-clip(padding-box); + &.fade { + .transition(e('opacity .3s linear, top .3s ease-out')); + top: -25%; + } + &.fade.in { top: 50%; } +} +.modal-header { + padding: 9px 15px; + border-bottom: 1px solid #eee; + // Close icon + .close { margin-top: 2px; } + // Heading + h3 { + margin: 0; + line-height: 30px; + } +} + +// Body (where all modal content resides) +.modal-body { + overflow-y: auto; + max-height: 400px; + padding: 15px; +} +// Remove bottom margin if need be +.modal-form { + margin-bottom: 0; +} + +// Footer (for actions) +.modal-footer { + padding: 14px 15px 15px; + margin-bottom: 0; + text-align: right; // right align buttons + background-color: #f5f5f5; + border-top: 1px solid #ddd; + .border-radius(0 0 6px 6px); + .box-shadow(inset 0 1px 0 @white); + .clearfix(); // clear it in case folks use .pull-* classes on buttons + + // Properly space out buttons + .btn + .btn { + margin-left: 5px; + margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs + } + // but override that for button groups + .btn-group .btn + .btn { + margin-left: -1px; + } +} diff --git a/examples/container-amd/css/bootstrap/navbar.less b/examples/container-amd/css/bootstrap/navbar.less new file mode 100644 index 00000000..3514c40e --- /dev/null +++ b/examples/container-amd/css/bootstrap/navbar.less @@ -0,0 +1,475 @@ +// +// Navbars (Redux) +// -------------------------------------------------- + + +// COMMON STYLES +// ------------- + +// Base class and wrapper +.navbar { + overflow: visible; + margin-bottom: @baseLineHeight; + color: @navbarText; + + // Fix for IE7's bad z-indexing so dropdowns don't appear below content that follows the navbar + *position: relative; + *z-index: 2; +} + +// Inner for background effects +// Gradient is applied to its own element because overflow visible is not honored by IE when filter is present +.navbar-inner { + min-height: @navbarHeight; + padding-left: 20px; + padding-right: 20px; + #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground); + border: 1px solid @navbarBorder; + .border-radius(4px); + .box-shadow(0 1px 4px rgba(0,0,0,.065)); + + // Prevent floats from breaking the navbar + .clearfix(); +} + +// Set width to auto for default container +// We then reset it for fixed navbars in the #gridSystem mixin +.navbar .container { + width: auto; +} + +// Override the default collapsed state +.nav-collapse.collapse { + height: auto; +} + + +// Brand: website or project name +// ------------------------- +.navbar .brand { + float: left; + display: block; + // Vertically center the text given @navbarHeight + padding: ((@navbarHeight - @baseLineHeight) / 2) 20px ((@navbarHeight - @baseLineHeight) / 2); + margin-left: -20px; // negative indent to left-align the text down the page + font-size: 20px; + font-weight: 200; + color: @navbarBrandColor; + text-shadow: 0 1px 0 @navbarBackgroundHighlight; + &:hover { + text-decoration: none; + } +} + +// Plain text in topbar +// ------------------------- +.navbar-text { + margin-bottom: 0; + line-height: @navbarHeight; +} + +// Janky solution for now to account for links outside the .nav +// ------------------------- +.navbar-link { + color: @navbarLinkColor; + &:hover { + color: @navbarLinkColorHover; + } +} + +// Dividers in navbar +// ------------------------- +.navbar .divider-vertical { + height: @navbarHeight; + margin: 0 9px; + border-left: 1px solid @navbarBackground; + border-right: 1px solid @navbarBackgroundHighlight; +} + +// Buttons in navbar +// ------------------------- +.navbar .btn, +.navbar .btn-group { + .navbarVerticalAlign(30px); // Vertically center in navbar +} +.navbar .btn-group .btn, +.navbar .input-prepend .btn, +.navbar .input-append .btn { + margin-top: 0; // then undo the margin here so we don't accidentally double it +} + +// Navbar forms +// ------------------------- +.navbar-form { + margin-bottom: 0; // remove default bottom margin + .clearfix(); + input, + select, + .radio, + .checkbox { + .navbarVerticalAlign(30px); // Vertically center in navbar + } + input, + select, + .btn { + display: inline-block; + margin-bottom: 0; + } + input[type="image"], + input[type="checkbox"], + input[type="radio"] { + margin-top: 3px; + } + .input-append, + .input-prepend { + margin-top: 6px; + white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left + input { + margin-top: 0; // remove the margin on top since it's on the parent + } + } +} + +// Navbar search +// ------------------------- +.navbar-search { + position: relative; + float: left; + .navbarVerticalAlign(30px); // Vertically center in navbar + margin-bottom: 0; + .search-query { + margin-bottom: 0; + padding: 4px 14px; + #font > .sans-serif(13px, normal, 1); + .border-radius(15px); // redeclare because of specificity of the type attribute + } +} + + + +// Static navbar +// ------------------------- + +.navbar-static-top { + position: static; + width: 100%; + margin-bottom: 0; // remove 18px margin for default navbar + .navbar-inner { + .border-radius(0); + } +} + + + +// Fixed navbar +// ------------------------- + +// Shared (top/bottom) styles +.navbar-fixed-top, +.navbar-fixed-bottom { + position: fixed; + right: 0; + left: 0; + z-index: @zindexFixedNavbar; + margin-bottom: 0; // remove 18px margin for default navbar +} +.navbar-fixed-top .navbar-inner, +.navbar-static-top .navbar-inner { + border-width: 0 0 1px; +} +.navbar-fixed-bottom .navbar-inner { + border-width: 1px 0 0; +} +.navbar-fixed-top .navbar-inner, +.navbar-fixed-bottom .navbar-inner { + padding-left: 0; + padding-right: 0; + .border-radius(0); +} + +// Reset container width +// Required here as we reset the width earlier on and the grid mixins don't override early enough +.navbar-static-top .container, +.navbar-fixed-top .container, +.navbar-fixed-bottom .container { + #grid > .core > .span(@gridColumns); +} + +// Fixed to top +.navbar-fixed-top { + top: 0; +} +.navbar-fixed-top, +.navbar-static-top { + .navbar-inner { + .box-shadow(inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1)); + } +} + +// Fixed to bottom +.navbar-fixed-bottom { + bottom: 0; + .navbar-inner { + .box-shadow(inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1)); + } +} + + + +// NAVIGATION +// ---------- + +.navbar .nav { + position: relative; + left: 0; + display: block; + float: left; + margin: 0 10px 0 0; +} +.navbar .nav.pull-right { + float: right; // redeclare due to specificity + margin-right: 0; // remove margin on float right nav +} +.navbar .nav > li { + float: left; +} + +// Links +.navbar .nav > li > a { + float: none; + // Vertically center the text given @navbarHeight + padding: ((@navbarHeight - @baseLineHeight) / 2) 15px ((@navbarHeight - @baseLineHeight) / 2); + color: @navbarLinkColor; + text-decoration: none; + text-shadow: 0 1px 0 @navbarBackgroundHighlight; +} +.navbar .nav .dropdown-toggle .caret { + margin-top: 8px; +} + +// Hover +.navbar .nav > li > a:focus, +.navbar .nav > li > a:hover { + background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active + color: @navbarLinkColorHover; + text-decoration: none; +} + +// Active nav items +.navbar .nav > .active > a, +.navbar .nav > .active > a:hover, +.navbar .nav > .active > a:focus { + color: @navbarLinkColorActive; + text-decoration: none; + background-color: @navbarLinkBackgroundActive; + .box-shadow(inset 0 3px 8px rgba(0,0,0,.125)); +} + +// Navbar button for toggling navbar items in responsive layouts +// These definitions need to come after '.navbar .btn' +.navbar .btn-navbar { + display: none; + float: right; + padding: 7px 10px; + margin-left: 5px; + margin-right: 5px; + .buttonBackground(darken(@navbarBackgroundHighlight, 5%), darken(@navbarBackground, 5%)); + .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)); +} +.navbar .btn-navbar .icon-bar { + display: block; + width: 18px; + height: 2px; + background-color: #f5f5f5; + .border-radius(1px); + .box-shadow(0 1px 0 rgba(0,0,0,.25)); +} +.btn-navbar .icon-bar + .icon-bar { + margin-top: 3px; +} + + + +// Dropdown menus +// -------------- + +// Menu position and menu carets +.navbar .nav > li > .dropdown-menu { + &:before { + content: ''; + display: inline-block; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + border-bottom: 7px solid #ccc; + border-bottom-color: @dropdownBorder; + position: absolute; + top: -7px; + left: 9px; + } + &:after { + content: ''; + display: inline-block; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid @dropdownBackground; + position: absolute; + top: -6px; + left: 10px; + } +} +// Menu position and menu caret support for dropups via extra dropup class +.navbar-fixed-bottom .nav > li > .dropdown-menu { + &:before { + border-top: 7px solid #ccc; + border-top-color: @dropdownBorder; + border-bottom: 0; + bottom: -7px; + top: auto; + } + &:after { + border-top: 6px solid @dropdownBackground; + border-bottom: 0; + bottom: -6px; + top: auto; + } +} + +// Remove background color from open dropdown +.navbar .nav li.dropdown.open > .dropdown-toggle, +.navbar .nav li.dropdown.active > .dropdown-toggle, +.navbar .nav li.dropdown.open.active > .dropdown-toggle { + background-color: @navbarLinkBackgroundActive; + color: @navbarLinkColorActive; +} +.navbar .nav li.dropdown > .dropdown-toggle .caret { + border-top-color: @navbarLinkColor; + border-bottom-color: @navbarLinkColor; +} +.navbar .nav li.dropdown.open > .dropdown-toggle .caret, +.navbar .nav li.dropdown.active > .dropdown-toggle .caret, +.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret { + border-top-color: @navbarLinkColorActive; + border-bottom-color: @navbarLinkColorActive; +} + +// Right aligned menus need alt position +.navbar .pull-right > li > .dropdown-menu, +.navbar .nav > li > .dropdown-menu.pull-right { + left: auto; + right: 0; + &:before { + left: auto; + right: 12px; + } + &:after { + left: auto; + right: 13px; + } + .dropdown-menu { + left: auto; + right: 100%; + margin-left: 0; + margin-right: -1px; + .border-radius(6px 0 6px 6px); + } +} + + +// Inverted navbar +// ------------------------- + +.navbar-inverse { + color: @navbarInverseText; + + .navbar-inner { + #gradient > .vertical(@navbarInverseBackgroundHighlight, @navbarInverseBackground); + border-color: @navbarInverseBorder; + } + + .brand, + .nav > li > a { + color: @navbarInverseLinkColor; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + &:hover { + color: @navbarInverseLinkColorHover; + } + } + + .nav > li > a:focus, + .nav > li > a:hover { + background-color: @navbarInverseLinkBackgroundHover; + color: @navbarInverseLinkColorHover; + } + + .nav .active > a, + .nav .active > a:hover, + .nav .active > a:focus { + color: @navbarInverseLinkColorActive; + background-color: @navbarInverseLinkBackgroundActive; + } + + // Inline text links + .navbar-link { + color: @navbarInverseLinkColor; + &:hover { + color: @navbarInverseLinkColorHover; + } + } + + // Dividers in navbar + .divider-vertical { + border-left-color: @navbarInverseBackground; + border-right-color: @navbarInverseBackgroundHighlight; + } + + // Dropdowns + .nav li.dropdown.open > .dropdown-toggle, + .nav li.dropdown.active > .dropdown-toggle, + .nav li.dropdown.open.active > .dropdown-toggle { + background-color: @navbarInverseLinkBackgroundActive; + color: @navbarInverseLinkColorActive; + } + .nav li.dropdown > .dropdown-toggle .caret { + border-top-color: @navbarInverseLinkColor; + border-bottom-color: @navbarInverseLinkColor; + } + .nav li.dropdown.open > .dropdown-toggle .caret, + .nav li.dropdown.active > .dropdown-toggle .caret, + .nav li.dropdown.open.active > .dropdown-toggle .caret { + border-top-color: @navbarInverseLinkColorActive; + border-bottom-color: @navbarInverseLinkColorActive; + } + + // Navbar search + .navbar-search { + .search-query { + color: @white; + background-color: @navbarInverseSearchBackground; + border-color: @navbarInverseSearchBorder; + .box-shadow(inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)); + .transition(none); + .placeholder(@navbarInverseSearchPlaceholderColor); + + // Focus states (we use .focused since IE7-8 and down doesn't support :focus) + &:focus, + &.focused { + padding: 5px 15px; + color: @grayDark; + text-shadow: 0 1px 0 @white; + background-color: @navbarInverseSearchBackgroundFocus; + border: 0; + .box-shadow(0 0 3px rgba(0,0,0,.15)); + outline: 0; + } + } + } + + // Navbar collapse button + .btn-navbar { + .buttonBackground(darken(@navbarInverseBackgroundHighlight, 5%), darken(@navbarInverseBackground, 5%)); + } + +} + + + diff --git a/examples/container-amd/css/bootstrap/navs.less b/examples/container-amd/css/bootstrap/navs.less new file mode 100644 index 00000000..4c38f7db --- /dev/null +++ b/examples/container-amd/css/bootstrap/navs.less @@ -0,0 +1,384 @@ +// +// Navs +// -------------------------------------------------- + + +// BASE CLASS +// ---------- + +.nav { + margin-left: 0; + margin-bottom: @baseLineHeight; + list-style: none; +} + +// Make links block level +.nav > li > a { + display: block; +} +.nav > li > a:hover { + text-decoration: none; + background-color: @grayLighter; +} + +// Redeclare pull classes because of specifity +.nav > .pull-right { + float: right; +} + +// Nav headers (for dropdowns and lists) +.nav-header { + display: block; + padding: 3px 15px; + font-size: 11px; + font-weight: bold; + line-height: @baseLineHeight; + color: @grayLight; + text-shadow: 0 1px 0 rgba(255,255,255,.5); + text-transform: uppercase; +} +// Space them out when they follow another list item (link) +.nav li + .nav-header { + margin-top: 9px; +} + + + +// NAV LIST +// -------- + +.nav-list { + padding-left: 15px; + padding-right: 15px; + margin-bottom: 0; +} +.nav-list > li > a, +.nav-list .nav-header { + margin-left: -15px; + margin-right: -15px; + text-shadow: 0 1px 0 rgba(255,255,255,.5); +} +.nav-list > li > a { + padding: 3px 15px; +} +.nav-list > .active > a, +.nav-list > .active > a:hover { + color: @white; + text-shadow: 0 -1px 0 rgba(0,0,0,.2); + background-color: @linkColor; +} +.nav-list [class^="icon-"] { + margin-right: 2px; +} +// Dividers (basically an hr) within the dropdown +.nav-list .divider { + .nav-divider(); +} + + + +// TABS AND PILLS +// ------------- + +// Common styles +.nav-tabs, +.nav-pills { + .clearfix(); +} +.nav-tabs > li, +.nav-pills > li { + float: left; +} +.nav-tabs > li > a, +.nav-pills > li > a { + padding-right: 12px; + padding-left: 12px; + margin-right: 2px; + line-height: 14px; // keeps the overall height an even number +} + +// TABS +// ---- + +// Give the tabs something to sit on +.nav-tabs { + border-bottom: 1px solid #ddd; +} +// Make the list-items overlay the bottom border +.nav-tabs > li { + margin-bottom: -1px; +} +// Actual tabs (as links) +.nav-tabs > li > a { + padding-top: 8px; + padding-bottom: 8px; + line-height: @baseLineHeight; + border: 1px solid transparent; + .border-radius(4px 4px 0 0); + &:hover { + border-color: @grayLighter @grayLighter #ddd; + } +} +// Active state, and it's :hover to override normal :hover +.nav-tabs > .active > a, +.nav-tabs > .active > a:hover { + color: @gray; + background-color: @white; + border: 1px solid #ddd; + border-bottom-color: transparent; + cursor: default; +} + + +// PILLS +// ----- + +// Links rendered as pills +.nav-pills > li > a { + padding-top: 8px; + padding-bottom: 8px; + margin-top: 2px; + margin-bottom: 2px; + .border-radius(5px); +} + +// Active state +.nav-pills > .active > a, +.nav-pills > .active > a:hover { + color: @white; + background-color: @linkColor; +} + + + +// STACKED NAV +// ----------- + +// Stacked tabs and pills +.nav-stacked > li { + float: none; +} +.nav-stacked > li > a { + margin-right: 0; // no need for the gap between nav items +} + +// Tabs +.nav-tabs.nav-stacked { + border-bottom: 0; +} +.nav-tabs.nav-stacked > li > a { + border: 1px solid #ddd; + .border-radius(0); +} +.nav-tabs.nav-stacked > li:first-child > a { + .border-top-radius(4px); +} +.nav-tabs.nav-stacked > li:last-child > a { + .border-bottom-radius(4px); +} +.nav-tabs.nav-stacked > li > a:hover { + border-color: #ddd; + z-index: 2; +} + +// Pills +.nav-pills.nav-stacked > li > a { + margin-bottom: 3px; +} +.nav-pills.nav-stacked > li:last-child > a { + margin-bottom: 1px; // decrease margin to match sizing of stacked tabs +} + + + +// DROPDOWNS +// --------- + +.nav-tabs .dropdown-menu { + .border-radius(0 0 6px 6px); // remove the top rounded corners here since there is a hard edge above the menu +} +.nav-pills .dropdown-menu { + .border-radius(6px); // make rounded corners match the pills +} + +// Default dropdown links +// ------------------------- +// Make carets use linkColor to start +.nav .dropdown-toggle .caret { + border-top-color: @linkColor; + border-bottom-color: @linkColor; + margin-top: 6px; +} +.nav .dropdown-toggle:hover .caret { + border-top-color: @linkColorHover; + border-bottom-color: @linkColorHover; +} +/* move down carets for tabs */ +.nav-tabs .dropdown-toggle .caret { + margin-top: 8px; +} + +// Active dropdown links +// ------------------------- +.nav .active .dropdown-toggle .caret { + border-top-color: #fff; + border-bottom-color: #fff; +} +.nav-tabs .active .dropdown-toggle .caret { + border-top-color: @gray; + border-bottom-color: @gray; +} + +// Active:hover dropdown links +// ------------------------- +.nav > .dropdown.active > a:hover { + cursor: pointer; +} + +// Open dropdowns +// ------------------------- +.nav-tabs .open .dropdown-toggle, +.nav-pills .open .dropdown-toggle, +.nav > li.dropdown.open.active > a:hover { + color: @white; + background-color: @grayLight; + border-color: @grayLight; +} +.nav li.dropdown.open .caret, +.nav li.dropdown.open.active .caret, +.nav li.dropdown.open a:hover .caret { + border-top-color: @white; + border-bottom-color: @white; + .opacity(100); +} + +// Dropdowns in stacked tabs +.tabs-stacked .open > a:hover { + border-color: @grayLight; +} + + + +// TABBABLE +// -------- + + +// COMMON STYLES +// ------------- + +// Clear any floats +.tabbable { + .clearfix(); +} +.tab-content { + overflow: auto; // prevent content from running below tabs +} + +// Remove border on bottom, left, right +.tabs-below > .nav-tabs, +.tabs-right > .nav-tabs, +.tabs-left > .nav-tabs { + border-bottom: 0; +} + +// Show/hide tabbable areas +.tab-content > .tab-pane, +.pill-content > .pill-pane { + display: none; +} +.tab-content > .active, +.pill-content > .active { + display: block; +} + + +// BOTTOM +// ------ + +.tabs-below > .nav-tabs { + border-top: 1px solid #ddd; +} +.tabs-below > .nav-tabs > li { + margin-top: -1px; + margin-bottom: 0; +} +.tabs-below > .nav-tabs > li > a { + .border-radius(0 0 4px 4px); + &:hover { + border-bottom-color: transparent; + border-top-color: #ddd; + } +} +.tabs-below > .nav-tabs > .active > a, +.tabs-below > .nav-tabs > .active > a:hover { + border-color: transparent #ddd #ddd #ddd; +} + +// LEFT & RIGHT +// ------------ + +// Common styles +.tabs-left > .nav-tabs > li, +.tabs-right > .nav-tabs > li { + float: none; +} +.tabs-left > .nav-tabs > li > a, +.tabs-right > .nav-tabs > li > a { + min-width: 74px; + margin-right: 0; + margin-bottom: 3px; +} + +// Tabs on the left +.tabs-left > .nav-tabs { + float: left; + margin-right: 19px; + border-right: 1px solid #ddd; +} +.tabs-left > .nav-tabs > li > a { + margin-right: -1px; + .border-radius(4px 0 0 4px); +} +.tabs-left > .nav-tabs > li > a:hover { + border-color: @grayLighter #ddd @grayLighter @grayLighter; +} +.tabs-left > .nav-tabs .active > a, +.tabs-left > .nav-tabs .active > a:hover { + border-color: #ddd transparent #ddd #ddd; + *border-right-color: @white; +} + +// Tabs on the right +.tabs-right > .nav-tabs { + float: right; + margin-left: 19px; + border-left: 1px solid #ddd; +} +.tabs-right > .nav-tabs > li > a { + margin-left: -1px; + .border-radius(0 4px 4px 0); +} +.tabs-right > .nav-tabs > li > a:hover { + border-color: @grayLighter @grayLighter @grayLighter #ddd; +} +.tabs-right > .nav-tabs .active > a, +.tabs-right > .nav-tabs .active > a:hover { + border-color: #ddd #ddd #ddd transparent; + *border-left-color: @white; +} + + + +// DISABLED STATES +// --------------- + +// Gray out text +.nav > .disabled > a { + color: @grayLight; +} +// Nuke hover effects +.nav > .disabled > a:hover { + text-decoration: none; + background-color: transparent; + cursor: default; +} diff --git a/examples/container-amd/css/bootstrap/pager.less b/examples/container-amd/css/bootstrap/pager.less new file mode 100644 index 00000000..a7629d3d --- /dev/null +++ b/examples/container-amd/css/bootstrap/pager.less @@ -0,0 +1,40 @@ +// +// Pager pagination +// -------------------------------------------------- + + +.pager { + margin: @baseLineHeight 0; + list-style: none; + text-align: center; + .clearfix(); +} +.pager li { + display: inline; +} +.pager a, +.pager span { + display: inline-block; + padding: 5px 14px; + background-color: #fff; + border: 1px solid #ddd; + .border-radius(15px); +} +.pager a:hover { + text-decoration: none; + background-color: #f5f5f5; +} +.pager .next a, +.pager .next span { + float: right; +} +.pager .previous a { + float: left; +} +.pager .disabled a, +.pager .disabled a:hover, +.pager .disabled span { + color: @grayLight; + background-color: #fff; + cursor: default; +} \ No newline at end of file diff --git a/examples/container-amd/css/bootstrap/pagination.less b/examples/container-amd/css/bootstrap/pagination.less new file mode 100644 index 00000000..61a760be --- /dev/null +++ b/examples/container-amd/css/bootstrap/pagination.less @@ -0,0 +1,64 @@ +// +// Pagination (multiple pages) +// -------------------------------------------------- + + +.pagination { + height: @baseLineHeight * 2; + margin: @baseLineHeight 0; + } +.pagination ul { + display: inline-block; + .ie7-inline-block(); + margin-left: 0; + margin-bottom: 0; + .border-radius(3px); + .box-shadow(0 1px 2px rgba(0,0,0,.05)); +} +.pagination ul > li { + display: inline; +} +.pagination ul > li > a, +.pagination ul > li > span { + float: left; + padding: 0 14px; + line-height: (@baseLineHeight * 2) - 2; + text-decoration: none; + background-color: @paginationBackground; + border: 1px solid @paginationBorder; + border-left-width: 0; +} +.pagination ul > li > a:hover, +.pagination ul > .active > a, +.pagination ul > .active > span { + background-color: #f5f5f5; +} +.pagination ul > .active > a, +.pagination ul > .active > span { + color: @grayLight; + cursor: default; +} +.pagination ul > .disabled > span, +.pagination ul > .disabled > a, +.pagination ul > .disabled > a:hover { + color: @grayLight; + background-color: transparent; + cursor: default; +} +.pagination ul > li:first-child > a, +.pagination ul > li:first-child > span { + border-left-width: 1px; + .border-radius(3px 0 0 3px); +} +.pagination ul > li:last-child > a, +.pagination ul > li:last-child > span { + .border-radius(0 3px 3px 0); +} + +// Centered +.pagination-centered { + text-align: center; +} +.pagination-right { + text-align: right; +} diff --git a/examples/container-amd/css/bootstrap/popovers.less b/examples/container-amd/css/bootstrap/popovers.less new file mode 100644 index 00000000..2b3f1b05 --- /dev/null +++ b/examples/container-amd/css/bootstrap/popovers.less @@ -0,0 +1,117 @@ +// +// Popovers +// -------------------------------------------------- + + +.popover { + position: absolute; + top: 0; + left: 0; + z-index: @zindexPopover; + display: none; + width: 236px; + padding: 1px; + background-color: @popoverBackground; + -webkit-background-clip: padding-box; + -moz-background-clip: padding; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.2); + .border-radius(6px); + .box-shadow(0 5px 10px rgba(0,0,0,.2)); + + // Offset the popover to account for the popover arrow + &.top { margin-bottom: 10px; } + &.right { margin-left: 10px; } + &.bottom { margin-top: 10px; } + &.left { margin-right: 10px; } + +} + +.popover-title { + margin: 0; // reset heading margin + padding: 8px 14px; + font-size: 14px; + font-weight: normal; + line-height: 18px; + background-color: @popoverTitleBackground; + border-bottom: 1px solid darken(@popoverTitleBackground, 5%); + .border-radius(5px 5px 0 0); +} + +.popover-content { + padding: 9px 14px; + p, ul, ol { + margin-bottom: 0; + } +} + +// Arrows +.popover .arrow, +.popover .arrow:after { + position: absolute; + display: inline-block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.popover .arrow:after { + content: ""; + z-index: -1; +} + +.popover { + &.top .arrow { + bottom: -@popoverArrowWidth; + left: 50%; + margin-left: -@popoverArrowWidth; + border-width: @popoverArrowWidth @popoverArrowWidth 0; + border-top-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth 0; + border-top-color: @popoverArrowOuterColor; + bottom: -1px; + left: -@popoverArrowOuterWidth; + } + } + &.right .arrow { + top: 50%; + left: -@popoverArrowWidth; + margin-top: -@popoverArrowWidth; + border-width: @popoverArrowWidth @popoverArrowWidth @popoverArrowWidth 0; + border-right-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth @popoverArrowOuterWidth 0; + border-right-color: @popoverArrowOuterColor; + bottom: -@popoverArrowOuterWidth; + left: -1px; + } + } + &.bottom .arrow { + top: -@popoverArrowWidth; + left: 50%; + margin-left: -@popoverArrowWidth; + border-width: 0 @popoverArrowWidth @popoverArrowWidth; + border-bottom-color: @popoverArrowColor; + &:after { + border-width: 0 @popoverArrowOuterWidth @popoverArrowOuterWidth; + border-bottom-color: @popoverArrowOuterColor; + top: -1px; + left: -@popoverArrowOuterWidth; + } + } + &.left .arrow { + top: 50%; + right: -@popoverArrowWidth; + margin-top: -@popoverArrowWidth; + border-width: @popoverArrowWidth 0 @popoverArrowWidth @popoverArrowWidth; + border-left-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth 0 @popoverArrowOuterWidth @popoverArrowOuterWidth; + border-left-color: @popoverArrowOuterColor; + bottom: -@popoverArrowOuterWidth; + right: -1px; + } + } +} diff --git a/examples/container-amd/css/bootstrap/progress-bars.less b/examples/container-amd/css/bootstrap/progress-bars.less new file mode 100644 index 00000000..0486371a --- /dev/null +++ b/examples/container-amd/css/bootstrap/progress-bars.less @@ -0,0 +1,122 @@ +// +// Progress bars +// -------------------------------------------------- + + +// ANIMATIONS +// ---------- + +// Webkit +@-webkit-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// Firefox +@-moz-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// IE9 +@-ms-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// Opera +@-o-keyframes progress-bar-stripes { + from { background-position: 0 0; } + to { background-position: 40px 0; } +} + +// Spec +@keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + + + +// THE BARS +// -------- + +// Outer container +.progress { + overflow: hidden; + height: @baseLineHeight; + margin-bottom: @baseLineHeight; + #gradient > .vertical(#f5f5f5, #f9f9f9); + .box-shadow(inset 0 1px 2px rgba(0,0,0,.1)); + .border-radius(4px); +} + +// Bar of progress +.progress .bar { + width: 0%; + height: 100%; + color: @white; + float: left; + font-size: 12px; + text-align: center; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + #gradient > .vertical(#149bdf, #0480be); + .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15)); + .box-sizing(border-box); + .transition(width .6s ease); +} +.progress .bar + .bar { + .box-shadow(inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15)); +} + +// Striped bars +.progress-striped .bar { + #gradient > .striped(#149bdf); + .background-size(40px 40px); +} + +// Call animation for the active one +.progress.active .bar { + -webkit-animation: progress-bar-stripes 2s linear infinite; + -moz-animation: progress-bar-stripes 2s linear infinite; + -ms-animation: progress-bar-stripes 2s linear infinite; + -o-animation: progress-bar-stripes 2s linear infinite; + animation: progress-bar-stripes 2s linear infinite; +} + + + +// COLORS +// ------ + +// Danger (red) +.progress-danger .bar, .progress .bar-danger { + #gradient > .vertical(#ee5f5b, #c43c35); +} +.progress-danger.progress-striped .bar, .progress-striped .bar-danger { + #gradient > .striped(#ee5f5b); +} + +// Success (green) +.progress-success .bar, .progress .bar-success { + #gradient > .vertical(#62c462, #57a957); +} +.progress-success.progress-striped .bar, .progress-striped .bar-success { + #gradient > .striped(#62c462); +} + +// Info (teal) +.progress-info .bar, .progress .bar-info { + #gradient > .vertical(#5bc0de, #339bb9); +} +.progress-info.progress-striped .bar, .progress-striped .bar-info { + #gradient > .striped(#5bc0de); +} + +// Warning (orange) +.progress-warning .bar, .progress .bar-warning { + #gradient > .vertical(lighten(@orange, 15%), @orange); +} +.progress-warning.progress-striped .bar, .progress-striped .bar-warning { + #gradient > .striped(lighten(@orange, 15%)); +} diff --git a/examples/container-amd/css/bootstrap/reset.less b/examples/container-amd/css/bootstrap/reset.less new file mode 100644 index 00000000..2901a85c --- /dev/null +++ b/examples/container-amd/css/bootstrap/reset.less @@ -0,0 +1,137 @@ +// +// Modals +// Adapted from http://github.com/necolas/normalize.css +// -------------------------------------------------- + + +// Display in IE6-9 and FF3 +// ------------------------- + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section { + display: block; +} + +// Display block in IE6-9 and FF3 +// ------------------------- + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +// Prevents modern browsers from displaying 'audio' without controls +// ------------------------- + +audio:not([controls]) { + display: none; +} + +// Base settings +// ------------------------- + +html { + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +// Focus states +a:focus { + .tab-focus(); +} +// Hover & Active +a:hover, +a:active { + outline: 0; +} + +// Prevents sub and sup affecting line-height in all browsers +// ------------------------- + +sub, +sup { + position: relative; + font-size: 75%; + line-height: 0; + vertical-align: baseline; +} +sup { + top: -0.5em; +} +sub { + bottom: -0.25em; +} + +// Img border in a's and image quality +// ------------------------- + +img { + /* Responsive images (ensure images don't scale beyond their parents) */ + max-width: 100%; /* Part 1: Set a maxium relative to the parent */ + width: auto\9; /* IE7-8 need help adjusting responsive images */ + height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */ + + vertical-align: middle; + border: 0; + -ms-interpolation-mode: bicubic; +} + +// Prevent max-width from affecting Google Maps +#map_canvas img { + max-width: none; +} + +// Forms +// ------------------------- + +// Font size in all browsers, margin changes, misc consistency +button, +input, +select, +textarea { + margin: 0; + font-size: 100%; + vertical-align: middle; +} +button, +input { + *overflow: visible; // Inner spacing ie IE6/7 + line-height: normal; // FF3/4 have !important on line-height in UA stylesheet +} +button::-moz-focus-inner, +input::-moz-focus-inner { // Inner padding and border oddities in FF3/4 + padding: 0; + border: 0; +} +button, +input[type="button"], +input[type="reset"], +input[type="submit"] { + cursor: pointer; // Cursors on all buttons applied consistently + -webkit-appearance: button; // Style clickable inputs in iOS +} +input[type="search"] { // Appearance in Safari/Chrome + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-appearance: textfield; +} +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5 +} +textarea { + overflow: auto; // Remove vertical scrollbar in IE6-9 + vertical-align: top; // Readability and alignment cross-browser +} diff --git a/examples/container-amd/css/bootstrap/responsive-1200px-min.less b/examples/container-amd/css/bootstrap/responsive-1200px-min.less new file mode 100644 index 00000000..4f35ba6c --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive-1200px-min.less @@ -0,0 +1,28 @@ +// +// Responsive: Large desktop and up +// -------------------------------------------------- + + +@media (min-width: 1200px) { + + // Fixed grid + #grid > .core(@gridColumnWidth1200, @gridGutterWidth1200); + + // Fluid grid + #grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200); + + // Input grid + #grid > .input(@gridColumnWidth1200, @gridGutterWidth1200); + + // Thumbnails + .thumbnails { + margin-left: -@gridGutterWidth1200; + } + .thumbnails > li { + margin-left: @gridGutterWidth1200; + } + .row-fluid .thumbnails { + margin-left: 0; + } + +} diff --git a/examples/container-amd/css/bootstrap/responsive-767px-max.less b/examples/container-amd/css/bootstrap/responsive-767px-max.less new file mode 100644 index 00000000..79c7eaa8 --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive-767px-max.less @@ -0,0 +1,174 @@ +// +// Responsive: Landscape phone to desktop/tablet +// -------------------------------------------------- + + +@media (max-width: 767px) { + + // Padding to set content in a bit + body { + padding-left: 20px; + padding-right: 20px; + } + // Negative indent the now static "fixed" navbar + .navbar-fixed-top, + .navbar-fixed-bottom, + .navbar-static-top { + margin-left: -20px; + margin-right: -20px; + } + // Remove padding on container given explicit padding set on body + .container-fluid { + padding: 0; + } + + // TYPOGRAPHY + // ---------- + // Reset horizontal dl + .dl-horizontal { + dt { + float: none; + clear: none; + width: auto; + text-align: left; + } + dd { + margin-left: 0; + } + } + + // GRID & CONTAINERS + // ----------------- + // Remove width from containers + .container { + width: auto; + } + // Fluid rows + .row-fluid { + width: 100%; + } + // Undo negative margin on rows and thumbnails + .row, + .thumbnails { + margin-left: 0; + } + .thumbnails > li { + float: none; + margin-left: 0; // Reset the default margin for all li elements when no .span* classes are present + } + // Make all grid-sized elements block level again + [class*="span"], + .row-fluid [class*="span"] { + float: none; + display: block; + width: 100%; + margin-left: 0; + .box-sizing(border-box); + } + .span12, + .row-fluid .span12 { + width: 100%; + .box-sizing(border-box); + } + + // FORM FIELDS + // ----------- + // Make span* classes full width + .input-large, + .input-xlarge, + .input-xxlarge, + input[class*="span"], + select[class*="span"], + textarea[class*="span"], + .uneditable-input { + .input-block-level(); + } + // But don't let it screw up prepend/append inputs + .input-prepend input, + .input-append input, + .input-prepend input[class*="span"], + .input-append input[class*="span"] { + display: inline-block; // redeclare so they don't wrap to new lines + width: auto; + } + .controls-row [class*="span"] + [class*="span"] { + margin-left: 0; + } + + // Modals + .modal { + position: fixed; + top: 20px; + left: 20px; + right: 20px; + width: auto; + margin: 0; + &.fade.in { top: auto; } + } + +} + + + +// UP TO LANDSCAPE PHONE +// --------------------- + +@media (max-width: 480px) { + + // Smooth out the collapsing/expanding nav + .nav-collapse { + -webkit-transform: translate3d(0, 0, 0); // activate the GPU + } + + // Block level the page header small tag for readability + .page-header h1 small { + display: block; + line-height: @baseLineHeight; + } + + // Update checkboxes for iOS + input[type="checkbox"], + input[type="radio"] { + border: 1px solid #ccc; + } + + // Remove the horizontal form styles + .form-horizontal { + .control-label { + float: none; + width: auto; + padding-top: 0; + text-align: left; + } + // Move over all input controls and content + .controls { + margin-left: 0; + } + // Move the options list down to align with labels + .control-list { + padding-top: 0; // has to be padding because margin collaspes + } + // Move over buttons in .form-actions to align with .controls + .form-actions { + padding-left: 10px; + padding-right: 10px; + } + } + + // Modals + .modal { + top: 10px; + left: 10px; + right: 10px; + } + .modal-header .close { + padding: 10px; + margin: -10px; + } + + // Carousel + .carousel-caption { + position: static; + } + +} diff --git a/examples/container-amd/css/bootstrap/responsive-768px-979px.less b/examples/container-amd/css/bootstrap/responsive-768px-979px.less new file mode 100644 index 00000000..8e8c486a --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive-768px-979px.less @@ -0,0 +1,19 @@ +// +// Responsive: Tablet to desktop +// -------------------------------------------------- + + +@media (min-width: 768px) and (max-width: 979px) { + + // Fixed grid + #grid > .core(@gridColumnWidth768, @gridGutterWidth768); + + // Fluid grid + #grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768); + + // Input grid + #grid > .input(@gridColumnWidth768, @gridGutterWidth768); + + // No need to reset .thumbnails here since it's the same @gridGutterWidth + +} diff --git a/examples/container-amd/css/bootstrap/responsive-navbar.less b/examples/container-amd/css/bootstrap/responsive-navbar.less new file mode 100644 index 00000000..c454dd5e --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive-navbar.less @@ -0,0 +1,177 @@ +// +// Responsive: Navbar +// -------------------------------------------------- + + +// TABLETS AND BELOW +// ----------------- +@media (max-width: @navbarCollapseWidth) { + + // UNFIX THE TOPBAR + // ---------------- + // Remove any padding from the body + body { + padding-top: 0; + } + // Unfix the navbars + .navbar-fixed-top, + .navbar-fixed-bottom { + position: static; + } + .navbar-fixed-top { + margin-bottom: @baseLineHeight; + } + .navbar-fixed-bottom { + margin-top: @baseLineHeight; + } + .navbar-fixed-top .navbar-inner, + .navbar-fixed-bottom .navbar-inner { + padding: 5px; + } + .navbar .container { + width: auto; + padding: 0; + } + // Account for brand name + .navbar .brand { + padding-left: 10px; + padding-right: 10px; + margin: 0 0 0 -5px; + } + + // COLLAPSIBLE NAVBAR + // ------------------ + // Nav collapse clears brand + .nav-collapse { + clear: both; + } + // Block-level the nav + .nav-collapse .nav { + float: none; + margin: 0 0 (@baseLineHeight / 2); + } + .nav-collapse .nav > li { + float: none; + } + .nav-collapse .nav > li > a { + margin-bottom: 2px; + } + .nav-collapse .nav > .divider-vertical { + display: none; + } + .nav-collapse .nav .nav-header { + color: @navbarText; + text-shadow: none; + } + // Nav and dropdown links in navbar + .nav-collapse .nav > li > a, + .nav-collapse .dropdown-menu a { + padding: 9px 15px; + font-weight: bold; + color: @navbarLinkColor; + .border-radius(3px); + } + // Buttons + .nav-collapse .btn { + padding: 4px 10px 4px; + font-weight: normal; + .border-radius(4px); + } + .nav-collapse .dropdown-menu li + li a { + margin-bottom: 2px; + } + .nav-collapse .nav > li > a:hover, + .nav-collapse .dropdown-menu a:hover { + background-color: @navbarBackground; + } + .navbar-inverse .nav-collapse .nav > li > a:hover, + .navbar-inverse .nav-collapse .dropdown-menu a:hover { + background-color: @navbarInverseBackground; + } + // Buttons in the navbar + .nav-collapse.in .btn-group { + margin-top: 5px; + padding: 0; + } + // Dropdowns in the navbar + .nav-collapse .dropdown-menu { + position: static; + top: auto; + left: auto; + float: none; + display: block; + max-width: none; + margin: 0 15px; + padding: 0; + background-color: transparent; + border: none; + .border-radius(0); + .box-shadow(none); + } + .nav-collapse .dropdown-menu:before, + .nav-collapse .dropdown-menu:after { + display: none; + } + .nav-collapse .dropdown-menu .divider { + display: none; + } + .nav-collapse .nav > li > .dropdown-menu { + &:before, + &:after { + display: none; + } + } + // Forms in navbar + .nav-collapse .navbar-form, + .nav-collapse .navbar-search { + float: none; + padding: (@baseLineHeight / 2) 15px; + margin: (@baseLineHeight / 2) 0; + border-top: 1px solid @navbarBackground; + border-bottom: 1px solid @navbarBackground; + .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1)); + } + .navbar-inverse .nav-collapse .navbar-form, + .navbar-inverse .nav-collapse .navbar-search { + border-top-color: @navbarInverseBackground; + border-bottom-color: @navbarInverseBackground; + } + // Pull right (secondary) nav content + .navbar .nav-collapse .nav.pull-right { + float: none; + margin-left: 0; + } + // Hide everything in the navbar save .brand and toggle button */ + .nav-collapse, + .nav-collapse.collapse { + overflow: hidden; + height: 0; + } + // Navbar button + .navbar .btn-navbar { + display: block; + } + + // STATIC NAVBAR + // ------------- + .navbar-static .navbar-inner { + padding-left: 10px; + padding-right: 10px; + } + + +} + + +// DEFAULT DESKTOP +// --------------- + +@media (min-width: 980px) { + + // Required to make the collapsing navbar work on regular desktops + .nav-collapse.collapse { + height: auto !important; + overflow: visible !important; + } + +} diff --git a/examples/container-amd/css/bootstrap/responsive-utilities.less b/examples/container-amd/css/bootstrap/responsive-utilities.less new file mode 100644 index 00000000..2c3f6c15 --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive-utilities.less @@ -0,0 +1,43 @@ +// +// Responsive: Utility classes +// -------------------------------------------------- + + +// Hide from screenreaders and browsers +// Credit: HTML5 Boilerplate +.hidden { + display: none; + visibility: hidden; +} + +// Visibility utilities + +// For desktops +.visible-phone { display: none !important; } +.visible-tablet { display: none !important; } +.hidden-phone { } +.hidden-tablet { } +.hidden-desktop { display: none !important; } +.visible-desktop { display: inherit !important; } + +// Tablets & small desktops only +@media (min-width: 768px) and (max-width: 979px) { + // Hide everything else + .hidden-desktop { display: inherit !important; } + .visible-desktop { display: none !important ; } + // Show + .visible-tablet { display: inherit !important; } + // Hide + .hidden-tablet { display: none !important; } +} + +// Phones only +@media (max-width: 767px) { + // Hide everything else + .hidden-desktop { display: inherit !important; } + .visible-desktop { display: none !important; } + // Show + .visible-phone { display: inherit !important; } // Use inherit to restore previous behavior + // Hide + .hidden-phone { display: none !important; } +} diff --git a/examples/container-amd/css/bootstrap/responsive.less b/examples/container-amd/css/bootstrap/responsive.less new file mode 100644 index 00000000..87b34708 --- /dev/null +++ b/examples/container-amd/css/bootstrap/responsive.less @@ -0,0 +1,48 @@ +/*! + * Bootstrap Responsive v2.1.1 + * + * Copyright 2012 Twitter, Inc + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Designed and built with all the love in the world @twitter by @mdo and @fat. + */ + + +// Responsive.less +// For phone and tablet devices +// ------------------------------------------------------------- + + +// REPEAT VARIABLES & MIXINS +// ------------------------- +// Required since we compile the responsive stuff separately + +@import "variables.less"; // Modify this for custom colors, font-sizes, etc +@import "mixins.less"; + + +// RESPONSIVE CLASSES +// ------------------ + +@import "responsive-utilities.less"; + + +// MEDIA QUERIES +// ------------------ + +// Large desktops +@import "responsive-1200px-min.less"; + +// Tablets to regular desktops +@import "responsive-768px-979px.less"; + +// Phones to portrait tablets and narrow desktops +@import "responsive-767px-max.less"; + + +// RESPONSIVE NAVBAR +// ------------------ + +// From 979px and below, show a button to toggle navbar contents +@import "responsive-navbar.less"; diff --git a/examples/container-amd/css/bootstrap/scaffolding.less b/examples/container-amd/css/bootstrap/scaffolding.less new file mode 100644 index 00000000..7a7496a6 --- /dev/null +++ b/examples/container-amd/css/bootstrap/scaffolding.less @@ -0,0 +1,52 @@ +// +// Scaffolding +// -------------------------------------------------- + + +// Body reset +// ------------------------- + +body { + margin: 0; + font-family: @baseFontFamily; + font-size: @baseFontSize; + line-height: @baseLineHeight; + color: @textColor; + background-color: @bodyBackground; +} + + +// Links +// ------------------------- + +a { + color: @linkColor; + text-decoration: none; +} +a:hover { + color: @linkColorHover; + text-decoration: underline; +} + + +// Images +// ------------------------- + +// Rounded corners +.img-rounded { + .border-radius(6px); +} + +// Add polaroid-esque trim +.img-polaroid { + padding: 4px; + background-color: #fff; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.2); + .box-shadow(0 1px 3px rgba(0,0,0,.1)); +} + +// Perfect circle +.img-circle { + .border-radius(500px); // crank the border-radius so it works with most reasonably sized images +} diff --git a/examples/container-amd/css/bootstrap/sprites.less b/examples/container-amd/css/bootstrap/sprites.less new file mode 100644 index 00000000..9bf970fa --- /dev/null +++ b/examples/container-amd/css/bootstrap/sprites.less @@ -0,0 +1,193 @@ +// +// Sprites +// -------------------------------------------------- + + +// ICONS +// ----- + +// All icons receive the styles of the tag with a base class +// of .i and are then given a unique class to add width, height, +// and background-position. Your resulting HTML will look like +// . + +// For the white version of the icons, just add the .icon-white class: +// + +[class^="icon-"], +[class*=" icon-"] { + display: inline-block; + width: 14px; + height: 14px; + .ie7-restore-right-whitespace(); + line-height: 14px; + vertical-align: text-top; + background-image: url("@{iconSpritePath}"); + background-position: 14px 14px; + background-repeat: no-repeat; + margin-top: 1px; +} + +/* White icons with optional class, or on hover/active states of certain elements */ +.icon-white, +.nav-tabs > .active > a > [class^="icon-"], +.nav-tabs > .active > a > [class*=" icon-"], +.nav-pills > .active > a > [class^="icon-"], +.nav-pills > .active > a > [class*=" icon-"], +.nav-list > .active > a > [class^="icon-"], +.nav-list > .active > a > [class*=" icon-"], +.navbar-inverse .nav > .active > a > [class^="icon-"], +.navbar-inverse .nav > .active > a > [class*=" icon-"], +.dropdown-menu > li > a:hover > [class^="icon-"], +.dropdown-menu > li > a:hover > [class*=" icon-"], +.dropdown-menu > .active > a > [class^="icon-"], +.dropdown-menu > .active > a > [class*=" icon-"] { + background-image: url("@{iconWhiteSpritePath}"); +} + +.icon-glass { background-position: 0 0; } +.icon-music { background-position: -24px 0; } +.icon-search { background-position: -48px 0; } +.icon-envelope { background-position: -72px 0; } +.icon-heart { background-position: -96px 0; } +.icon-star { background-position: -120px 0; } +.icon-star-empty { background-position: -144px 0; } +.icon-user { background-position: -168px 0; } +.icon-film { background-position: -192px 0; } +.icon-th-large { background-position: -216px 0; } +.icon-th { background-position: -240px 0; } +.icon-th-list { background-position: -264px 0; } +.icon-ok { background-position: -288px 0; } +.icon-remove { background-position: -312px 0; } +.icon-zoom-in { background-position: -336px 0; } +.icon-zoom-out { background-position: -360px 0; } +.icon-off { background-position: -384px 0; } +.icon-signal { background-position: -408px 0; } +.icon-cog { background-position: -432px 0; } +.icon-trash { background-position: -456px 0; } + +.icon-home { background-position: 0 -24px; } +.icon-file { background-position: -24px -24px; } +.icon-time { background-position: -48px -24px; } +.icon-road { background-position: -72px -24px; } +.icon-download-alt { background-position: -96px -24px; } +.icon-download { background-position: -120px -24px; } +.icon-upload { background-position: -144px -24px; } +.icon-inbox { background-position: -168px -24px; } +.icon-play-circle { background-position: -192px -24px; } +.icon-repeat { background-position: -216px -24px; } +.icon-refresh { background-position: -240px -24px; } +.icon-list-alt { background-position: -264px -24px; } +.icon-lock { background-position: -287px -24px; } // 1px off +.icon-flag { background-position: -312px -24px; } +.icon-headphones { background-position: -336px -24px; } +.icon-volume-off { background-position: -360px -24px; } +.icon-volume-down { background-position: -384px -24px; } +.icon-volume-up { background-position: -408px -24px; } +.icon-qrcode { background-position: -432px -24px; } +.icon-barcode { background-position: -456px -24px; } + +.icon-tag { background-position: 0 -48px; } +.icon-tags { background-position: -25px -48px; } // 1px off +.icon-book { background-position: -48px -48px; } +.icon-bookmark { background-position: -72px -48px; } +.icon-print { background-position: -96px -48px; } +.icon-camera { background-position: -120px -48px; } +.icon-font { background-position: -144px -48px; } +.icon-bold { background-position: -167px -48px; } // 1px off +.icon-italic { background-position: -192px -48px; } +.icon-text-height { background-position: -216px -48px; } +.icon-text-width { background-position: -240px -48px; } +.icon-align-left { background-position: -264px -48px; } +.icon-align-center { background-position: -288px -48px; } +.icon-align-right { background-position: -312px -48px; } +.icon-align-justify { background-position: -336px -48px; } +.icon-list { background-position: -360px -48px; } +.icon-indent-left { background-position: -384px -48px; } +.icon-indent-right { background-position: -408px -48px; } +.icon-facetime-video { background-position: -432px -48px; } +.icon-picture { background-position: -456px -48px; } + +.icon-pencil { background-position: 0 -72px; } +.icon-map-marker { background-position: -24px -72px; } +.icon-adjust { background-position: -48px -72px; } +.icon-tint { background-position: -72px -72px; } +.icon-edit { background-position: -96px -72px; } +.icon-share { background-position: -120px -72px; } +.icon-check { background-position: -144px -72px; } +.icon-move { background-position: -168px -72px; } +.icon-step-backward { background-position: -192px -72px; } +.icon-fast-backward { background-position: -216px -72px; } +.icon-backward { background-position: -240px -72px; } +.icon-play { background-position: -264px -72px; } +.icon-pause { background-position: -288px -72px; } +.icon-stop { background-position: -312px -72px; } +.icon-forward { background-position: -336px -72px; } +.icon-fast-forward { background-position: -360px -72px; } +.icon-step-forward { background-position: -384px -72px; } +.icon-eject { background-position: -408px -72px; } +.icon-chevron-left { background-position: -432px -72px; } +.icon-chevron-right { background-position: -456px -72px; } + +.icon-plus-sign { background-position: 0 -96px; } +.icon-minus-sign { background-position: -24px -96px; } +.icon-remove-sign { background-position: -48px -96px; } +.icon-ok-sign { background-position: -72px -96px; } +.icon-question-sign { background-position: -96px -96px; } +.icon-info-sign { background-position: -120px -96px; } +.icon-screenshot { background-position: -144px -96px; } +.icon-remove-circle { background-position: -168px -96px; } +.icon-ok-circle { background-position: -192px -96px; } +.icon-ban-circle { background-position: -216px -96px; } +.icon-arrow-left { background-position: -240px -96px; } +.icon-arrow-right { background-position: -264px -96px; } +.icon-arrow-up { background-position: -289px -96px; } // 1px off +.icon-arrow-down { background-position: -312px -96px; } +.icon-share-alt { background-position: -336px -96px; } +.icon-resize-full { background-position: -360px -96px; } +.icon-resize-small { background-position: -384px -96px; } +.icon-plus { background-position: -408px -96px; } +.icon-minus { background-position: -433px -96px; } +.icon-asterisk { background-position: -456px -96px; } + +.icon-exclamation-sign { background-position: 0 -120px; } +.icon-gift { background-position: -24px -120px; } +.icon-leaf { background-position: -48px -120px; } +.icon-fire { background-position: -72px -120px; } +.icon-eye-open { background-position: -96px -120px; } +.icon-eye-close { background-position: -120px -120px; } +.icon-warning-sign { background-position: -144px -120px; } +.icon-plane { background-position: -168px -120px; } +.icon-calendar { background-position: -192px -120px; } +.icon-random { background-position: -216px -120px; width: 16px; } +.icon-comment { background-position: -240px -120px; } +.icon-magnet { background-position: -264px -120px; } +.icon-chevron-up { background-position: -288px -120px; } +.icon-chevron-down { background-position: -313px -119px; } // 1px, 1px off +.icon-retweet { background-position: -336px -120px; } +.icon-shopping-cart { background-position: -360px -120px; } +.icon-folder-close { background-position: -384px -120px; } +.icon-folder-open { background-position: -408px -120px; width: 16px; } +.icon-resize-vertical { background-position: -432px -119px; } // 1px, 1px off +.icon-resize-horizontal { background-position: -456px -118px; } // 1px, 2px off + +.icon-hdd { background-position: 0 -144px; } +.icon-bullhorn { background-position: -24px -144px; } +.icon-bell { background-position: -48px -144px; } +.icon-certificate { background-position: -72px -144px; } +.icon-thumbs-up { background-position: -96px -144px; } +.icon-thumbs-down { background-position: -120px -144px; } +.icon-hand-right { background-position: -144px -144px; } +.icon-hand-left { background-position: -168px -144px; } +.icon-hand-up { background-position: -192px -144px; } +.icon-hand-down { background-position: -216px -144px; } +.icon-circle-arrow-right { background-position: -240px -144px; } +.icon-circle-arrow-left { background-position: -264px -144px; } +.icon-circle-arrow-up { background-position: -288px -144px; } +.icon-circle-arrow-down { background-position: -312px -144px; } +.icon-globe { background-position: -336px -144px; } +.icon-wrench { background-position: -360px -144px; } +.icon-tasks { background-position: -384px -144px; } +.icon-filter { background-position: -408px -144px; } +.icon-briefcase { background-position: -432px -144px; } +.icon-fullscreen { background-position: -456px -144px; } diff --git a/examples/container-amd/css/bootstrap/tables.less b/examples/container-amd/css/bootstrap/tables.less new file mode 100644 index 00000000..13c37c6e --- /dev/null +++ b/examples/container-amd/css/bootstrap/tables.less @@ -0,0 +1,245 @@ +// +// Tables +// -------------------------------------------------- + + +// BASE TABLES +// ----------------- + +table { + max-width: 100%; + background-color: @tableBackground; + border-collapse: collapse; + border-spacing: 0; +} + +// BASELINE STYLES +// --------------- + +.table { + width: 100%; + margin-bottom: @baseLineHeight; + // Cells + th, + td { + padding: 8px; + line-height: @baseLineHeight; + text-align: left; + vertical-align: top; + border-top: 1px solid @tableBorder; + } + th { + font-weight: bold; + } + // Bottom align for column headings + thead th { + vertical-align: bottom; + } + // Remove top border from thead by default + caption + thead tr:first-child th, + caption + thead tr:first-child td, + colgroup + thead tr:first-child th, + colgroup + thead tr:first-child td, + thead:first-child tr:first-child th, + thead:first-child tr:first-child td { + border-top: 0; + } + // Account for multiple tbody instances + tbody + tbody { + border-top: 2px solid @tableBorder; + } +} + + + +// CONDENSED TABLE W/ HALF PADDING +// ------------------------------- + +.table-condensed { + th, + td { + padding: 4px 5px; + } +} + + +// BORDERED VERSION +// ---------------- + +.table-bordered { + border: 1px solid @tableBorder; + border-collapse: separate; // Done so we can round those corners! + *border-collapse: collapse; // IE7 can't round corners anyway + border-left: 0; + .border-radius(4px); + th, + td { + border-left: 1px solid @tableBorder; + } + // Prevent a double border + caption + thead tr:first-child th, + caption + tbody tr:first-child th, + caption + tbody tr:first-child td, + colgroup + thead tr:first-child th, + colgroup + tbody tr:first-child th, + colgroup + tbody tr:first-child td, + thead:first-child tr:first-child th, + tbody:first-child tr:first-child th, + tbody:first-child tr:first-child td { + border-top: 0; + } + // For first th or td in the first row in the first thead or tbody + thead:first-child tr:first-child th:first-child, + tbody:first-child tr:first-child td:first-child { + -webkit-border-top-left-radius: 4px; + border-top-left-radius: 4px; + -moz-border-radius-topleft: 4px; + } + thead:first-child tr:first-child th:last-child, + tbody:first-child tr:first-child td:last-child { + -webkit-border-top-right-radius: 4px; + border-top-right-radius: 4px; + -moz-border-radius-topright: 4px; + } + // For first th or td in the first row in the first thead or tbody + thead:last-child tr:last-child th:first-child, + tbody:last-child tr:last-child td:first-child, + tfoot:last-child tr:last-child td:first-child { + .border-radius(0 0 0 4px); + -webkit-border-bottom-left-radius: 4px; + border-bottom-left-radius: 4px; + -moz-border-radius-bottomleft: 4px; + } + thead:last-child tr:last-child th:last-child, + tbody:last-child tr:last-child td:last-child, + tfoot:last-child tr:last-child td:last-child { + -webkit-border-bottom-right-radius: 4px; + border-bottom-right-radius: 4px; + -moz-border-radius-bottomright: 4px; + } + + // Special fixes to round the left border on the first td/th + caption + thead tr:first-child th:first-child, + caption + tbody tr:first-child td:first-child, + colgroup + thead tr:first-child th:first-child, + colgroup + tbody tr:first-child td:first-child { + -webkit-border-top-left-radius: 4px; + border-top-left-radius: 4px; + -moz-border-radius-topleft: 4px; + } + caption + thead tr:first-child th:last-child, + caption + tbody tr:first-child td:last-child, + colgroup + thead tr:first-child th:last-child, + colgroup + tbody tr:first-child td:last-child { + -webkit-border-top-right-radius: 4px; + border-top-right-radius: 4px; + -moz-border-radius-topleft: 4px; + } + +} + + + + +// ZEBRA-STRIPING +// -------------- + +// Default zebra-stripe styles (alternating gray and transparent backgrounds) +.table-striped { + tbody { + tr:nth-child(odd) td, + tr:nth-child(odd) th { + background-color: @tableBackgroundAccent; + } + } +} + + +// HOVER EFFECT +// ------------ +// Placed here since it has to come after the potential zebra striping +.table-hover { + tbody { + tr:hover td, + tr:hover th { + background-color: @tableBackgroundHover; + } + } +} + + +// TABLE CELL SIZING +// ----------------- + +// Reset default grid behavior +table [class*=span], +.row-fluid table [class*=span] { + display: table-cell; + float: none; // undo default grid column styles + margin-left: 0; // undo default grid column styles +} + +// Change the column widths to account for td/th padding +.table { + .span1 { .tableColumns(1); } + .span2 { .tableColumns(2); } + .span3 { .tableColumns(3); } + .span4 { .tableColumns(4); } + .span5 { .tableColumns(5); } + .span6 { .tableColumns(6); } + .span7 { .tableColumns(7); } + .span8 { .tableColumns(8); } + .span9 { .tableColumns(9); } + .span10 { .tableColumns(10); } + .span11 { .tableColumns(11); } + .span12 { .tableColumns(12); } + .span13 { .tableColumns(13); } + .span14 { .tableColumns(14); } + .span15 { .tableColumns(15); } + .span16 { .tableColumns(16); } + .span17 { .tableColumns(17); } + .span18 { .tableColumns(18); } + .span19 { .tableColumns(19); } + .span20 { .tableColumns(20); } + .span21 { .tableColumns(21); } + .span22 { .tableColumns(22); } + .span23 { .tableColumns(23); } + .span24 { .tableColumns(24); } +} + + + +// TABLE BACKGROUNDS +// ----------------- +// Exact selectors below required to override .table-striped + +.table tbody tr { + &.success td { + background-color: @successBackground; + } + &.error td { + background-color: @errorBackground; + } + &.warning td { + background-color: @warningBackground; + } + &.info td { + background-color: @infoBackground; + } +} + +// Hover states for .table-hover +.table-hover tbody tr { + &.success:hover td { + background-color: darken(@successBackground, 5%); + } + &.error:hover td { + background-color: darken(@errorBackground, 5%); + } + &.warning:hover td { + background-color: darken(@warningBackground, 5%); + } + &.info:hover td { + background-color: darken(@infoBackground, 5%); + } +} diff --git a/examples/container-amd/css/bootstrap/thumbnails.less b/examples/container-amd/css/bootstrap/thumbnails.less new file mode 100644 index 00000000..91b75f78 --- /dev/null +++ b/examples/container-amd/css/bootstrap/thumbnails.less @@ -0,0 +1,52 @@ +// +// Thumbnails +// -------------------------------------------------- + + +// Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files + +// Make wrapper ul behave like the grid +.thumbnails { + margin-left: -@gridGutterWidth; + list-style: none; + .clearfix(); +} +// Fluid rows have no left margin +.row-fluid .thumbnails { + margin-left: 0; +} + +// Float li to make thumbnails appear in a row +.thumbnails > li { + float: left; // Explicity set the float since we don't require .span* classes + margin-bottom: @baseLineHeight; + margin-left: @gridGutterWidth; +} + +// The actual thumbnail (can be `a` or `div`) +.thumbnail { + display: block; + padding: 4px; + line-height: @baseLineHeight; + border: 1px solid #ddd; + .border-radius(4px); + .box-shadow(0 1px 3px rgba(0,0,0,.055)); + .transition(all .2s ease-in-out); +} +// Add a hover state for linked versions only +a.thumbnail:hover { + border-color: @linkColor; + .box-shadow(0 1px 4px rgba(0,105,214,.25)); +} + +// Images and captions +.thumbnail > img { + display: block; + max-width: 100%; + margin-left: auto; + margin-right: auto; +} +.thumbnail .caption { + padding: 9px; + color: @gray; +} diff --git a/examples/container-amd/css/bootstrap/tooltip.less b/examples/container-amd/css/bootstrap/tooltip.less new file mode 100644 index 00000000..fba1856f --- /dev/null +++ b/examples/container-amd/css/bootstrap/tooltip.less @@ -0,0 +1,70 @@ +// +// Tooltips +// -------------------------------------------------- + + +// Base class +.tooltip { + position: absolute; + z-index: @zindexTooltip; + display: block; + visibility: visible; + padding: 5px; + font-size: 11px; + .opacity(0); + &.in { .opacity(80); } + &.top { margin-top: -3px; } + &.right { margin-left: 3px; } + &.bottom { margin-top: 3px; } + &.left { margin-left: -3px; } +} + +// Wrapper for the tooltip content +.tooltip-inner { + max-width: 200px; + padding: 3px 8px; + color: @tooltipColor; + text-align: center; + text-decoration: none; + background-color: @tooltipBackground; + .border-radius(4px); +} + +// Arrows +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.tooltip { + &.top .tooltip-arrow { + bottom: 0; + left: 50%; + margin-left: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth @tooltipArrowWidth 0; + border-top-color: @tooltipArrowColor; + } + &.right .tooltip-arrow { + top: 50%; + left: 0; + margin-top: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth @tooltipArrowWidth @tooltipArrowWidth 0; + border-right-color: @tooltipArrowColor; + } + &.left .tooltip-arrow { + top: 50%; + right: 0; + margin-top: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth 0 @tooltipArrowWidth @tooltipArrowWidth; + border-left-color: @tooltipArrowColor; + } + &.bottom .tooltip-arrow { + top: 0; + left: 50%; + margin-left: -@tooltipArrowWidth; + border-width: 0 @tooltipArrowWidth @tooltipArrowWidth; + border-bottom-color: @tooltipArrowColor; + } +} diff --git a/examples/container-amd/css/bootstrap/type.less b/examples/container-amd/css/bootstrap/type.less new file mode 100644 index 00000000..2e0f386e --- /dev/null +++ b/examples/container-amd/css/bootstrap/type.less @@ -0,0 +1,221 @@ +// +// Typography +// -------------------------------------------------- + + +// Body text +// ------------------------- + +p { + margin: 0 0 @baseLineHeight / 2; +} +.lead { + margin-bottom: @baseLineHeight; + font-size: @baseFontSize * 1.5; + font-weight: 200; + line-height: @baseLineHeight * 1.5; +} + + +// Emphasis & misc +// ------------------------- + +small { + font-size: 85%; // Ex: 14px base font * 85% = about 12px +} +strong { + font-weight: bold; +} +em { + font-style: italic; +} +cite { + font-style: normal; +} + +// Utility classes +.muted { + color: @grayLight; +} +.text-warning { + color: @warningText; +} +.text-error { + color: @errorText; +} +.text-info { + color: @infoText; +} +.text-success { + color: @successText; +} + + +// Headings +// ------------------------- + +h1, h2, h3, h4, h5, h6 { + margin: (@baseLineHeight / 2) 0; + font-family: @headingsFontFamily; + font-weight: @headingsFontWeight; + line-height: 1; + color: @headingsColor; + text-rendering: optimizelegibility; // Fix the character spacing for headings + small { + font-weight: normal; + line-height: 1; + color: @grayLight; + } +} +h1 { font-size: 36px; line-height: 40px; } +h2 { font-size: 30px; line-height: 40px; } +h3 { font-size: 24px; line-height: 40px; } +h4 { font-size: 18px; line-height: 20px; } +h5 { font-size: 14px; line-height: 20px; } +h6 { font-size: 12px; line-height: 20px; } + +h1 small { font-size: 24px; } +h2 small { font-size: 18px; } +h3 small { font-size: 14px; } +h4 small { font-size: 14px; } + + +// Page header +// ------------------------- + +.page-header { + padding-bottom: (@baseLineHeight / 2) - 1; + margin: @baseLineHeight 0 (@baseLineHeight * 1.5); + border-bottom: 1px solid @grayLighter; +} + + + +// Lists +// -------------------------------------------------- + +// Unordered and Ordered lists +ul, ol { + padding: 0; + margin: 0 0 @baseLineHeight / 2 25px; +} +ul ul, +ul ol, +ol ol, +ol ul { + margin-bottom: 0; +} +li { + line-height: @baseLineHeight; +} +ul.unstyled, +ol.unstyled { + margin-left: 0; + list-style: none; +} + +// Description Lists +dl { + margin-bottom: @baseLineHeight; +} +dt, +dd { + line-height: @baseLineHeight; +} +dt { + font-weight: bold; +} +dd { + margin-left: @baseLineHeight / 2; +} +// Horizontal layout (like forms) +.dl-horizontal { + .clearfix(); // Ensure dl clears floats if empty dd elements present + dt { + float: left; + width: @horizontalComponentOffset - 20; + clear: left; + text-align: right; + .text-overflow(); + } + dd { + margin-left: @horizontalComponentOffset; + } +} + +// MISC +// ---- + +// Horizontal rules +hr { + margin: @baseLineHeight 0; + border: 0; + border-top: 1px solid @hrBorder; + border-bottom: 1px solid @white; +} + +// Abbreviations and acronyms +abbr[title] { + cursor: help; + border-bottom: 1px dotted @grayLight; +} +abbr.initialism { + font-size: 90%; + text-transform: uppercase; +} + +// Blockquotes +blockquote { + padding: 0 0 0 15px; + margin: 0 0 @baseLineHeight; + border-left: 5px solid @grayLighter; + p { + margin-bottom: 0; + #font > .shorthand(16px,300,@baseLineHeight * 1.25); + } + small { + display: block; + line-height: @baseLineHeight; + color: @grayLight; + &:before { + content: '\2014 \00A0'; + } + } + + // Float right with text-align: right + &.pull-right { + float: right; + padding-right: 15px; + padding-left: 0; + border-right: 5px solid @grayLighter; + border-left: 0; + p, + small { + text-align: right; + } + small { + &:before { + content: ''; + } + &:after { + content: '\00A0 \2014'; + } + } + } +} + +// Quotes +q:before, +q:after, +blockquote:before, +blockquote:after { + content: ""; +} + +// Addresses +address { + display: block; + margin-bottom: @baseLineHeight; + font-style: normal; + line-height: @baseLineHeight; +} diff --git a/examples/container-amd/css/bootstrap/utilities.less b/examples/container-amd/css/bootstrap/utilities.less new file mode 100644 index 00000000..314b4ffd --- /dev/null +++ b/examples/container-amd/css/bootstrap/utilities.less @@ -0,0 +1,30 @@ +// +// Utility classes +// -------------------------------------------------- + + +// Quick floats +.pull-right { + float: right; +} +.pull-left { + float: left; +} + +// Toggling content +.hide { + display: none; +} +.show { + display: block; +} + +// Visibility +.invisible { + visibility: hidden; +} + +// For Affix plugin +.affix { + position: fixed; +} diff --git a/examples/container-amd/css/bootstrap/variables.less b/examples/container-amd/css/bootstrap/variables.less new file mode 100644 index 00000000..7d6efe00 --- /dev/null +++ b/examples/container-amd/css/bootstrap/variables.less @@ -0,0 +1,279 @@ +// +// Variables +// -------------------------------------------------- + + +// Global values +// -------------------------------------------------- + + +// Grays +// ------------------------- +@black: #000; +@grayDarker: #222; +@grayDark: #333; +@gray: #555; +@grayLight: #999; +@grayLighter: #eee; +@white: #fff; + + +// Accent colors +// ------------------------- +@blue: #049cdb; +@blueDark: #0064cd; +@green: #46a546; +@red: #9d261d; +@yellow: #ffc40d; +@orange: #f89406; +@pink: #c3325f; +@purple: #7a43b6; + + +// Scaffolding +// ------------------------- +@bodyBackground: @white; +@textColor: @grayDark; + + +// Links +// ------------------------- +@linkColor: #08c; +@linkColorHover: darken(@linkColor, 15%); + + +// Typography +// ------------------------- +@sansFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; +@serifFontFamily: Georgia, "Times New Roman", Times, serif; +@monoFontFamily: Monaco, Menlo, Consolas, "Courier New", monospace; + +@baseFontSize: 14px; +@baseFontFamily: @sansFontFamily; +@baseLineHeight: 20px; +@altFontFamily: @serifFontFamily; + +@headingsFontFamily: inherit; // empty to use BS default, @baseFontFamily +@headingsFontWeight: bold; // instead of browser default, bold +@headingsColor: inherit; // empty to use BS default, @textColor + +// Tables +// ------------------------- +@tableBackground: transparent; // overall background-color +@tableBackgroundAccent: #f9f9f9; // for striping +@tableBackgroundHover: #f5f5f5; // for hover +@tableBorder: #ddd; // table and cell border + +// Buttons +// ------------------------- +@btnBackground: @white; +@btnBackgroundHighlight: darken(@white, 10%); +@btnBorder: #bbb; + +@btnPrimaryBackground: @linkColor; +@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 20%); + +@btnInfoBackground: #5bc0de; +@btnInfoBackgroundHighlight: #2f96b4; + +@btnSuccessBackground: #62c462; +@btnSuccessBackgroundHighlight: #51a351; + +@btnWarningBackground: lighten(@orange, 15%); +@btnWarningBackgroundHighlight: @orange; + +@btnDangerBackground: #ee5f5b; +@btnDangerBackgroundHighlight: #bd362f; + +@btnInverseBackground: #444; +@btnInverseBackgroundHighlight: @grayDarker; + + +// Forms +// ------------------------- +@inputBackground: @white; +@inputBorder: #ccc; +@inputBorderRadius: 3px; +@inputDisabledBackground: @grayLighter; +@formActionsBackground: #f5f5f5; + +// Dropdowns +// ------------------------- +@dropdownBackground: @white; +@dropdownBorder: rgba(0,0,0,.2); +@dropdownDividerTop: #e5e5e5; +@dropdownDividerBottom: @white; + +@dropdownLinkColor: @grayDark; +@dropdownLinkColorHover: @white; +@dropdownLinkColorActive: @dropdownLinkColor; + +@dropdownLinkBackgroundActive: @linkColor; +@dropdownLinkBackgroundHover: @dropdownLinkBackgroundActive; + + + +// COMPONENT VARIABLES +// -------------------------------------------------- + +// Z-index master list +// ------------------------- +// Used for a bird's eye view of components dependent on the z-axis +// Try to avoid customizing these :) +@zindexDropdown: 1000; +@zindexPopover: 1010; +@zindexTooltip: 1030; +@zindexFixedNavbar: 1030; +@zindexModalBackdrop: 1040; +@zindexModal: 1050; + + +// Sprite icons path +// ------------------------- +@iconSpritePath: "../img/glyphicons-halflings.png"; +@iconWhiteSpritePath: "../img/glyphicons-halflings-white.png"; + + +// Input placeholder text color +// ------------------------- +@placeholderText: @grayLight; + + +// Hr border color +// ------------------------- +@hrBorder: @grayLighter; + + +// Horizontal forms & lists +// ------------------------- +@horizontalComponentOffset: 180px; + + +// Wells +// ------------------------- +@wellBackground: #f5f5f5; + + +// Navbar +// ------------------------- +@navbarCollapseWidth: 979px; + +@navbarHeight: 40px; +@navbarBackgroundHighlight: #ffffff; +@navbarBackground: darken(@navbarBackgroundHighlight, 5%); +@navbarBorder: darken(@navbarBackground, 12%); + +@navbarText: #777; +@navbarLinkColor: #777; +@navbarLinkColorHover: @grayDark; +@navbarLinkColorActive: @gray; +@navbarLinkBackgroundHover: transparent; +@navbarLinkBackgroundActive: darken(@navbarBackground, 5%); + +@navbarBrandColor: @navbarLinkColor; + +// Inverted navbar +@navbarInverseBackground: #111111; +@navbarInverseBackgroundHighlight: #222222; +@navbarInverseBorder: #252525; + +@navbarInverseText: @grayLight; +@navbarInverseLinkColor: @grayLight; +@navbarInverseLinkColorHover: @white; +@navbarInverseLinkColorActive: @navbarInverseLinkColorHover; +@navbarInverseLinkBackgroundHover: transparent; +@navbarInverseLinkBackgroundActive: @navbarInverseBackground; + +@navbarInverseSearchBackground: lighten(@navbarInverseBackground, 25%); +@navbarInverseSearchBackgroundFocus: @white; +@navbarInverseSearchBorder: @navbarInverseBackground; +@navbarInverseSearchPlaceholderColor: #ccc; + +@navbarInverseBrandColor: @navbarInverseLinkColor; + + +// Pagination +// ------------------------- +@paginationBackground: #fff; +@paginationBorder: #ddd; +@paginationActiveBackground: #f5f5f5; + + +// Hero unit +// ------------------------- +@heroUnitBackground: @grayLighter; +@heroUnitHeadingColor: inherit; +@heroUnitLeadColor: inherit; + + +// Form states and alerts +// ------------------------- +@warningText: #c09853; +@warningBackground: #fcf8e3; +@warningBorder: darken(spin(@warningBackground, -10), 3%); + +@errorText: #b94a48; +@errorBackground: #f2dede; +@errorBorder: darken(spin(@errorBackground, -10), 3%); + +@successText: #468847; +@successBackground: #dff0d8; +@successBorder: darken(spin(@successBackground, -10), 5%); + +@infoText: #3a87ad; +@infoBackground: #d9edf7; +@infoBorder: darken(spin(@infoBackground, -10), 7%); + + +// Tooltips and popovers +// ------------------------- +@tooltipColor: #fff; +@tooltipBackground: #000; +@tooltipArrowWidth: 5px; +@tooltipArrowColor: @tooltipBackground; + +@popoverBackground: #fff; +@popoverArrowWidth: 10px; +@popoverArrowColor: #fff; +@popoverTitleBackground: darken(@popoverBackground, 3%); + +// Special enhancement for popovers +@popoverArrowOuterWidth: @popoverArrowWidth + 1; +@popoverArrowOuterColor: rgba(0,0,0,.25); + + + +// GRID +// -------------------------------------------------- + + +// Default 940px grid +// ------------------------- +@gridColumns: 12; +@gridColumnWidth: 60px; +@gridGutterWidth: 20px; +@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); + +// 1200px min +@gridColumnWidth1200: 70px; +@gridGutterWidth1200: 30px; +@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); + +// 768px-979px +@gridColumnWidth768: 42px; +@gridGutterWidth768: 20px; +@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); + + +// Fluid grid +// ------------------------- +@fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth); +@fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth); + +// 1200px min +@fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200); +@fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200); + +// 768px-979px +@fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768); +@fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768); diff --git a/examples/container-amd/css/bootstrap/wells.less b/examples/container-amd/css/bootstrap/wells.less new file mode 100644 index 00000000..e4e0a9be --- /dev/null +++ b/examples/container-amd/css/bootstrap/wells.less @@ -0,0 +1,29 @@ +// +// Wells +// -------------------------------------------------- + + +// Base class +.well { + min-height: 20px; + padding: 19px; + margin-bottom: 20px; + background-color: @wellBackground; + border: 1px solid darken(@wellBackground, 7%); + .border-radius(4px); + .box-shadow(inset 0 1px 1px rgba(0,0,0,.05)); + blockquote { + border-color: #ddd; + border-color: rgba(0,0,0,.15); + } +} + +// Sizes +.well-large { + padding: 24px; + .border-radius(6px); +} +.well-small { + padding: 9px; + .border-radius(3px); +} diff --git a/examples/container-amd/css/container.css b/examples/container-amd/css/container.css index 4f535c96..d109f3fa 100644 --- a/examples/container-amd/css/container.css +++ b/examples/container-amd/css/container.css @@ -1,3 +1,17 @@ +html { + font-size:100%; + -webkit-text-size-adjust:100%; + -ms-text-size-adjust:100%; +} +body { + margin:0; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + font-size:14px; + line-height:20px; + color:#333333; + background-color:#ffffff; +} + body.example-page { padding-top:60px; font-size: 13px; diff --git a/examples/container-amd/css/namespaced-css.less b/examples/container-amd/css/namespaced-css.less new file mode 100644 index 00000000..06d56773 --- /dev/null +++ b/examples/container-amd/css/namespaced-css.less @@ -0,0 +1,4 @@ +.f2-example-container { + @import "bootstrap/bootstrap.less"; + @import "bootstrap/responsive.less"; +} \ No newline at end of file diff --git a/examples/container-amd/index.html b/examples/container-amd/index.html index 229bf108..118bf322 100644 --- a/examples/container-amd/index.html +++ b/examples/container-amd/index.html @@ -3,13 +3,14 @@ F2 - Container Example + - +
  • element within the topbar or ul.tabs and you'll get some superfancy dropdowns +.dropup, +.dropdown { + position: relative; +} +.dropdown-toggle { + // The caret makes the toggle a bit too tall in IE7 + *margin-bottom: -3px; +} +.dropdown-toggle:active, +.open .dropdown-toggle { + outline: 0; +} + +// Dropdown arrow/caret +// -------------------- +.caret { + display: inline-block; + width: 0; + height: 0; + vertical-align: top; + border-top: 4px solid @black; + border-right: 4px solid transparent; + border-left: 4px solid transparent; + content: ""; +} + +// Place the caret +.dropdown .caret { + margin-top: 8px; + margin-left: 2px; +} + +// The dropdown menu (ul) +// ---------------------- +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: @zindexDropdown; + display: none; // none by default, but block on "open" of the menu + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; // override default ul + list-style: none; + background-color: @dropdownBackground; + border: 1px solid #ccc; // Fallback for IE7-8 + border: 1px solid @dropdownBorder; + *border-right-width: 2px; + *border-bottom-width: 2px; + .border-radius(6px); + .box-shadow(0 5px 10px rgba(0,0,0,.2)); + -webkit-background-clip: padding-box; + -moz-background-clip: padding; + background-clip: padding-box; + + // Aligns the dropdown menu to right + &.pull-right { + right: 0; + left: auto; + } + + // Dividers (basically an hr) within the dropdown + .divider { + .nav-divider(@dropdownDividerTop, @dropdownDividerBottom); + } + + // Links within the dropdown menu + a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: normal; + line-height: @baseLineHeight; + color: @dropdownLinkColor; + white-space: nowrap; + } +} + +// Hover state +// ----------- +.dropdown-menu li > a:hover, +.dropdown-menu li > a:focus, +.dropdown-submenu:hover > a { + text-decoration: none; + color: @dropdownLinkColorHover; + background-color: @dropdownLinkBackgroundHover; + #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%)); +} + +// Active state +// ------------ +.dropdown-menu .active > a, +.dropdown-menu .active > a:hover { + color: @dropdownLinkColorHover; + text-decoration: none; + outline: 0; + background-color: @dropdownLinkBackgroundActive; + #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%)); +} + +// Disabled state +// -------------- +// Gray out text and ensure the hover state remains gray +.dropdown-menu .disabled > a, +.dropdown-menu .disabled > a:hover { + color: @grayLight; +} +// Nuke hover effects +.dropdown-menu .disabled > a:hover { + text-decoration: none; + background-color: transparent; + cursor: default; +} + +// Open state for the dropdown +// --------------------------- +.open { + // IE7's z-index only goes to the nearest positioned ancestor, which would + // make the menu appear below buttons that appeared later on the page + *z-index: @zindexDropdown; + + & > .dropdown-menu { + display: block; + } +} + +// Right aligned dropdowns +// --------------------------- +.pull-right > .dropdown-menu { + right: 0; + left: auto; +} + +// Allow for dropdowns to go bottom up (aka, dropup-menu) +// ------------------------------------------------------ +// Just add .dropup after the standard .dropdown class and you're set, bro. +// TODO: abstract this so that the navbar fixed styles are not placed here? +.dropup, +.navbar-fixed-bottom .dropdown { + // Reverse the caret + .caret { + border-top: 0; + border-bottom: 4px solid @black; + content: ""; + } + // Different positioning for bottom up menu + .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 1px; + } +} + +// Sub menus +// --------------------------- +.dropdown-submenu { + position: relative; +} +.dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -6px; + margin-left: -1px; + -webkit-border-radius: 0 6px 6px 6px; + -moz-border-radius: 0 6px 6px 6px; + border-radius: 0 6px 6px 6px; +} +.dropdown-submenu:hover > .dropdown-menu { + display: block; +} + +.dropdown-submenu > a:after { + display: block; + content: " "; + float: right; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; + border-width: 5px 0 5px 5px; + border-left-color: darken(@dropdownBackground, 20%); + margin-top: 5px; + margin-right: -10px; +} +.dropdown-submenu:hover > a:after { + border-left-color: @dropdownLinkColorHover; +} + + +// Tweak nav headers +// ----------------- +// Increase padding from 15px to 20px on sides +.dropdown .dropdown-menu .nav-header { + padding-left: 20px; + padding-right: 20px; +} + +// Typeahead +// --------- +.typeahead { + margin-top: 2px; // give it some space to breathe + .border-radius(4px); +} diff --git a/examples/container/css/bootstrap/forms.less b/examples/container/css/bootstrap/forms.less new file mode 100644 index 00000000..f8d8562b --- /dev/null +++ b/examples/container/css/bootstrap/forms.less @@ -0,0 +1,650 @@ +// +// Forms +// -------------------------------------------------- + + +// GENERAL STYLES +// -------------- + +// Make all forms have space below them +form { + margin: 0 0 @baseLineHeight; +} + +fieldset { + padding: 0; + margin: 0; + border: 0; +} + +// Groups of fields with labels on top (legends) +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: @baseLineHeight; + font-size: @baseFontSize * 1.5; + line-height: @baseLineHeight * 2; + color: @grayDark; + border: 0; + border-bottom: 1px solid #e5e5e5; + + // Small + small { + font-size: @baseLineHeight * .75; + color: @grayLight; + } +} + +// Set font for forms +label, +input, +button, +select, +textarea { + #font > .shorthand(@baseFontSize,normal,@baseLineHeight); // Set size, weight, line-height here +} +input, +button, +select, +textarea { + font-family: @baseFontFamily; // And only set font-family here for those that need it (note the missing label element) +} + +// Identify controls by their labels +label { + display: block; + margin-bottom: 5px; +} + +// Form controls +// ------------------------- + +// Shared size and type resets +select, +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { + display: inline-block; + height: @baseLineHeight; + padding: 4px 6px; + margin-bottom: 9px; + font-size: @baseFontSize; + line-height: @baseLineHeight; + color: @gray; + .border-radius(@inputBorderRadius); +} + +// Reset appearance properties for textual inputs and textarea +// Declare width for legacy (can't be on input[type=*] selectors or it's too specific) +input, +textarea, +.uneditable-input { + width: 206px; // plus 12px padding and 2px border +} +// Reset height since textareas have rows +textarea { + height: auto; +} +// Everything else +textarea, +input[type="text"], +input[type="password"], +input[type="datetime"], +input[type="datetime-local"], +input[type="date"], +input[type="month"], +input[type="time"], +input[type="week"], +input[type="number"], +input[type="email"], +input[type="url"], +input[type="search"], +input[type="tel"], +input[type="color"], +.uneditable-input { + background-color: @inputBackground; + border: 1px solid @inputBorder; + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); + .transition(~"border linear .2s, box-shadow linear .2s"); + + // Focus state + &:focus { + border-color: rgba(82,168,236,.8); + outline: 0; + outline: thin dotted \9; /* IE6-9 */ + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)); + } +} + +// Position radios and checkboxes better +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + *margin-top: 0; /* IE7 */ + margin-top: 1px \9; /* IE8-9 */ + line-height: normal; + cursor: pointer; +} + +// Reset width of input images, buttons, radios, checkboxes +input[type="file"], +input[type="image"], +input[type="submit"], +input[type="reset"], +input[type="button"], +input[type="radio"], +input[type="checkbox"] { + width: auto; // Override of generic input selector +} + +// Set the height of select and file controls to match text inputs +select, +input[type="file"] { + height: 30px; /* In IE7, the height of the select element cannot be changed by height, only font-size */ + *margin-top: 4px; /* For IE7, add top margin to align select with labels */ + line-height: 30px; +} + +// Make select elements obey height by applying a border +select { + width: 220px; // default input width + 10px of padding that doesn't get applied + border: 1px solid @inputBorder; + background-color: @inputBackground; // Chrome on Linux and Mobile Safari need background-color +} + +// Make multiple select elements height not fixed +select[multiple], +select[size] { + height: auto; +} + +// Focus for select, file, radio, and checkbox +select:focus, +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + .tab-focus(); +} + + +// Uneditable inputs +// ------------------------- + +// Make uneditable inputs look inactive +.uneditable-input, +.uneditable-textarea { + color: @grayLight; + background-color: darken(@inputBackground, 1%); + border-color: @inputBorder; + .box-shadow(inset 0 1px 2px rgba(0,0,0,.025)); + cursor: not-allowed; +} + +// For text that needs to appear as an input but should not be an input +.uneditable-input { + overflow: hidden; // prevent text from wrapping, but still cut it off like an input does + white-space: nowrap; +} + +// Make uneditable textareas behave like a textarea +.uneditable-textarea { + width: auto; + height: auto; +} + + +// Placeholder +// ------------------------- + +// Placeholder text gets special styles because when browsers invalidate entire lines if it doesn’t understand a selector +input, +textarea { + .placeholder(); +} + + +// CHECKBOXES & RADIOS +// ------------------- + +// Indent the labels to position radios/checkboxes as hanging +.radio, +.checkbox { + min-height: 18px; // clear the floating input if there is no label text + padding-left: 18px; +} +.radio input[type="radio"], +.checkbox input[type="checkbox"] { + float: left; + margin-left: -18px; +} + +// Move the options list down to align with labels +.controls > .radio:first-child, +.controls > .checkbox:first-child { + padding-top: 5px; // has to be padding because margin collaspes +} + +// Radios and checkboxes on same line +// TODO v3: Convert .inline to .control-inline +.radio.inline, +.checkbox.inline { + display: inline-block; + padding-top: 5px; + margin-bottom: 0; + vertical-align: middle; +} +.radio.inline + .radio.inline, +.checkbox.inline + .checkbox.inline { + margin-left: 10px; // space out consecutive inline controls +} + + + +// INPUT SIZES +// ----------- + +// General classes for quick sizes +.input-mini { width: 60px; } +.input-small { width: 90px; } +.input-medium { width: 150px; } +.input-large { width: 210px; } +.input-xlarge { width: 270px; } +.input-xxlarge { width: 530px; } + +// Grid style input sizes +input[class*="span"], +select[class*="span"], +textarea[class*="span"], +.uneditable-input[class*="span"], +// Redeclare since the fluid row class is more specific +.row-fluid input[class*="span"], +.row-fluid select[class*="span"], +.row-fluid textarea[class*="span"], +.row-fluid .uneditable-input[class*="span"] { + float: none; + margin-left: 0; +} +// Ensure input-prepend/append never wraps +.input-append input[class*="span"], +.input-append .uneditable-input[class*="span"], +.input-prepend input[class*="span"], +.input-prepend .uneditable-input[class*="span"], +.row-fluid input[class*="span"], +.row-fluid select[class*="span"], +.row-fluid textarea[class*="span"], +.row-fluid .uneditable-input[class*="span"], +.row-fluid .input-prepend [class*="span"], +.row-fluid .input-append [class*="span"] { + display: inline-block; +} + + + +// GRID SIZING FOR INPUTS +// ---------------------- + +// Grid sizes +#grid > .input(@gridColumnWidth, @gridGutterWidth); + +// Control row for multiple inputs per line +.controls-row { + .clearfix(); // Clear the float from controls +} +.controls-row [class*="span"] { + float: left; // Float to collapse white-space for proper grid alignment +} + + + + +// DISABLED STATE +// -------------- + +// Disabled and read-only inputs +input[disabled], +select[disabled], +textarea[disabled], +input[readonly], +select[readonly], +textarea[readonly] { + cursor: not-allowed; + background-color: @inputDisabledBackground; +} +// Explicitly reset the colors here +input[type="radio"][disabled], +input[type="checkbox"][disabled], +input[type="radio"][readonly], +input[type="checkbox"][readonly] { + background-color: transparent; +} + + + + +// FORM FIELD FEEDBACK STATES +// -------------------------- + +// Warning +.control-group.warning { + .formFieldState(@warningText, @warningText, @warningBackground); +} +// Error +.control-group.error { + .formFieldState(@errorText, @errorText, @errorBackground); +} +// Success +.control-group.success { + .formFieldState(@successText, @successText, @successBackground); +} +// Success +.control-group.info { + .formFieldState(@infoText, @infoText, @infoBackground); +} + +// HTML5 invalid states +// Shares styles with the .control-group.error above +input:focus:required:invalid, +textarea:focus:required:invalid, +select:focus:required:invalid { + color: #b94a48; + border-color: #ee5f5b; + &:focus { + border-color: darken(#ee5f5b, 10%); + .box-shadow(0 0 6px lighten(#ee5f5b, 20%)); + } +} + + + +// FORM ACTIONS +// ------------ + +.form-actions { + padding: (@baseLineHeight - 1) 20px @baseLineHeight; + margin-top: @baseLineHeight; + margin-bottom: @baseLineHeight; + background-color: @formActionsBackground; + border-top: 1px solid #e5e5e5; + .clearfix(); // Adding clearfix to allow for .pull-right button containers +} + + + +// HELP TEXT +// --------- + +.help-block, +.help-inline { + color: lighten(@textColor, 15%); // lighten the text some for contrast +} + +.help-block { + display: block; // account for any element using help-block + margin-bottom: @baseLineHeight / 2; +} + +.help-inline { + display: inline-block; + .ie7-inline-block(); + vertical-align: middle; + padding-left: 5px; +} + + + +// INPUT GROUPS +// ------------ + +// Allow us to put symbols and text within the input field for a cleaner look +.input-append, +.input-prepend { + margin-bottom: 5px; + font-size: 0; + white-space: nowrap; // Prevent span and input from separating + + input, + select, + .uneditable-input { + position: relative; // placed here by default so that on :focus we can place the input above the .add-on for full border and box-shadow goodness + margin-bottom: 0; // prevent bottom margin from screwing up alignment in stacked forms + *margin-left: 0; + font-size: @baseFontSize; + vertical-align: top; + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + // Make input on top when focused so blue border and shadow always show + &:focus { + z-index: 2; + } + } + .add-on { + display: inline-block; + width: auto; + height: @baseLineHeight; + min-width: 16px; + padding: 4px 5px; + font-size: @baseFontSize; + font-weight: normal; + line-height: @baseLineHeight; + text-align: center; + text-shadow: 0 1px 0 @white; + background-color: @grayLighter; + border: 1px solid #ccc; + } + .add-on, + .btn { + vertical-align: top; + .border-radius(0); + } + .active { + background-color: lighten(@green, 30); + border-color: @green; + } +} +.input-prepend { + .add-on, + .btn { + margin-right: -1px; + } + .add-on:first-child, + .btn:first-child { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } +} +.input-append { + input, + select, + .uneditable-input { + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } + .add-on, + .btn { + margin-left: -1px; + } + .add-on:last-child, + .btn:last-child { + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} +// Remove all border-radius for inputs with both prepend and append +.input-prepend.input-append { + input, + select, + .uneditable-input { + .border-radius(0); + } + .add-on:first-child, + .btn:first-child { + margin-right: -1px; + .border-radius(@inputBorderRadius 0 0 @inputBorderRadius); + } + .add-on:last-child, + .btn:last-child { + margin-left: -1px; + .border-radius(0 @inputBorderRadius @inputBorderRadius 0); + } +} + + + +// SEARCH FORM +// ----------- + +input.search-query { + padding-right: 14px; + padding-right: 4px \9; + padding-left: 14px; + padding-left: 4px \9; /* IE7-8 doesn't have border-radius, so don't indent the padding */ + margin-bottom: 0; // Remove the default margin on all inputs + .border-radius(15px); +} + +/* Allow for input prepend/append in search forms */ +.form-search .input-append .search-query, +.form-search .input-prepend .search-query { + .border-radius(0); // Override due to specificity +} +.form-search .input-append .search-query { + .border-radius(14px 0 0 14px); +} +.form-search .input-append .btn { + .border-radius(0 14px 14px 0); +} +.form-search .input-prepend .search-query { + .border-radius(0 14px 14px 0); +} +.form-search .input-prepend .btn { + .border-radius(14px 0 0 14px); +} + + + + +// HORIZONTAL & VERTICAL FORMS +// --------------------------- + +// Common properties +// ----------------- + +.form-search, +.form-inline, +.form-horizontal { + input, + textarea, + select, + .help-inline, + .uneditable-input, + .input-prepend, + .input-append { + display: inline-block; + .ie7-inline-block(); + margin-bottom: 0; + vertical-align: middle; + } + // Re-hide hidden elements due to specifity + .hide { + display: none; + } +} +.form-search label, +.form-inline label, +.form-search .btn-group, +.form-inline .btn-group { + display: inline-block; +} +// Remove margin for input-prepend/-append +.form-search .input-append, +.form-inline .input-append, +.form-search .input-prepend, +.form-inline .input-prepend { + margin-bottom: 0; +} +// Inline checkbox/radio labels (remove padding on left) +.form-search .radio, +.form-search .checkbox, +.form-inline .radio, +.form-inline .checkbox { + padding-left: 0; + margin-bottom: 0; + vertical-align: middle; +} +// Remove float and margin, set to inline-block +.form-search .radio input[type="radio"], +.form-search .checkbox input[type="checkbox"], +.form-inline .radio input[type="radio"], +.form-inline .checkbox input[type="checkbox"] { + float: left; + margin-right: 3px; + margin-left: 0; +} + + +// Margin to space out fieldsets +.control-group { + margin-bottom: @baseLineHeight / 2; +} + +// Legend collapses margin, so next element is responsible for spacing +legend + .control-group { + margin-top: @baseLineHeight; + -webkit-margin-top-collapse: separate; +} + +// Horizontal-specific styles +// -------------------------- + +.form-horizontal { + // Increase spacing between groups + .control-group { + margin-bottom: @baseLineHeight; + .clearfix(); + } + // Float the labels left + .control-label { + float: left; + width: @horizontalComponentOffset - 20; + padding-top: 5px; + text-align: right; + } + // Move over all input controls and content + .controls { + // Super jank IE7 fix to ensure the inputs in .input-append and input-prepend + // don't inherit the margin of the parent, in this case .controls + *display: inline-block; + *padding-left: 20px; + margin-left: @horizontalComponentOffset; + *margin-left: 0; + &:first-child { + *padding-left: @horizontalComponentOffset; + } + } + // Remove bottom margin on block level help text since that's accounted for on .control-group + .help-block { + margin-bottom: 0; + } + // And apply it only to .help-block instances that follow a form control + input, + select, + textarea { + + .help-block { + margin-top: @baseLineHeight / 2; + } + } + // Move over buttons in .form-actions to align with .controls + .form-actions { + padding-left: @horizontalComponentOffset; + } +} diff --git a/examples/container/css/bootstrap/grid.less b/examples/container/css/bootstrap/grid.less new file mode 100644 index 00000000..750d2035 --- /dev/null +++ b/examples/container/css/bootstrap/grid.less @@ -0,0 +1,21 @@ +// +// Grid system +// -------------------------------------------------- + + +// Fixed (940px) +#grid > .core(@gridColumnWidth, @gridGutterWidth); + +// Fluid (940px) +#grid > .fluid(@fluidGridColumnWidth, @fluidGridGutterWidth); + +// Reset utility classes due to specificity +[class*="span"].hide, +.row-fluid [class*="span"].hide { + display: none; +} + +[class*="span"].pull-right, +.row-fluid [class*="span"].pull-right { + float: right; +} diff --git a/examples/container/css/bootstrap/hero-unit.less b/examples/container/css/bootstrap/hero-unit.less new file mode 100644 index 00000000..672b7d7c --- /dev/null +++ b/examples/container/css/bootstrap/hero-unit.less @@ -0,0 +1,24 @@ +// +// Hero unit +// -------------------------------------------------- + + +.hero-unit { + padding: 60px; + margin-bottom: 30px; + background-color: @heroUnitBackground; + .border-radius(6px); + h1 { + margin-bottom: 0; + font-size: 60px; + line-height: 1; + color: @heroUnitHeadingColor; + letter-spacing: -1px; + } + p { + font-size: 18px; + font-weight: 200; + line-height: @baseLineHeight * 1.5; + color: @heroUnitLeadColor; + } +} diff --git a/examples/container/css/bootstrap/labels-badges.less b/examples/container/css/bootstrap/labels-badges.less new file mode 100644 index 00000000..2f15fec0 --- /dev/null +++ b/examples/container/css/bootstrap/labels-badges.less @@ -0,0 +1,72 @@ +// +// Labels and badges +// -------------------------------------------------- + + +// Base classes +.label, +.badge { + font-size: @baseFontSize * .846; + font-weight: bold; + line-height: 14px; // ensure proper line-height if floated + color: @white; + vertical-align: baseline; + white-space: nowrap; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + background-color: @grayLight; +} +// Set unique padding and border-radii +.label { + padding: 1px 4px 2px; + .border-radius(3px); +} +.badge { + padding: 1px 9px 2px; + .border-radius(9px); +} + +// Hover state, but only for links +a { + &.label:hover, + &.badge:hover { + color: @white; + text-decoration: none; + cursor: pointer; + } +} + +// Colors +// Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute) +.label, +.badge { + // Important (red) + &-important { background-color: @errorText; } + &-important[href] { background-color: darken(@errorText, 10%); } + // Warnings (orange) + &-warning { background-color: @orange; } + &-warning[href] { background-color: darken(@orange, 10%); } + // Success (green) + &-success { background-color: @successText; } + &-success[href] { background-color: darken(@successText, 10%); } + // Info (turquoise) + &-info { background-color: @infoText; } + &-info[href] { background-color: darken(@infoText, 10%); } + // Inverse (black) + &-inverse { background-color: @grayDark; } + &-inverse[href] { background-color: darken(@grayDark, 10%); } +} + +// Quick fix for labels/badges in buttons +.btn { + .label, + .badge { + position: relative; + top: -1px; + } +} +.btn-mini { + .label, + .badge { + top: 0; + } +} diff --git a/examples/container/css/bootstrap/layouts.less b/examples/container/css/bootstrap/layouts.less new file mode 100644 index 00000000..24a20621 --- /dev/null +++ b/examples/container/css/bootstrap/layouts.less @@ -0,0 +1,16 @@ +// +// Layouts +// -------------------------------------------------- + + +// Container (centered, fixed-width layouts) +.container { + .container-fixed(); +} + +// Fluid layouts (left aligned, with sidebar, min- & max-width content) +.container-fluid { + padding-right: @gridGutterWidth; + padding-left: @gridGutterWidth; + .clearfix(); +} \ No newline at end of file diff --git a/examples/container/css/bootstrap/mixins.less b/examples/container/css/bootstrap/mixins.less new file mode 100644 index 00000000..67f1c0af --- /dev/null +++ b/examples/container/css/bootstrap/mixins.less @@ -0,0 +1,681 @@ +// +// Mixins +// -------------------------------------------------- + + +// UTILITY MIXINS +// -------------------------------------------------- + +// Clearfix +// -------- +// For clearing floats like a boss h5bp.com/q +.clearfix { + *zoom: 1; + &:before, + &:after { + display: table; + content: ""; + // Fixes Opera/contenteditable bug: + // http://nicolasgallagher.com/micro-clearfix-hack/#comment-36952 + line-height: 0; + } + &:after { + clear: both; + } +} + +// Webkit-style focus +// ------------------ +.tab-focus() { + // Default + outline: thin dotted #333; + // Webkit + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} + +// Center-align a block level element +// ---------------------------------- +.center-block() { + display: block; + margin-left: auto; + margin-right: auto; +} + +// IE7 inline-block +// ---------------- +.ie7-inline-block() { + *display: inline; /* IE7 inline-block hack */ + *zoom: 1; +} + +// IE7 likes to collapse whitespace on either side of the inline-block elements. +// Ems because we're attempting to match the width of a space character. Left +// version is for form buttons, which typically come after other elements, and +// right version is for icons, which come before. Applying both is ok, but it will +// mean that space between those elements will be .6em (~2 space characters) in IE7, +// instead of the 1 space in other browsers. +.ie7-restore-left-whitespace() { + *margin-left: .3em; + + &:first-child { + *margin-left: 0; + } +} + +.ie7-restore-right-whitespace() { + *margin-right: .3em; +} + +// Sizing shortcuts +// ------------------------- +.size(@height, @width) { + width: @width; + height: @height; +} +.square(@size) { + .size(@size, @size); +} + +// Placeholder text +// ------------------------- +.placeholder(@color: @placeholderText) { + &:-moz-placeholder { + color: @color; + } + &:-ms-input-placeholder { + color: @color; + } + &::-webkit-input-placeholder { + color: @color; + } +} + +// Text overflow +// ------------------------- +// Requires inline-block or block for proper styling +.text-overflow() { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +// CSS image replacement +// ------------------------- +// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 +.hide-text { + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; +} + + +// FONTS +// -------------------------------------------------- + +#font { + #family { + .serif() { + font-family: @serifFontFamily; + } + .sans-serif() { + font-family: @sansFontFamily; + } + .monospace() { + font-family: @monoFontFamily; + } + } + .shorthand(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + font-size: @size; + font-weight: @weight; + line-height: @lineHeight; + } + .serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .serif; + #font > .shorthand(@size, @weight, @lineHeight); + } + .sans-serif(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .sans-serif; + #font > .shorthand(@size, @weight, @lineHeight); + } + .monospace(@size: @baseFontSize, @weight: normal, @lineHeight: @baseLineHeight) { + #font > #family > .monospace; + #font > .shorthand(@size, @weight, @lineHeight); + } +} + + +// FORMS +// -------------------------------------------------- + +// Block level inputs +.input-block-level { + display: block; + width: 100%; + min-height: 30px; // Make inputs at least the height of their button counterpart + .box-sizing(border-box); // Makes inputs behave like true block-level elements +} + + + +// Mixin for form field states +.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) { + // Set the text color + > label, + .help-block, + .help-inline { + color: @textColor; + } + // Style inputs accordingly + .checkbox, + .radio, + input, + select, + textarea { + color: @textColor; + } + input, + select, + textarea { + border-color: @borderColor; + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work + &:focus { + border-color: darken(@borderColor, 10%); + .box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%)); + } + } + // Give a small background color for input-prepend/-append + .input-prepend .add-on, + .input-append .add-on { + color: @textColor; + background-color: @backgroundColor; + border-color: @textColor; + } +} + + + +// CSS3 PROPERTIES +// -------------------------------------------------- + +// Border Radius +.border-radius(@radius) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; +} + +// Single Corner Border Radius +.border-top-left-radius(@radius) { + -webkit-border-top-left-radius: @radius; + -moz-border-radius-topleft: @radius; + border-top-left-radius: @radius; +} +.border-top-right-radius(@radius) { + -webkit-border-top-right-radius: @radius; + -moz-border-radius-topright: @radius; + border-top-right-radius: @radius; +} +.border-bottom-right-radius(@radius) { + -webkit-border-bottom-right-radius: @radius; + -moz-border-radius-bottomright: @radius; + border-bottom-right-radius: @radius; +} +.border-bottom-left-radius(@radius) { + -webkit-border-bottom-left-radius: @radius; + -moz-border-radius-bottomleft: @radius; + border-bottom-left-radius: @radius; +} + +// Single Side Border Radius +.border-top-radius(@radius) { + .border-top-right-radius(@radius); + .border-top-left-radius(@radius); +} +.border-right-radius(@radius) { + .border-top-right-radius(@radius); + .border-bottom-right-radius(@radius); +} +.border-bottom-radius(@radius) { + .border-bottom-right-radius(@radius); + .border-bottom-left-radius(@radius); +} +.border-left-radius(@radius) { + .border-top-left-radius(@radius); + .border-bottom-left-radius(@radius); +} + +// Drop shadows +.box-shadow(@shadowA, @shadowB:X, ...){ + // Multiple shadow solution from http://toekneestuck.com/blog/2012/05/15/less-css-arguments-variable/ + @props: ~`"@{arguments}".replace(/[\[\]]|\,\sX/g, '')`; + -webkit-box-shadow: @props; + -moz-box-shadow: @props; + box-shadow: @props; +} + +// Transitions +.transition(@transition) { + -webkit-transition: @transition; + -moz-transition: @transition; + -o-transition: @transition; + transition: @transition; +} +.transition-delay(@transition-delay) { + -webkit-transition-delay: @transition-delay; + -moz-transition-delay: @transition-delay; + -o-transition-delay: @transition-delay; + transition-delay: @transition-delay; +} + +// Transformations +.rotate(@degrees) { + -webkit-transform: rotate(@degrees); + -moz-transform: rotate(@degrees); + -ms-transform: rotate(@degrees); + -o-transform: rotate(@degrees); + transform: rotate(@degrees); +} +.scale(@ratio) { + -webkit-transform: scale(@ratio); + -moz-transform: scale(@ratio); + -ms-transform: scale(@ratio); + -o-transform: scale(@ratio); + transform: scale(@ratio); +} +.translate(@x, @y) { + -webkit-transform: translate(@x, @y); + -moz-transform: translate(@x, @y); + -ms-transform: translate(@x, @y); + -o-transform: translate(@x, @y); + transform: translate(@x, @y); +} +.skew(@x, @y) { + -webkit-transform: skew(@x, @y); + -moz-transform: skew(@x, @y); + -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twitter/bootstrap/issues/4885 + -o-transform: skew(@x, @y); + transform: skew(@x, @y); +} +.translate3d(@x, @y, @z) { + -webkit-transform: translate3d(@x, @y, @z); + -moz-transform: translate3d(@x, @y, @z); + -o-transform: translate3d(@x, @y, @z); + transform: translate3d(@x, @y, @z); +} + +// Backface visibility +// Prevent browsers from flickering when using CSS 3D transforms. +// Default value is `visible`, but can be changed to `hidden +// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples +.backface-visibility(@visibility){ + -webkit-backface-visibility: @visibility; + -moz-backface-visibility: @visibility; + backface-visibility: @visibility; +} + +// Background clipping +// Heads up: FF 3.6 and under need "padding" instead of "padding-box" +.background-clip(@clip) { + -webkit-background-clip: @clip; + -moz-background-clip: @clip; + background-clip: @clip; +} + +// Background sizing +.background-size(@size){ + -webkit-background-size: @size; + -moz-background-size: @size; + -o-background-size: @size; + background-size: @size; +} + + +// Box sizing +.box-sizing(@boxmodel) { + -webkit-box-sizing: @boxmodel; + -moz-box-sizing: @boxmodel; + box-sizing: @boxmodel; +} + +// User select +// For selecting text on the page +.user-select(@select) { + -webkit-user-select: @select; + -moz-user-select: @select; + -ms-user-select: @select; + -o-user-select: @select; + user-select: @select; +} + +// Resize anything +.resizable(@direction) { + resize: @direction; // Options: horizontal, vertical, both + overflow: auto; // Safari fix +} + +// CSS3 Content Columns +.content-columns(@columnCount, @columnGap: @gridGutterWidth) { + -webkit-column-count: @columnCount; + -moz-column-count: @columnCount; + column-count: @columnCount; + -webkit-column-gap: @columnGap; + -moz-column-gap: @columnGap; + column-gap: @columnGap; +} + +// Optional hyphenation +.hyphens(@mode: auto) { + word-wrap: break-word; + -webkit-hyphens: @mode; + -moz-hyphens: @mode; + -ms-hyphens: @mode; + -o-hyphens: @mode; + hyphens: @mode; +} + +// Opacity +.opacity(@opacity) { + opacity: @opacity / 100; + filter: ~"alpha(opacity=@{opacity})"; +} + + + +// BACKGROUNDS +// -------------------------------------------------- + +// Add an alphatransparency value to any background or border color (via Elyse Holladay) +#translucent { + .background(@color: @white, @alpha: 1) { + background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha); + } + .border(@color: @white, @alpha: 1) { + border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha); + .background-clip(padding-box); + } +} + +// Gradient Bar Colors for buttons and alerts +.gradientBar(@primaryColor, @secondaryColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) { + color: @textColor; + text-shadow: @textShadow; + #gradient > .vertical(@primaryColor, @secondaryColor); + border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%); + border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%); +} + +// Gradients +#gradient { + .horizontal(@startColor: #555, @endColor: #333) { + background-color: @endColor; + background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(to right, @startColor, @endColor); // Standard, IE10 + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down + } + .vertical(@startColor: #555, @endColor: #333) { + background-color: mix(@startColor, @endColor, 60%); + background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10 + background-repeat: repeat-x; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down + } + .directional(@startColor: #555, @endColor: #333, @deg: 45deg) { + background-color: @endColor; + background-repeat: repeat-x; + background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+ + background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10 + } + .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) { + background-color: mix(@midColor, @endColor, 80%); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor)); + background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor); + background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor); + background-repeat: no-repeat; + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback + } + .radial(@innerColor: #555, @outerColor: #333) { + background-color: @outerColor; + background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor)); + background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor); + background-image: -moz-radial-gradient(circle, @innerColor, @outerColor); + background-image: -o-radial-gradient(circle, @innerColor, @outerColor); + background-repeat: no-repeat; + } + .striped(@color: #555, @angle: 45deg) { + background-color: @color; + background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent)); + background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); + } +} +// Reset filters for IE +.reset-filter() { + filter: e(%("progid:DXImageTransform.Microsoft.gradient(enabled = false)")); +} + + + +// COMPONENT MIXINS +// -------------------------------------------------- + +// Horizontal dividers +// ------------------------- +// Dividers (basically an hr) within dropdowns and nav lists +.nav-divider(@top: #e5e5e5, @bottom: @white) { + // IE7 needs a set width since we gave a height. Restricting just + // to IE7 to keep the 1px left/right space in other browsers. + // It is unclear where IE is getting the extra space that we need + // to negative-margin away, but so it goes. + *width: 100%; + height: 1px; + margin: ((@baseLineHeight / 2) - 1) 1px; // 8px 1px + *margin: -5px 0 5px; + overflow: hidden; + background-color: @top; + border-bottom: 1px solid @bottom; +} + +// Button backgrounds +// ------------------ +.buttonBackground(@startColor, @endColor, @textColor: #fff, @textShadow: 0 -1px 0 rgba(0,0,0,.25)) { + // gradientBar will set the background to a pleasing blend of these, to support IE<=9 + .gradientBar(@startColor, @endColor, @textColor, @textShadow); + *background-color: @endColor; /* Darken IE7 buttons by default so they stand out more given they won't have borders */ + .reset-filter(); + + // in these cases the gradient won't cover the background, so we override + &:hover, &:active, &.active, &.disabled, &[disabled] { + color: @textColor; + background-color: @endColor; + *background-color: darken(@endColor, 5%); + } + + // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves + &:active, + &.active { + background-color: darken(@endColor, 10%) e("\9"); + } +} + +// Navbar vertical align +// ------------------------- +// Vertically center elements in the navbar. +// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin. +.navbarVerticalAlign(@elementHeight) { + margin-top: (@navbarHeight - @elementHeight) / 2; +} + + + +// Grid System +// ----------- + +// Centered container element +.container-fixed() { + margin-right: auto; + margin-left: auto; + .clearfix(); +} + +// Table columns +.tableColumns(@columnSpan: 1) { + float: none; // undo default grid column styles + width: ((@gridColumnWidth) * @columnSpan) + (@gridGutterWidth * (@columnSpan - 1)) - 16; // 16 is total padding on left and right of table cells + margin-left: 0; // undo default grid column styles +} + +// Make a Grid +// Use .makeRow and .makeColumn to assign semantic layouts grid system behavior +.makeRow() { + margin-left: @gridGutterWidth * -1; + .clearfix(); +} +.makeColumn(@columns: 1, @offset: 0) { + float: left; + margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2); + width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); +} + +// The Grid +#grid { + + .core (@gridColumnWidth, @gridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~".span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .offsetX (@index) when (@index > 0) { + (~".offset@{index}") { .offset(@index); } + .offsetX(@index - 1); + } + .offsetX (0) {} + + .offset (@columns) { + margin-left: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns + 1)); + } + + .span (@columns) { + width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1)); + } + + .row { + margin-left: @gridGutterWidth * -1; + .clearfix(); + } + + [class*="span"] { + float: left; + min-height: 1px; // prevent collapsing columns + margin-left: @gridGutterWidth; + } + + // Set the container width, and override it for fixed navbars in media queries + .container, + .navbar-static-top .container, + .navbar-fixed-top .container, + .navbar-fixed-bottom .container { .span(@gridColumns); } + + // generate .spanX and .offsetX + .spanX (@gridColumns); + .offsetX (@gridColumns); + + } + + .fluid (@fluidGridColumnWidth, @fluidGridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~".span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .offsetX (@index) when (@index > 0) { + (~'.offset@{index}') { .offset(@index); } + (~'.offset@{index}:first-child') { .offsetFirstChild(@index); } + .offsetX(@index - 1); + } + .offsetX (0) {} + + .offset (@columns) { + margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth*2); + *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + (@fluidGridGutterWidth*2) - (.5 / @gridRowWidth * 100 * 1%); + } + + .offsetFirstChild (@columns) { + margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) + (@fluidGridGutterWidth); + *margin-left: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%) + @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + } + + .span (@columns) { + width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)); + *width: (@fluidGridColumnWidth * @columns) + (@fluidGridGutterWidth * (@columns - 1)) - (.5 / @gridRowWidth * 100 * 1%); + } + + .row-fluid { + width: 100%; + .clearfix(); + [class*="span"] { + .input-block-level(); + float: left; + margin-left: @fluidGridGutterWidth; + *margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%); + } + [class*="span"]:first-child { + margin-left: 0; + } + + // generate .spanX and .offsetX + .spanX (@gridColumns); + .offsetX (@gridColumns); + } + + } + + .input(@gridColumnWidth, @gridGutterWidth) { + + .spanX (@index) when (@index > 0) { + (~"input.span@{index}, textarea.span@{index}, .uneditable-input.span@{index}") { .span(@index); } + .spanX(@index - 1); + } + .spanX (0) {} + + .span(@columns) { + width: ((@gridColumnWidth) * @columns) + (@gridGutterWidth * (@columns - 1)) - 14; + } + + input, + textarea, + .uneditable-input { + margin-left: 0; // override margin-left from core grid system + } + + // Space grid-sized controls properly if multiple per line + .controls-row [class*="span"] + [class*="span"] { + margin-left: @gridGutterWidth; + } + + // generate .spanX + .spanX (@gridColumns); + + } + +} diff --git a/examples/container/css/bootstrap/modals.less b/examples/container/css/bootstrap/modals.less new file mode 100644 index 00000000..81cacb7a --- /dev/null +++ b/examples/container/css/bootstrap/modals.less @@ -0,0 +1,98 @@ +// +// Modals +// -------------------------------------------------- + + +// Recalculate z-index where appropriate, +// but only apply to elements within modal +.modal-open .modal { + .dropdown-menu { z-index: @zindexDropdown + @zindexModal; } + .dropdown.open { *z-index: @zindexDropdown + @zindexModal; } + .popover { z-index: @zindexPopover + @zindexModal; } + .tooltip { z-index: @zindexTooltip + @zindexModal; } +} + +// Background +.modal-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: @zindexModalBackdrop; + background-color: @black; + // Fade for backdrop + &.fade { opacity: 0; } +} + +.modal-backdrop, +.modal-backdrop.fade.in { + .opacity(80); +} + +// Base modal +.modal { + position: fixed; + top: 50%; + left: 50%; + z-index: @zindexModal; + overflow: auto; + width: 560px; + margin: -250px 0 0 -280px; + background-color: @white; + border: 1px solid #999; + border: 1px solid rgba(0,0,0,.3); + *border: 1px solid #999; /* IE6-7 */ + .border-radius(6px); + .box-shadow(0 3px 7px rgba(0,0,0,0.3)); + .background-clip(padding-box); + &.fade { + .transition(e('opacity .3s linear, top .3s ease-out')); + top: -25%; + } + &.fade.in { top: 50%; } +} +.modal-header { + padding: 9px 15px; + border-bottom: 1px solid #eee; + // Close icon + .close { margin-top: 2px; } + // Heading + h3 { + margin: 0; + line-height: 30px; + } +} + +// Body (where all modal content resides) +.modal-body { + overflow-y: auto; + max-height: 400px; + padding: 15px; +} +// Remove bottom margin if need be +.modal-form { + margin-bottom: 0; +} + +// Footer (for actions) +.modal-footer { + padding: 14px 15px 15px; + margin-bottom: 0; + text-align: right; // right align buttons + background-color: #f5f5f5; + border-top: 1px solid #ddd; + .border-radius(0 0 6px 6px); + .box-shadow(inset 0 1px 0 @white); + .clearfix(); // clear it in case folks use .pull-* classes on buttons + + // Properly space out buttons + .btn + .btn { + margin-left: 5px; + margin-bottom: 0; // account for input[type="submit"] which gets the bottom margin like all other inputs + } + // but override that for button groups + .btn-group .btn + .btn { + margin-left: -1px; + } +} diff --git a/examples/container/css/bootstrap/navbar.less b/examples/container/css/bootstrap/navbar.less new file mode 100644 index 00000000..3514c40e --- /dev/null +++ b/examples/container/css/bootstrap/navbar.less @@ -0,0 +1,475 @@ +// +// Navbars (Redux) +// -------------------------------------------------- + + +// COMMON STYLES +// ------------- + +// Base class and wrapper +.navbar { + overflow: visible; + margin-bottom: @baseLineHeight; + color: @navbarText; + + // Fix for IE7's bad z-indexing so dropdowns don't appear below content that follows the navbar + *position: relative; + *z-index: 2; +} + +// Inner for background effects +// Gradient is applied to its own element because overflow visible is not honored by IE when filter is present +.navbar-inner { + min-height: @navbarHeight; + padding-left: 20px; + padding-right: 20px; + #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground); + border: 1px solid @navbarBorder; + .border-radius(4px); + .box-shadow(0 1px 4px rgba(0,0,0,.065)); + + // Prevent floats from breaking the navbar + .clearfix(); +} + +// Set width to auto for default container +// We then reset it for fixed navbars in the #gridSystem mixin +.navbar .container { + width: auto; +} + +// Override the default collapsed state +.nav-collapse.collapse { + height: auto; +} + + +// Brand: website or project name +// ------------------------- +.navbar .brand { + float: left; + display: block; + // Vertically center the text given @navbarHeight + padding: ((@navbarHeight - @baseLineHeight) / 2) 20px ((@navbarHeight - @baseLineHeight) / 2); + margin-left: -20px; // negative indent to left-align the text down the page + font-size: 20px; + font-weight: 200; + color: @navbarBrandColor; + text-shadow: 0 1px 0 @navbarBackgroundHighlight; + &:hover { + text-decoration: none; + } +} + +// Plain text in topbar +// ------------------------- +.navbar-text { + margin-bottom: 0; + line-height: @navbarHeight; +} + +// Janky solution for now to account for links outside the .nav +// ------------------------- +.navbar-link { + color: @navbarLinkColor; + &:hover { + color: @navbarLinkColorHover; + } +} + +// Dividers in navbar +// ------------------------- +.navbar .divider-vertical { + height: @navbarHeight; + margin: 0 9px; + border-left: 1px solid @navbarBackground; + border-right: 1px solid @navbarBackgroundHighlight; +} + +// Buttons in navbar +// ------------------------- +.navbar .btn, +.navbar .btn-group { + .navbarVerticalAlign(30px); // Vertically center in navbar +} +.navbar .btn-group .btn, +.navbar .input-prepend .btn, +.navbar .input-append .btn { + margin-top: 0; // then undo the margin here so we don't accidentally double it +} + +// Navbar forms +// ------------------------- +.navbar-form { + margin-bottom: 0; // remove default bottom margin + .clearfix(); + input, + select, + .radio, + .checkbox { + .navbarVerticalAlign(30px); // Vertically center in navbar + } + input, + select, + .btn { + display: inline-block; + margin-bottom: 0; + } + input[type="image"], + input[type="checkbox"], + input[type="radio"] { + margin-top: 3px; + } + .input-append, + .input-prepend { + margin-top: 6px; + white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left + input { + margin-top: 0; // remove the margin on top since it's on the parent + } + } +} + +// Navbar search +// ------------------------- +.navbar-search { + position: relative; + float: left; + .navbarVerticalAlign(30px); // Vertically center in navbar + margin-bottom: 0; + .search-query { + margin-bottom: 0; + padding: 4px 14px; + #font > .sans-serif(13px, normal, 1); + .border-radius(15px); // redeclare because of specificity of the type attribute + } +} + + + +// Static navbar +// ------------------------- + +.navbar-static-top { + position: static; + width: 100%; + margin-bottom: 0; // remove 18px margin for default navbar + .navbar-inner { + .border-radius(0); + } +} + + + +// Fixed navbar +// ------------------------- + +// Shared (top/bottom) styles +.navbar-fixed-top, +.navbar-fixed-bottom { + position: fixed; + right: 0; + left: 0; + z-index: @zindexFixedNavbar; + margin-bottom: 0; // remove 18px margin for default navbar +} +.navbar-fixed-top .navbar-inner, +.navbar-static-top .navbar-inner { + border-width: 0 0 1px; +} +.navbar-fixed-bottom .navbar-inner { + border-width: 1px 0 0; +} +.navbar-fixed-top .navbar-inner, +.navbar-fixed-bottom .navbar-inner { + padding-left: 0; + padding-right: 0; + .border-radius(0); +} + +// Reset container width +// Required here as we reset the width earlier on and the grid mixins don't override early enough +.navbar-static-top .container, +.navbar-fixed-top .container, +.navbar-fixed-bottom .container { + #grid > .core > .span(@gridColumns); +} + +// Fixed to top +.navbar-fixed-top { + top: 0; +} +.navbar-fixed-top, +.navbar-static-top { + .navbar-inner { + .box-shadow(inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1)); + } +} + +// Fixed to bottom +.navbar-fixed-bottom { + bottom: 0; + .navbar-inner { + .box-shadow(inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1)); + } +} + + + +// NAVIGATION +// ---------- + +.navbar .nav { + position: relative; + left: 0; + display: block; + float: left; + margin: 0 10px 0 0; +} +.navbar .nav.pull-right { + float: right; // redeclare due to specificity + margin-right: 0; // remove margin on float right nav +} +.navbar .nav > li { + float: left; +} + +// Links +.navbar .nav > li > a { + float: none; + // Vertically center the text given @navbarHeight + padding: ((@navbarHeight - @baseLineHeight) / 2) 15px ((@navbarHeight - @baseLineHeight) / 2); + color: @navbarLinkColor; + text-decoration: none; + text-shadow: 0 1px 0 @navbarBackgroundHighlight; +} +.navbar .nav .dropdown-toggle .caret { + margin-top: 8px; +} + +// Hover +.navbar .nav > li > a:focus, +.navbar .nav > li > a:hover { + background-color: @navbarLinkBackgroundHover; // "transparent" is default to differentiate :hover from .active + color: @navbarLinkColorHover; + text-decoration: none; +} + +// Active nav items +.navbar .nav > .active > a, +.navbar .nav > .active > a:hover, +.navbar .nav > .active > a:focus { + color: @navbarLinkColorActive; + text-decoration: none; + background-color: @navbarLinkBackgroundActive; + .box-shadow(inset 0 3px 8px rgba(0,0,0,.125)); +} + +// Navbar button for toggling navbar items in responsive layouts +// These definitions need to come after '.navbar .btn' +.navbar .btn-navbar { + display: none; + float: right; + padding: 7px 10px; + margin-left: 5px; + margin-right: 5px; + .buttonBackground(darken(@navbarBackgroundHighlight, 5%), darken(@navbarBackground, 5%)); + .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)); +} +.navbar .btn-navbar .icon-bar { + display: block; + width: 18px; + height: 2px; + background-color: #f5f5f5; + .border-radius(1px); + .box-shadow(0 1px 0 rgba(0,0,0,.25)); +} +.btn-navbar .icon-bar + .icon-bar { + margin-top: 3px; +} + + + +// Dropdown menus +// -------------- + +// Menu position and menu carets +.navbar .nav > li > .dropdown-menu { + &:before { + content: ''; + display: inline-block; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + border-bottom: 7px solid #ccc; + border-bottom-color: @dropdownBorder; + position: absolute; + top: -7px; + left: 9px; + } + &:after { + content: ''; + display: inline-block; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid @dropdownBackground; + position: absolute; + top: -6px; + left: 10px; + } +} +// Menu position and menu caret support for dropups via extra dropup class +.navbar-fixed-bottom .nav > li > .dropdown-menu { + &:before { + border-top: 7px solid #ccc; + border-top-color: @dropdownBorder; + border-bottom: 0; + bottom: -7px; + top: auto; + } + &:after { + border-top: 6px solid @dropdownBackground; + border-bottom: 0; + bottom: -6px; + top: auto; + } +} + +// Remove background color from open dropdown +.navbar .nav li.dropdown.open > .dropdown-toggle, +.navbar .nav li.dropdown.active > .dropdown-toggle, +.navbar .nav li.dropdown.open.active > .dropdown-toggle { + background-color: @navbarLinkBackgroundActive; + color: @navbarLinkColorActive; +} +.navbar .nav li.dropdown > .dropdown-toggle .caret { + border-top-color: @navbarLinkColor; + border-bottom-color: @navbarLinkColor; +} +.navbar .nav li.dropdown.open > .dropdown-toggle .caret, +.navbar .nav li.dropdown.active > .dropdown-toggle .caret, +.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret { + border-top-color: @navbarLinkColorActive; + border-bottom-color: @navbarLinkColorActive; +} + +// Right aligned menus need alt position +.navbar .pull-right > li > .dropdown-menu, +.navbar .nav > li > .dropdown-menu.pull-right { + left: auto; + right: 0; + &:before { + left: auto; + right: 12px; + } + &:after { + left: auto; + right: 13px; + } + .dropdown-menu { + left: auto; + right: 100%; + margin-left: 0; + margin-right: -1px; + .border-radius(6px 0 6px 6px); + } +} + + +// Inverted navbar +// ------------------------- + +.navbar-inverse { + color: @navbarInverseText; + + .navbar-inner { + #gradient > .vertical(@navbarInverseBackgroundHighlight, @navbarInverseBackground); + border-color: @navbarInverseBorder; + } + + .brand, + .nav > li > a { + color: @navbarInverseLinkColor; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + &:hover { + color: @navbarInverseLinkColorHover; + } + } + + .nav > li > a:focus, + .nav > li > a:hover { + background-color: @navbarInverseLinkBackgroundHover; + color: @navbarInverseLinkColorHover; + } + + .nav .active > a, + .nav .active > a:hover, + .nav .active > a:focus { + color: @navbarInverseLinkColorActive; + background-color: @navbarInverseLinkBackgroundActive; + } + + // Inline text links + .navbar-link { + color: @navbarInverseLinkColor; + &:hover { + color: @navbarInverseLinkColorHover; + } + } + + // Dividers in navbar + .divider-vertical { + border-left-color: @navbarInverseBackground; + border-right-color: @navbarInverseBackgroundHighlight; + } + + // Dropdowns + .nav li.dropdown.open > .dropdown-toggle, + .nav li.dropdown.active > .dropdown-toggle, + .nav li.dropdown.open.active > .dropdown-toggle { + background-color: @navbarInverseLinkBackgroundActive; + color: @navbarInverseLinkColorActive; + } + .nav li.dropdown > .dropdown-toggle .caret { + border-top-color: @navbarInverseLinkColor; + border-bottom-color: @navbarInverseLinkColor; + } + .nav li.dropdown.open > .dropdown-toggle .caret, + .nav li.dropdown.active > .dropdown-toggle .caret, + .nav li.dropdown.open.active > .dropdown-toggle .caret { + border-top-color: @navbarInverseLinkColorActive; + border-bottom-color: @navbarInverseLinkColorActive; + } + + // Navbar search + .navbar-search { + .search-query { + color: @white; + background-color: @navbarInverseSearchBackground; + border-color: @navbarInverseSearchBorder; + .box-shadow(inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)); + .transition(none); + .placeholder(@navbarInverseSearchPlaceholderColor); + + // Focus states (we use .focused since IE7-8 and down doesn't support :focus) + &:focus, + &.focused { + padding: 5px 15px; + color: @grayDark; + text-shadow: 0 1px 0 @white; + background-color: @navbarInverseSearchBackgroundFocus; + border: 0; + .box-shadow(0 0 3px rgba(0,0,0,.15)); + outline: 0; + } + } + } + + // Navbar collapse button + .btn-navbar { + .buttonBackground(darken(@navbarInverseBackgroundHighlight, 5%), darken(@navbarInverseBackground, 5%)); + } + +} + + + diff --git a/examples/container/css/bootstrap/navs.less b/examples/container/css/bootstrap/navs.less new file mode 100644 index 00000000..4c38f7db --- /dev/null +++ b/examples/container/css/bootstrap/navs.less @@ -0,0 +1,384 @@ +// +// Navs +// -------------------------------------------------- + + +// BASE CLASS +// ---------- + +.nav { + margin-left: 0; + margin-bottom: @baseLineHeight; + list-style: none; +} + +// Make links block level +.nav > li > a { + display: block; +} +.nav > li > a:hover { + text-decoration: none; + background-color: @grayLighter; +} + +// Redeclare pull classes because of specifity +.nav > .pull-right { + float: right; +} + +// Nav headers (for dropdowns and lists) +.nav-header { + display: block; + padding: 3px 15px; + font-size: 11px; + font-weight: bold; + line-height: @baseLineHeight; + color: @grayLight; + text-shadow: 0 1px 0 rgba(255,255,255,.5); + text-transform: uppercase; +} +// Space them out when they follow another list item (link) +.nav li + .nav-header { + margin-top: 9px; +} + + + +// NAV LIST +// -------- + +.nav-list { + padding-left: 15px; + padding-right: 15px; + margin-bottom: 0; +} +.nav-list > li > a, +.nav-list .nav-header { + margin-left: -15px; + margin-right: -15px; + text-shadow: 0 1px 0 rgba(255,255,255,.5); +} +.nav-list > li > a { + padding: 3px 15px; +} +.nav-list > .active > a, +.nav-list > .active > a:hover { + color: @white; + text-shadow: 0 -1px 0 rgba(0,0,0,.2); + background-color: @linkColor; +} +.nav-list [class^="icon-"] { + margin-right: 2px; +} +// Dividers (basically an hr) within the dropdown +.nav-list .divider { + .nav-divider(); +} + + + +// TABS AND PILLS +// ------------- + +// Common styles +.nav-tabs, +.nav-pills { + .clearfix(); +} +.nav-tabs > li, +.nav-pills > li { + float: left; +} +.nav-tabs > li > a, +.nav-pills > li > a { + padding-right: 12px; + padding-left: 12px; + margin-right: 2px; + line-height: 14px; // keeps the overall height an even number +} + +// TABS +// ---- + +// Give the tabs something to sit on +.nav-tabs { + border-bottom: 1px solid #ddd; +} +// Make the list-items overlay the bottom border +.nav-tabs > li { + margin-bottom: -1px; +} +// Actual tabs (as links) +.nav-tabs > li > a { + padding-top: 8px; + padding-bottom: 8px; + line-height: @baseLineHeight; + border: 1px solid transparent; + .border-radius(4px 4px 0 0); + &:hover { + border-color: @grayLighter @grayLighter #ddd; + } +} +// Active state, and it's :hover to override normal :hover +.nav-tabs > .active > a, +.nav-tabs > .active > a:hover { + color: @gray; + background-color: @white; + border: 1px solid #ddd; + border-bottom-color: transparent; + cursor: default; +} + + +// PILLS +// ----- + +// Links rendered as pills +.nav-pills > li > a { + padding-top: 8px; + padding-bottom: 8px; + margin-top: 2px; + margin-bottom: 2px; + .border-radius(5px); +} + +// Active state +.nav-pills > .active > a, +.nav-pills > .active > a:hover { + color: @white; + background-color: @linkColor; +} + + + +// STACKED NAV +// ----------- + +// Stacked tabs and pills +.nav-stacked > li { + float: none; +} +.nav-stacked > li > a { + margin-right: 0; // no need for the gap between nav items +} + +// Tabs +.nav-tabs.nav-stacked { + border-bottom: 0; +} +.nav-tabs.nav-stacked > li > a { + border: 1px solid #ddd; + .border-radius(0); +} +.nav-tabs.nav-stacked > li:first-child > a { + .border-top-radius(4px); +} +.nav-tabs.nav-stacked > li:last-child > a { + .border-bottom-radius(4px); +} +.nav-tabs.nav-stacked > li > a:hover { + border-color: #ddd; + z-index: 2; +} + +// Pills +.nav-pills.nav-stacked > li > a { + margin-bottom: 3px; +} +.nav-pills.nav-stacked > li:last-child > a { + margin-bottom: 1px; // decrease margin to match sizing of stacked tabs +} + + + +// DROPDOWNS +// --------- + +.nav-tabs .dropdown-menu { + .border-radius(0 0 6px 6px); // remove the top rounded corners here since there is a hard edge above the menu +} +.nav-pills .dropdown-menu { + .border-radius(6px); // make rounded corners match the pills +} + +// Default dropdown links +// ------------------------- +// Make carets use linkColor to start +.nav .dropdown-toggle .caret { + border-top-color: @linkColor; + border-bottom-color: @linkColor; + margin-top: 6px; +} +.nav .dropdown-toggle:hover .caret { + border-top-color: @linkColorHover; + border-bottom-color: @linkColorHover; +} +/* move down carets for tabs */ +.nav-tabs .dropdown-toggle .caret { + margin-top: 8px; +} + +// Active dropdown links +// ------------------------- +.nav .active .dropdown-toggle .caret { + border-top-color: #fff; + border-bottom-color: #fff; +} +.nav-tabs .active .dropdown-toggle .caret { + border-top-color: @gray; + border-bottom-color: @gray; +} + +// Active:hover dropdown links +// ------------------------- +.nav > .dropdown.active > a:hover { + cursor: pointer; +} + +// Open dropdowns +// ------------------------- +.nav-tabs .open .dropdown-toggle, +.nav-pills .open .dropdown-toggle, +.nav > li.dropdown.open.active > a:hover { + color: @white; + background-color: @grayLight; + border-color: @grayLight; +} +.nav li.dropdown.open .caret, +.nav li.dropdown.open.active .caret, +.nav li.dropdown.open a:hover .caret { + border-top-color: @white; + border-bottom-color: @white; + .opacity(100); +} + +// Dropdowns in stacked tabs +.tabs-stacked .open > a:hover { + border-color: @grayLight; +} + + + +// TABBABLE +// -------- + + +// COMMON STYLES +// ------------- + +// Clear any floats +.tabbable { + .clearfix(); +} +.tab-content { + overflow: auto; // prevent content from running below tabs +} + +// Remove border on bottom, left, right +.tabs-below > .nav-tabs, +.tabs-right > .nav-tabs, +.tabs-left > .nav-tabs { + border-bottom: 0; +} + +// Show/hide tabbable areas +.tab-content > .tab-pane, +.pill-content > .pill-pane { + display: none; +} +.tab-content > .active, +.pill-content > .active { + display: block; +} + + +// BOTTOM +// ------ + +.tabs-below > .nav-tabs { + border-top: 1px solid #ddd; +} +.tabs-below > .nav-tabs > li { + margin-top: -1px; + margin-bottom: 0; +} +.tabs-below > .nav-tabs > li > a { + .border-radius(0 0 4px 4px); + &:hover { + border-bottom-color: transparent; + border-top-color: #ddd; + } +} +.tabs-below > .nav-tabs > .active > a, +.tabs-below > .nav-tabs > .active > a:hover { + border-color: transparent #ddd #ddd #ddd; +} + +// LEFT & RIGHT +// ------------ + +// Common styles +.tabs-left > .nav-tabs > li, +.tabs-right > .nav-tabs > li { + float: none; +} +.tabs-left > .nav-tabs > li > a, +.tabs-right > .nav-tabs > li > a { + min-width: 74px; + margin-right: 0; + margin-bottom: 3px; +} + +// Tabs on the left +.tabs-left > .nav-tabs { + float: left; + margin-right: 19px; + border-right: 1px solid #ddd; +} +.tabs-left > .nav-tabs > li > a { + margin-right: -1px; + .border-radius(4px 0 0 4px); +} +.tabs-left > .nav-tabs > li > a:hover { + border-color: @grayLighter #ddd @grayLighter @grayLighter; +} +.tabs-left > .nav-tabs .active > a, +.tabs-left > .nav-tabs .active > a:hover { + border-color: #ddd transparent #ddd #ddd; + *border-right-color: @white; +} + +// Tabs on the right +.tabs-right > .nav-tabs { + float: right; + margin-left: 19px; + border-left: 1px solid #ddd; +} +.tabs-right > .nav-tabs > li > a { + margin-left: -1px; + .border-radius(0 4px 4px 0); +} +.tabs-right > .nav-tabs > li > a:hover { + border-color: @grayLighter @grayLighter @grayLighter #ddd; +} +.tabs-right > .nav-tabs .active > a, +.tabs-right > .nav-tabs .active > a:hover { + border-color: #ddd #ddd #ddd transparent; + *border-left-color: @white; +} + + + +// DISABLED STATES +// --------------- + +// Gray out text +.nav > .disabled > a { + color: @grayLight; +} +// Nuke hover effects +.nav > .disabled > a:hover { + text-decoration: none; + background-color: transparent; + cursor: default; +} diff --git a/examples/container/css/bootstrap/pager.less b/examples/container/css/bootstrap/pager.less new file mode 100644 index 00000000..a7629d3d --- /dev/null +++ b/examples/container/css/bootstrap/pager.less @@ -0,0 +1,40 @@ +// +// Pager pagination +// -------------------------------------------------- + + +.pager { + margin: @baseLineHeight 0; + list-style: none; + text-align: center; + .clearfix(); +} +.pager li { + display: inline; +} +.pager a, +.pager span { + display: inline-block; + padding: 5px 14px; + background-color: #fff; + border: 1px solid #ddd; + .border-radius(15px); +} +.pager a:hover { + text-decoration: none; + background-color: #f5f5f5; +} +.pager .next a, +.pager .next span { + float: right; +} +.pager .previous a { + float: left; +} +.pager .disabled a, +.pager .disabled a:hover, +.pager .disabled span { + color: @grayLight; + background-color: #fff; + cursor: default; +} \ No newline at end of file diff --git a/examples/container/css/bootstrap/pagination.less b/examples/container/css/bootstrap/pagination.less new file mode 100644 index 00000000..61a760be --- /dev/null +++ b/examples/container/css/bootstrap/pagination.less @@ -0,0 +1,64 @@ +// +// Pagination (multiple pages) +// -------------------------------------------------- + + +.pagination { + height: @baseLineHeight * 2; + margin: @baseLineHeight 0; + } +.pagination ul { + display: inline-block; + .ie7-inline-block(); + margin-left: 0; + margin-bottom: 0; + .border-radius(3px); + .box-shadow(0 1px 2px rgba(0,0,0,.05)); +} +.pagination ul > li { + display: inline; +} +.pagination ul > li > a, +.pagination ul > li > span { + float: left; + padding: 0 14px; + line-height: (@baseLineHeight * 2) - 2; + text-decoration: none; + background-color: @paginationBackground; + border: 1px solid @paginationBorder; + border-left-width: 0; +} +.pagination ul > li > a:hover, +.pagination ul > .active > a, +.pagination ul > .active > span { + background-color: #f5f5f5; +} +.pagination ul > .active > a, +.pagination ul > .active > span { + color: @grayLight; + cursor: default; +} +.pagination ul > .disabled > span, +.pagination ul > .disabled > a, +.pagination ul > .disabled > a:hover { + color: @grayLight; + background-color: transparent; + cursor: default; +} +.pagination ul > li:first-child > a, +.pagination ul > li:first-child > span { + border-left-width: 1px; + .border-radius(3px 0 0 3px); +} +.pagination ul > li:last-child > a, +.pagination ul > li:last-child > span { + .border-radius(0 3px 3px 0); +} + +// Centered +.pagination-centered { + text-align: center; +} +.pagination-right { + text-align: right; +} diff --git a/examples/container/css/bootstrap/popovers.less b/examples/container/css/bootstrap/popovers.less new file mode 100644 index 00000000..2b3f1b05 --- /dev/null +++ b/examples/container/css/bootstrap/popovers.less @@ -0,0 +1,117 @@ +// +// Popovers +// -------------------------------------------------- + + +.popover { + position: absolute; + top: 0; + left: 0; + z-index: @zindexPopover; + display: none; + width: 236px; + padding: 1px; + background-color: @popoverBackground; + -webkit-background-clip: padding-box; + -moz-background-clip: padding; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.2); + .border-radius(6px); + .box-shadow(0 5px 10px rgba(0,0,0,.2)); + + // Offset the popover to account for the popover arrow + &.top { margin-bottom: 10px; } + &.right { margin-left: 10px; } + &.bottom { margin-top: 10px; } + &.left { margin-right: 10px; } + +} + +.popover-title { + margin: 0; // reset heading margin + padding: 8px 14px; + font-size: 14px; + font-weight: normal; + line-height: 18px; + background-color: @popoverTitleBackground; + border-bottom: 1px solid darken(@popoverTitleBackground, 5%); + .border-radius(5px 5px 0 0); +} + +.popover-content { + padding: 9px 14px; + p, ul, ol { + margin-bottom: 0; + } +} + +// Arrows +.popover .arrow, +.popover .arrow:after { + position: absolute; + display: inline-block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.popover .arrow:after { + content: ""; + z-index: -1; +} + +.popover { + &.top .arrow { + bottom: -@popoverArrowWidth; + left: 50%; + margin-left: -@popoverArrowWidth; + border-width: @popoverArrowWidth @popoverArrowWidth 0; + border-top-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth 0; + border-top-color: @popoverArrowOuterColor; + bottom: -1px; + left: -@popoverArrowOuterWidth; + } + } + &.right .arrow { + top: 50%; + left: -@popoverArrowWidth; + margin-top: -@popoverArrowWidth; + border-width: @popoverArrowWidth @popoverArrowWidth @popoverArrowWidth 0; + border-right-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth @popoverArrowOuterWidth 0; + border-right-color: @popoverArrowOuterColor; + bottom: -@popoverArrowOuterWidth; + left: -1px; + } + } + &.bottom .arrow { + top: -@popoverArrowWidth; + left: 50%; + margin-left: -@popoverArrowWidth; + border-width: 0 @popoverArrowWidth @popoverArrowWidth; + border-bottom-color: @popoverArrowColor; + &:after { + border-width: 0 @popoverArrowOuterWidth @popoverArrowOuterWidth; + border-bottom-color: @popoverArrowOuterColor; + top: -1px; + left: -@popoverArrowOuterWidth; + } + } + &.left .arrow { + top: 50%; + right: -@popoverArrowWidth; + margin-top: -@popoverArrowWidth; + border-width: @popoverArrowWidth 0 @popoverArrowWidth @popoverArrowWidth; + border-left-color: @popoverArrowColor; + &:after { + border-width: @popoverArrowOuterWidth 0 @popoverArrowOuterWidth @popoverArrowOuterWidth; + border-left-color: @popoverArrowOuterColor; + bottom: -@popoverArrowOuterWidth; + right: -1px; + } + } +} diff --git a/examples/container/css/bootstrap/progress-bars.less b/examples/container/css/bootstrap/progress-bars.less new file mode 100644 index 00000000..0486371a --- /dev/null +++ b/examples/container/css/bootstrap/progress-bars.less @@ -0,0 +1,122 @@ +// +// Progress bars +// -------------------------------------------------- + + +// ANIMATIONS +// ---------- + +// Webkit +@-webkit-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// Firefox +@-moz-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// IE9 +@-ms-keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + +// Opera +@-o-keyframes progress-bar-stripes { + from { background-position: 0 0; } + to { background-position: 40px 0; } +} + +// Spec +@keyframes progress-bar-stripes { + from { background-position: 40px 0; } + to { background-position: 0 0; } +} + + + +// THE BARS +// -------- + +// Outer container +.progress { + overflow: hidden; + height: @baseLineHeight; + margin-bottom: @baseLineHeight; + #gradient > .vertical(#f5f5f5, #f9f9f9); + .box-shadow(inset 0 1px 2px rgba(0,0,0,.1)); + .border-radius(4px); +} + +// Bar of progress +.progress .bar { + width: 0%; + height: 100%; + color: @white; + float: left; + font-size: 12px; + text-align: center; + text-shadow: 0 -1px 0 rgba(0,0,0,.25); + #gradient > .vertical(#149bdf, #0480be); + .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15)); + .box-sizing(border-box); + .transition(width .6s ease); +} +.progress .bar + .bar { + .box-shadow(inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15)); +} + +// Striped bars +.progress-striped .bar { + #gradient > .striped(#149bdf); + .background-size(40px 40px); +} + +// Call animation for the active one +.progress.active .bar { + -webkit-animation: progress-bar-stripes 2s linear infinite; + -moz-animation: progress-bar-stripes 2s linear infinite; + -ms-animation: progress-bar-stripes 2s linear infinite; + -o-animation: progress-bar-stripes 2s linear infinite; + animation: progress-bar-stripes 2s linear infinite; +} + + + +// COLORS +// ------ + +// Danger (red) +.progress-danger .bar, .progress .bar-danger { + #gradient > .vertical(#ee5f5b, #c43c35); +} +.progress-danger.progress-striped .bar, .progress-striped .bar-danger { + #gradient > .striped(#ee5f5b); +} + +// Success (green) +.progress-success .bar, .progress .bar-success { + #gradient > .vertical(#62c462, #57a957); +} +.progress-success.progress-striped .bar, .progress-striped .bar-success { + #gradient > .striped(#62c462); +} + +// Info (teal) +.progress-info .bar, .progress .bar-info { + #gradient > .vertical(#5bc0de, #339bb9); +} +.progress-info.progress-striped .bar, .progress-striped .bar-info { + #gradient > .striped(#5bc0de); +} + +// Warning (orange) +.progress-warning .bar, .progress .bar-warning { + #gradient > .vertical(lighten(@orange, 15%), @orange); +} +.progress-warning.progress-striped .bar, .progress-striped .bar-warning { + #gradient > .striped(lighten(@orange, 15%)); +} diff --git a/examples/container/css/bootstrap/reset.less b/examples/container/css/bootstrap/reset.less new file mode 100644 index 00000000..2901a85c --- /dev/null +++ b/examples/container/css/bootstrap/reset.less @@ -0,0 +1,137 @@ +// +// Modals +// Adapted from http://github.com/necolas/normalize.css +// -------------------------------------------------- + + +// Display in IE6-9 and FF3 +// ------------------------- + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section { + display: block; +} + +// Display block in IE6-9 and FF3 +// ------------------------- + +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} + +// Prevents modern browsers from displaying 'audio' without controls +// ------------------------- + +audio:not([controls]) { + display: none; +} + +// Base settings +// ------------------------- + +html { + font-size: 100%; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +// Focus states +a:focus { + .tab-focus(); +} +// Hover & Active +a:hover, +a:active { + outline: 0; +} + +// Prevents sub and sup affecting line-height in all browsers +// ------------------------- + +sub, +sup { + position: relative; + font-size: 75%; + line-height: 0; + vertical-align: baseline; +} +sup { + top: -0.5em; +} +sub { + bottom: -0.25em; +} + +// Img border in a's and image quality +// ------------------------- + +img { + /* Responsive images (ensure images don't scale beyond their parents) */ + max-width: 100%; /* Part 1: Set a maxium relative to the parent */ + width: auto\9; /* IE7-8 need help adjusting responsive images */ + height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */ + + vertical-align: middle; + border: 0; + -ms-interpolation-mode: bicubic; +} + +// Prevent max-width from affecting Google Maps +#map_canvas img { + max-width: none; +} + +// Forms +// ------------------------- + +// Font size in all browsers, margin changes, misc consistency +button, +input, +select, +textarea { + margin: 0; + font-size: 100%; + vertical-align: middle; +} +button, +input { + *overflow: visible; // Inner spacing ie IE6/7 + line-height: normal; // FF3/4 have !important on line-height in UA stylesheet +} +button::-moz-focus-inner, +input::-moz-focus-inner { // Inner padding and border oddities in FF3/4 + padding: 0; + border: 0; +} +button, +input[type="button"], +input[type="reset"], +input[type="submit"] { + cursor: pointer; // Cursors on all buttons applied consistently + -webkit-appearance: button; // Style clickable inputs in iOS +} +input[type="search"] { // Appearance in Safari/Chrome + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-appearance: textfield; +} +input[type="search"]::-webkit-search-decoration, +input[type="search"]::-webkit-search-cancel-button { + -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5 +} +textarea { + overflow: auto; // Remove vertical scrollbar in IE6-9 + vertical-align: top; // Readability and alignment cross-browser +} diff --git a/examples/container/css/bootstrap/responsive-1200px-min.less b/examples/container/css/bootstrap/responsive-1200px-min.less new file mode 100644 index 00000000..4f35ba6c --- /dev/null +++ b/examples/container/css/bootstrap/responsive-1200px-min.less @@ -0,0 +1,28 @@ +// +// Responsive: Large desktop and up +// -------------------------------------------------- + + +@media (min-width: 1200px) { + + // Fixed grid + #grid > .core(@gridColumnWidth1200, @gridGutterWidth1200); + + // Fluid grid + #grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200); + + // Input grid + #grid > .input(@gridColumnWidth1200, @gridGutterWidth1200); + + // Thumbnails + .thumbnails { + margin-left: -@gridGutterWidth1200; + } + .thumbnails > li { + margin-left: @gridGutterWidth1200; + } + .row-fluid .thumbnails { + margin-left: 0; + } + +} diff --git a/examples/container/css/bootstrap/responsive-767px-max.less b/examples/container/css/bootstrap/responsive-767px-max.less new file mode 100644 index 00000000..79c7eaa8 --- /dev/null +++ b/examples/container/css/bootstrap/responsive-767px-max.less @@ -0,0 +1,174 @@ +// +// Responsive: Landscape phone to desktop/tablet +// -------------------------------------------------- + + +@media (max-width: 767px) { + + // Padding to set content in a bit + body { + padding-left: 20px; + padding-right: 20px; + } + // Negative indent the now static "fixed" navbar + .navbar-fixed-top, + .navbar-fixed-bottom, + .navbar-static-top { + margin-left: -20px; + margin-right: -20px; + } + // Remove padding on container given explicit padding set on body + .container-fluid { + padding: 0; + } + + // TYPOGRAPHY + // ---------- + // Reset horizontal dl + .dl-horizontal { + dt { + float: none; + clear: none; + width: auto; + text-align: left; + } + dd { + margin-left: 0; + } + } + + // GRID & CONTAINERS + // ----------------- + // Remove width from containers + .container { + width: auto; + } + // Fluid rows + .row-fluid { + width: 100%; + } + // Undo negative margin on rows and thumbnails + .row, + .thumbnails { + margin-left: 0; + } + .thumbnails > li { + float: none; + margin-left: 0; // Reset the default margin for all li elements when no .span* classes are present + } + // Make all grid-sized elements block level again + [class*="span"], + .row-fluid [class*="span"] { + float: none; + display: block; + width: 100%; + margin-left: 0; + .box-sizing(border-box); + } + .span12, + .row-fluid .span12 { + width: 100%; + .box-sizing(border-box); + } + + // FORM FIELDS + // ----------- + // Make span* classes full width + .input-large, + .input-xlarge, + .input-xxlarge, + input[class*="span"], + select[class*="span"], + textarea[class*="span"], + .uneditable-input { + .input-block-level(); + } + // But don't let it screw up prepend/append inputs + .input-prepend input, + .input-append input, + .input-prepend input[class*="span"], + .input-append input[class*="span"] { + display: inline-block; // redeclare so they don't wrap to new lines + width: auto; + } + .controls-row [class*="span"] + [class*="span"] { + margin-left: 0; + } + + // Modals + .modal { + position: fixed; + top: 20px; + left: 20px; + right: 20px; + width: auto; + margin: 0; + &.fade.in { top: auto; } + } + +} + + + +// UP TO LANDSCAPE PHONE +// --------------------- + +@media (max-width: 480px) { + + // Smooth out the collapsing/expanding nav + .nav-collapse { + -webkit-transform: translate3d(0, 0, 0); // activate the GPU + } + + // Block level the page header small tag for readability + .page-header h1 small { + display: block; + line-height: @baseLineHeight; + } + + // Update checkboxes for iOS + input[type="checkbox"], + input[type="radio"] { + border: 1px solid #ccc; + } + + // Remove the horizontal form styles + .form-horizontal { + .control-label { + float: none; + width: auto; + padding-top: 0; + text-align: left; + } + // Move over all input controls and content + .controls { + margin-left: 0; + } + // Move the options list down to align with labels + .control-list { + padding-top: 0; // has to be padding because margin collaspes + } + // Move over buttons in .form-actions to align with .controls + .form-actions { + padding-left: 10px; + padding-right: 10px; + } + } + + // Modals + .modal { + top: 10px; + left: 10px; + right: 10px; + } + .modal-header .close { + padding: 10px; + margin: -10px; + } + + // Carousel + .carousel-caption { + position: static; + } + +} diff --git a/examples/container/css/bootstrap/responsive-768px-979px.less b/examples/container/css/bootstrap/responsive-768px-979px.less new file mode 100644 index 00000000..8e8c486a --- /dev/null +++ b/examples/container/css/bootstrap/responsive-768px-979px.less @@ -0,0 +1,19 @@ +// +// Responsive: Tablet to desktop +// -------------------------------------------------- + + +@media (min-width: 768px) and (max-width: 979px) { + + // Fixed grid + #grid > .core(@gridColumnWidth768, @gridGutterWidth768); + + // Fluid grid + #grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768); + + // Input grid + #grid > .input(@gridColumnWidth768, @gridGutterWidth768); + + // No need to reset .thumbnails here since it's the same @gridGutterWidth + +} diff --git a/examples/container/css/bootstrap/responsive-navbar.less b/examples/container/css/bootstrap/responsive-navbar.less new file mode 100644 index 00000000..c454dd5e --- /dev/null +++ b/examples/container/css/bootstrap/responsive-navbar.less @@ -0,0 +1,177 @@ +// +// Responsive: Navbar +// -------------------------------------------------- + + +// TABLETS AND BELOW +// ----------------- +@media (max-width: @navbarCollapseWidth) { + + // UNFIX THE TOPBAR + // ---------------- + // Remove any padding from the body + body { + padding-top: 0; + } + // Unfix the navbars + .navbar-fixed-top, + .navbar-fixed-bottom { + position: static; + } + .navbar-fixed-top { + margin-bottom: @baseLineHeight; + } + .navbar-fixed-bottom { + margin-top: @baseLineHeight; + } + .navbar-fixed-top .navbar-inner, + .navbar-fixed-bottom .navbar-inner { + padding: 5px; + } + .navbar .container { + width: auto; + padding: 0; + } + // Account for brand name + .navbar .brand { + padding-left: 10px; + padding-right: 10px; + margin: 0 0 0 -5px; + } + + // COLLAPSIBLE NAVBAR + // ------------------ + // Nav collapse clears brand + .nav-collapse { + clear: both; + } + // Block-level the nav + .nav-collapse .nav { + float: none; + margin: 0 0 (@baseLineHeight / 2); + } + .nav-collapse .nav > li { + float: none; + } + .nav-collapse .nav > li > a { + margin-bottom: 2px; + } + .nav-collapse .nav > .divider-vertical { + display: none; + } + .nav-collapse .nav .nav-header { + color: @navbarText; + text-shadow: none; + } + // Nav and dropdown links in navbar + .nav-collapse .nav > li > a, + .nav-collapse .dropdown-menu a { + padding: 9px 15px; + font-weight: bold; + color: @navbarLinkColor; + .border-radius(3px); + } + // Buttons + .nav-collapse .btn { + padding: 4px 10px 4px; + font-weight: normal; + .border-radius(4px); + } + .nav-collapse .dropdown-menu li + li a { + margin-bottom: 2px; + } + .nav-collapse .nav > li > a:hover, + .nav-collapse .dropdown-menu a:hover { + background-color: @navbarBackground; + } + .navbar-inverse .nav-collapse .nav > li > a:hover, + .navbar-inverse .nav-collapse .dropdown-menu a:hover { + background-color: @navbarInverseBackground; + } + // Buttons in the navbar + .nav-collapse.in .btn-group { + margin-top: 5px; + padding: 0; + } + // Dropdowns in the navbar + .nav-collapse .dropdown-menu { + position: static; + top: auto; + left: auto; + float: none; + display: block; + max-width: none; + margin: 0 15px; + padding: 0; + background-color: transparent; + border: none; + .border-radius(0); + .box-shadow(none); + } + .nav-collapse .dropdown-menu:before, + .nav-collapse .dropdown-menu:after { + display: none; + } + .nav-collapse .dropdown-menu .divider { + display: none; + } + .nav-collapse .nav > li > .dropdown-menu { + &:before, + &:after { + display: none; + } + } + // Forms in navbar + .nav-collapse .navbar-form, + .nav-collapse .navbar-search { + float: none; + padding: (@baseLineHeight / 2) 15px; + margin: (@baseLineHeight / 2) 0; + border-top: 1px solid @navbarBackground; + border-bottom: 1px solid @navbarBackground; + .box-shadow(inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1)); + } + .navbar-inverse .nav-collapse .navbar-form, + .navbar-inverse .nav-collapse .navbar-search { + border-top-color: @navbarInverseBackground; + border-bottom-color: @navbarInverseBackground; + } + // Pull right (secondary) nav content + .navbar .nav-collapse .nav.pull-right { + float: none; + margin-left: 0; + } + // Hide everything in the navbar save .brand and toggle button */ + .nav-collapse, + .nav-collapse.collapse { + overflow: hidden; + height: 0; + } + // Navbar button + .navbar .btn-navbar { + display: block; + } + + // STATIC NAVBAR + // ------------- + .navbar-static .navbar-inner { + padding-left: 10px; + padding-right: 10px; + } + + +} + + +// DEFAULT DESKTOP +// --------------- + +@media (min-width: 980px) { + + // Required to make the collapsing navbar work on regular desktops + .nav-collapse.collapse { + height: auto !important; + overflow: visible !important; + } + +} diff --git a/examples/container/css/bootstrap/responsive-utilities.less b/examples/container/css/bootstrap/responsive-utilities.less new file mode 100644 index 00000000..2c3f6c15 --- /dev/null +++ b/examples/container/css/bootstrap/responsive-utilities.less @@ -0,0 +1,43 @@ +// +// Responsive: Utility classes +// -------------------------------------------------- + + +// Hide from screenreaders and browsers +// Credit: HTML5 Boilerplate +.hidden { + display: none; + visibility: hidden; +} + +// Visibility utilities + +// For desktops +.visible-phone { display: none !important; } +.visible-tablet { display: none !important; } +.hidden-phone { } +.hidden-tablet { } +.hidden-desktop { display: none !important; } +.visible-desktop { display: inherit !important; } + +// Tablets & small desktops only +@media (min-width: 768px) and (max-width: 979px) { + // Hide everything else + .hidden-desktop { display: inherit !important; } + .visible-desktop { display: none !important ; } + // Show + .visible-tablet { display: inherit !important; } + // Hide + .hidden-tablet { display: none !important; } +} + +// Phones only +@media (max-width: 767px) { + // Hide everything else + .hidden-desktop { display: inherit !important; } + .visible-desktop { display: none !important; } + // Show + .visible-phone { display: inherit !important; } // Use inherit to restore previous behavior + // Hide + .hidden-phone { display: none !important; } +} diff --git a/examples/container/css/bootstrap/responsive.less b/examples/container/css/bootstrap/responsive.less new file mode 100644 index 00000000..87b34708 --- /dev/null +++ b/examples/container/css/bootstrap/responsive.less @@ -0,0 +1,48 @@ +/*! + * Bootstrap Responsive v2.1.1 + * + * Copyright 2012 Twitter, Inc + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Designed and built with all the love in the world @twitter by @mdo and @fat. + */ + + +// Responsive.less +// For phone and tablet devices +// ------------------------------------------------------------- + + +// REPEAT VARIABLES & MIXINS +// ------------------------- +// Required since we compile the responsive stuff separately + +@import "variables.less"; // Modify this for custom colors, font-sizes, etc +@import "mixins.less"; + + +// RESPONSIVE CLASSES +// ------------------ + +@import "responsive-utilities.less"; + + +// MEDIA QUERIES +// ------------------ + +// Large desktops +@import "responsive-1200px-min.less"; + +// Tablets to regular desktops +@import "responsive-768px-979px.less"; + +// Phones to portrait tablets and narrow desktops +@import "responsive-767px-max.less"; + + +// RESPONSIVE NAVBAR +// ------------------ + +// From 979px and below, show a button to toggle navbar contents +@import "responsive-navbar.less"; diff --git a/examples/container/css/bootstrap/scaffolding.less b/examples/container/css/bootstrap/scaffolding.less new file mode 100644 index 00000000..7a7496a6 --- /dev/null +++ b/examples/container/css/bootstrap/scaffolding.less @@ -0,0 +1,52 @@ +// +// Scaffolding +// -------------------------------------------------- + + +// Body reset +// ------------------------- + +body { + margin: 0; + font-family: @baseFontFamily; + font-size: @baseFontSize; + line-height: @baseLineHeight; + color: @textColor; + background-color: @bodyBackground; +} + + +// Links +// ------------------------- + +a { + color: @linkColor; + text-decoration: none; +} +a:hover { + color: @linkColorHover; + text-decoration: underline; +} + + +// Images +// ------------------------- + +// Rounded corners +.img-rounded { + .border-radius(6px); +} + +// Add polaroid-esque trim +.img-polaroid { + padding: 4px; + background-color: #fff; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.2); + .box-shadow(0 1px 3px rgba(0,0,0,.1)); +} + +// Perfect circle +.img-circle { + .border-radius(500px); // crank the border-radius so it works with most reasonably sized images +} diff --git a/examples/container/css/bootstrap/sprites.less b/examples/container/css/bootstrap/sprites.less new file mode 100644 index 00000000..9bf970fa --- /dev/null +++ b/examples/container/css/bootstrap/sprites.less @@ -0,0 +1,193 @@ +// +// Sprites +// -------------------------------------------------- + + +// ICONS +// ----- + +// All icons receive the styles of the tag with a base class +// of .i and are then given a unique class to add width, height, +// and background-position. Your resulting HTML will look like +// . + +// For the white version of the icons, just add the .icon-white class: +// + +[class^="icon-"], +[class*=" icon-"] { + display: inline-block; + width: 14px; + height: 14px; + .ie7-restore-right-whitespace(); + line-height: 14px; + vertical-align: text-top; + background-image: url("@{iconSpritePath}"); + background-position: 14px 14px; + background-repeat: no-repeat; + margin-top: 1px; +} + +/* White icons with optional class, or on hover/active states of certain elements */ +.icon-white, +.nav-tabs > .active > a > [class^="icon-"], +.nav-tabs > .active > a > [class*=" icon-"], +.nav-pills > .active > a > [class^="icon-"], +.nav-pills > .active > a > [class*=" icon-"], +.nav-list > .active > a > [class^="icon-"], +.nav-list > .active > a > [class*=" icon-"], +.navbar-inverse .nav > .active > a > [class^="icon-"], +.navbar-inverse .nav > .active > a > [class*=" icon-"], +.dropdown-menu > li > a:hover > [class^="icon-"], +.dropdown-menu > li > a:hover > [class*=" icon-"], +.dropdown-menu > .active > a > [class^="icon-"], +.dropdown-menu > .active > a > [class*=" icon-"] { + background-image: url("@{iconWhiteSpritePath}"); +} + +.icon-glass { background-position: 0 0; } +.icon-music { background-position: -24px 0; } +.icon-search { background-position: -48px 0; } +.icon-envelope { background-position: -72px 0; } +.icon-heart { background-position: -96px 0; } +.icon-star { background-position: -120px 0; } +.icon-star-empty { background-position: -144px 0; } +.icon-user { background-position: -168px 0; } +.icon-film { background-position: -192px 0; } +.icon-th-large { background-position: -216px 0; } +.icon-th { background-position: -240px 0; } +.icon-th-list { background-position: -264px 0; } +.icon-ok { background-position: -288px 0; } +.icon-remove { background-position: -312px 0; } +.icon-zoom-in { background-position: -336px 0; } +.icon-zoom-out { background-position: -360px 0; } +.icon-off { background-position: -384px 0; } +.icon-signal { background-position: -408px 0; } +.icon-cog { background-position: -432px 0; } +.icon-trash { background-position: -456px 0; } + +.icon-home { background-position: 0 -24px; } +.icon-file { background-position: -24px -24px; } +.icon-time { background-position: -48px -24px; } +.icon-road { background-position: -72px -24px; } +.icon-download-alt { background-position: -96px -24px; } +.icon-download { background-position: -120px -24px; } +.icon-upload { background-position: -144px -24px; } +.icon-inbox { background-position: -168px -24px; } +.icon-play-circle { background-position: -192px -24px; } +.icon-repeat { background-position: -216px -24px; } +.icon-refresh { background-position: -240px -24px; } +.icon-list-alt { background-position: -264px -24px; } +.icon-lock { background-position: -287px -24px; } // 1px off +.icon-flag { background-position: -312px -24px; } +.icon-headphones { background-position: -336px -24px; } +.icon-volume-off { background-position: -360px -24px; } +.icon-volume-down { background-position: -384px -24px; } +.icon-volume-up { background-position: -408px -24px; } +.icon-qrcode { background-position: -432px -24px; } +.icon-barcode { background-position: -456px -24px; } + +.icon-tag { background-position: 0 -48px; } +.icon-tags { background-position: -25px -48px; } // 1px off +.icon-book { background-position: -48px -48px; } +.icon-bookmark { background-position: -72px -48px; } +.icon-print { background-position: -96px -48px; } +.icon-camera { background-position: -120px -48px; } +.icon-font { background-position: -144px -48px; } +.icon-bold { background-position: -167px -48px; } // 1px off +.icon-italic { background-position: -192px -48px; } +.icon-text-height { background-position: -216px -48px; } +.icon-text-width { background-position: -240px -48px; } +.icon-align-left { background-position: -264px -48px; } +.icon-align-center { background-position: -288px -48px; } +.icon-align-right { background-position: -312px -48px; } +.icon-align-justify { background-position: -336px -48px; } +.icon-list { background-position: -360px -48px; } +.icon-indent-left { background-position: -384px -48px; } +.icon-indent-right { background-position: -408px -48px; } +.icon-facetime-video { background-position: -432px -48px; } +.icon-picture { background-position: -456px -48px; } + +.icon-pencil { background-position: 0 -72px; } +.icon-map-marker { background-position: -24px -72px; } +.icon-adjust { background-position: -48px -72px; } +.icon-tint { background-position: -72px -72px; } +.icon-edit { background-position: -96px -72px; } +.icon-share { background-position: -120px -72px; } +.icon-check { background-position: -144px -72px; } +.icon-move { background-position: -168px -72px; } +.icon-step-backward { background-position: -192px -72px; } +.icon-fast-backward { background-position: -216px -72px; } +.icon-backward { background-position: -240px -72px; } +.icon-play { background-position: -264px -72px; } +.icon-pause { background-position: -288px -72px; } +.icon-stop { background-position: -312px -72px; } +.icon-forward { background-position: -336px -72px; } +.icon-fast-forward { background-position: -360px -72px; } +.icon-step-forward { background-position: -384px -72px; } +.icon-eject { background-position: -408px -72px; } +.icon-chevron-left { background-position: -432px -72px; } +.icon-chevron-right { background-position: -456px -72px; } + +.icon-plus-sign { background-position: 0 -96px; } +.icon-minus-sign { background-position: -24px -96px; } +.icon-remove-sign { background-position: -48px -96px; } +.icon-ok-sign { background-position: -72px -96px; } +.icon-question-sign { background-position: -96px -96px; } +.icon-info-sign { background-position: -120px -96px; } +.icon-screenshot { background-position: -144px -96px; } +.icon-remove-circle { background-position: -168px -96px; } +.icon-ok-circle { background-position: -192px -96px; } +.icon-ban-circle { background-position: -216px -96px; } +.icon-arrow-left { background-position: -240px -96px; } +.icon-arrow-right { background-position: -264px -96px; } +.icon-arrow-up { background-position: -289px -96px; } // 1px off +.icon-arrow-down { background-position: -312px -96px; } +.icon-share-alt { background-position: -336px -96px; } +.icon-resize-full { background-position: -360px -96px; } +.icon-resize-small { background-position: -384px -96px; } +.icon-plus { background-position: -408px -96px; } +.icon-minus { background-position: -433px -96px; } +.icon-asterisk { background-position: -456px -96px; } + +.icon-exclamation-sign { background-position: 0 -120px; } +.icon-gift { background-position: -24px -120px; } +.icon-leaf { background-position: -48px -120px; } +.icon-fire { background-position: -72px -120px; } +.icon-eye-open { background-position: -96px -120px; } +.icon-eye-close { background-position: -120px -120px; } +.icon-warning-sign { background-position: -144px -120px; } +.icon-plane { background-position: -168px -120px; } +.icon-calendar { background-position: -192px -120px; } +.icon-random { background-position: -216px -120px; width: 16px; } +.icon-comment { background-position: -240px -120px; } +.icon-magnet { background-position: -264px -120px; } +.icon-chevron-up { background-position: -288px -120px; } +.icon-chevron-down { background-position: -313px -119px; } // 1px, 1px off +.icon-retweet { background-position: -336px -120px; } +.icon-shopping-cart { background-position: -360px -120px; } +.icon-folder-close { background-position: -384px -120px; } +.icon-folder-open { background-position: -408px -120px; width: 16px; } +.icon-resize-vertical { background-position: -432px -119px; } // 1px, 1px off +.icon-resize-horizontal { background-position: -456px -118px; } // 1px, 2px off + +.icon-hdd { background-position: 0 -144px; } +.icon-bullhorn { background-position: -24px -144px; } +.icon-bell { background-position: -48px -144px; } +.icon-certificate { background-position: -72px -144px; } +.icon-thumbs-up { background-position: -96px -144px; } +.icon-thumbs-down { background-position: -120px -144px; } +.icon-hand-right { background-position: -144px -144px; } +.icon-hand-left { background-position: -168px -144px; } +.icon-hand-up { background-position: -192px -144px; } +.icon-hand-down { background-position: -216px -144px; } +.icon-circle-arrow-right { background-position: -240px -144px; } +.icon-circle-arrow-left { background-position: -264px -144px; } +.icon-circle-arrow-up { background-position: -288px -144px; } +.icon-circle-arrow-down { background-position: -312px -144px; } +.icon-globe { background-position: -336px -144px; } +.icon-wrench { background-position: -360px -144px; } +.icon-tasks { background-position: -384px -144px; } +.icon-filter { background-position: -408px -144px; } +.icon-briefcase { background-position: -432px -144px; } +.icon-fullscreen { background-position: -456px -144px; } diff --git a/examples/container/css/bootstrap/tables.less b/examples/container/css/bootstrap/tables.less new file mode 100644 index 00000000..13c37c6e --- /dev/null +++ b/examples/container/css/bootstrap/tables.less @@ -0,0 +1,245 @@ +// +// Tables +// -------------------------------------------------- + + +// BASE TABLES +// ----------------- + +table { + max-width: 100%; + background-color: @tableBackground; + border-collapse: collapse; + border-spacing: 0; +} + +// BASELINE STYLES +// --------------- + +.table { + width: 100%; + margin-bottom: @baseLineHeight; + // Cells + th, + td { + padding: 8px; + line-height: @baseLineHeight; + text-align: left; + vertical-align: top; + border-top: 1px solid @tableBorder; + } + th { + font-weight: bold; + } + // Bottom align for column headings + thead th { + vertical-align: bottom; + } + // Remove top border from thead by default + caption + thead tr:first-child th, + caption + thead tr:first-child td, + colgroup + thead tr:first-child th, + colgroup + thead tr:first-child td, + thead:first-child tr:first-child th, + thead:first-child tr:first-child td { + border-top: 0; + } + // Account for multiple tbody instances + tbody + tbody { + border-top: 2px solid @tableBorder; + } +} + + + +// CONDENSED TABLE W/ HALF PADDING +// ------------------------------- + +.table-condensed { + th, + td { + padding: 4px 5px; + } +} + + +// BORDERED VERSION +// ---------------- + +.table-bordered { + border: 1px solid @tableBorder; + border-collapse: separate; // Done so we can round those corners! + *border-collapse: collapse; // IE7 can't round corners anyway + border-left: 0; + .border-radius(4px); + th, + td { + border-left: 1px solid @tableBorder; + } + // Prevent a double border + caption + thead tr:first-child th, + caption + tbody tr:first-child th, + caption + tbody tr:first-child td, + colgroup + thead tr:first-child th, + colgroup + tbody tr:first-child th, + colgroup + tbody tr:first-child td, + thead:first-child tr:first-child th, + tbody:first-child tr:first-child th, + tbody:first-child tr:first-child td { + border-top: 0; + } + // For first th or td in the first row in the first thead or tbody + thead:first-child tr:first-child th:first-child, + tbody:first-child tr:first-child td:first-child { + -webkit-border-top-left-radius: 4px; + border-top-left-radius: 4px; + -moz-border-radius-topleft: 4px; + } + thead:first-child tr:first-child th:last-child, + tbody:first-child tr:first-child td:last-child { + -webkit-border-top-right-radius: 4px; + border-top-right-radius: 4px; + -moz-border-radius-topright: 4px; + } + // For first th or td in the first row in the first thead or tbody + thead:last-child tr:last-child th:first-child, + tbody:last-child tr:last-child td:first-child, + tfoot:last-child tr:last-child td:first-child { + .border-radius(0 0 0 4px); + -webkit-border-bottom-left-radius: 4px; + border-bottom-left-radius: 4px; + -moz-border-radius-bottomleft: 4px; + } + thead:last-child tr:last-child th:last-child, + tbody:last-child tr:last-child td:last-child, + tfoot:last-child tr:last-child td:last-child { + -webkit-border-bottom-right-radius: 4px; + border-bottom-right-radius: 4px; + -moz-border-radius-bottomright: 4px; + } + + // Special fixes to round the left border on the first td/th + caption + thead tr:first-child th:first-child, + caption + tbody tr:first-child td:first-child, + colgroup + thead tr:first-child th:first-child, + colgroup + tbody tr:first-child td:first-child { + -webkit-border-top-left-radius: 4px; + border-top-left-radius: 4px; + -moz-border-radius-topleft: 4px; + } + caption + thead tr:first-child th:last-child, + caption + tbody tr:first-child td:last-child, + colgroup + thead tr:first-child th:last-child, + colgroup + tbody tr:first-child td:last-child { + -webkit-border-top-right-radius: 4px; + border-top-right-radius: 4px; + -moz-border-radius-topleft: 4px; + } + +} + + + + +// ZEBRA-STRIPING +// -------------- + +// Default zebra-stripe styles (alternating gray and transparent backgrounds) +.table-striped { + tbody { + tr:nth-child(odd) td, + tr:nth-child(odd) th { + background-color: @tableBackgroundAccent; + } + } +} + + +// HOVER EFFECT +// ------------ +// Placed here since it has to come after the potential zebra striping +.table-hover { + tbody { + tr:hover td, + tr:hover th { + background-color: @tableBackgroundHover; + } + } +} + + +// TABLE CELL SIZING +// ----------------- + +// Reset default grid behavior +table [class*=span], +.row-fluid table [class*=span] { + display: table-cell; + float: none; // undo default grid column styles + margin-left: 0; // undo default grid column styles +} + +// Change the column widths to account for td/th padding +.table { + .span1 { .tableColumns(1); } + .span2 { .tableColumns(2); } + .span3 { .tableColumns(3); } + .span4 { .tableColumns(4); } + .span5 { .tableColumns(5); } + .span6 { .tableColumns(6); } + .span7 { .tableColumns(7); } + .span8 { .tableColumns(8); } + .span9 { .tableColumns(9); } + .span10 { .tableColumns(10); } + .span11 { .tableColumns(11); } + .span12 { .tableColumns(12); } + .span13 { .tableColumns(13); } + .span14 { .tableColumns(14); } + .span15 { .tableColumns(15); } + .span16 { .tableColumns(16); } + .span17 { .tableColumns(17); } + .span18 { .tableColumns(18); } + .span19 { .tableColumns(19); } + .span20 { .tableColumns(20); } + .span21 { .tableColumns(21); } + .span22 { .tableColumns(22); } + .span23 { .tableColumns(23); } + .span24 { .tableColumns(24); } +} + + + +// TABLE BACKGROUNDS +// ----------------- +// Exact selectors below required to override .table-striped + +.table tbody tr { + &.success td { + background-color: @successBackground; + } + &.error td { + background-color: @errorBackground; + } + &.warning td { + background-color: @warningBackground; + } + &.info td { + background-color: @infoBackground; + } +} + +// Hover states for .table-hover +.table-hover tbody tr { + &.success:hover td { + background-color: darken(@successBackground, 5%); + } + &.error:hover td { + background-color: darken(@errorBackground, 5%); + } + &.warning:hover td { + background-color: darken(@warningBackground, 5%); + } + &.info:hover td { + background-color: darken(@infoBackground, 5%); + } +} diff --git a/examples/container/css/bootstrap/thumbnails.less b/examples/container/css/bootstrap/thumbnails.less new file mode 100644 index 00000000..91b75f78 --- /dev/null +++ b/examples/container/css/bootstrap/thumbnails.less @@ -0,0 +1,52 @@ +// +// Thumbnails +// -------------------------------------------------- + + +// Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files + +// Make wrapper ul behave like the grid +.thumbnails { + margin-left: -@gridGutterWidth; + list-style: none; + .clearfix(); +} +// Fluid rows have no left margin +.row-fluid .thumbnails { + margin-left: 0; +} + +// Float li to make thumbnails appear in a row +.thumbnails > li { + float: left; // Explicity set the float since we don't require .span* classes + margin-bottom: @baseLineHeight; + margin-left: @gridGutterWidth; +} + +// The actual thumbnail (can be `a` or `div`) +.thumbnail { + display: block; + padding: 4px; + line-height: @baseLineHeight; + border: 1px solid #ddd; + .border-radius(4px); + .box-shadow(0 1px 3px rgba(0,0,0,.055)); + .transition(all .2s ease-in-out); +} +// Add a hover state for linked versions only +a.thumbnail:hover { + border-color: @linkColor; + .box-shadow(0 1px 4px rgba(0,105,214,.25)); +} + +// Images and captions +.thumbnail > img { + display: block; + max-width: 100%; + margin-left: auto; + margin-right: auto; +} +.thumbnail .caption { + padding: 9px; + color: @gray; +} diff --git a/examples/container/css/bootstrap/tooltip.less b/examples/container/css/bootstrap/tooltip.less new file mode 100644 index 00000000..fba1856f --- /dev/null +++ b/examples/container/css/bootstrap/tooltip.less @@ -0,0 +1,70 @@ +// +// Tooltips +// -------------------------------------------------- + + +// Base class +.tooltip { + position: absolute; + z-index: @zindexTooltip; + display: block; + visibility: visible; + padding: 5px; + font-size: 11px; + .opacity(0); + &.in { .opacity(80); } + &.top { margin-top: -3px; } + &.right { margin-left: 3px; } + &.bottom { margin-top: 3px; } + &.left { margin-left: -3px; } +} + +// Wrapper for the tooltip content +.tooltip-inner { + max-width: 200px; + padding: 3px 8px; + color: @tooltipColor; + text-align: center; + text-decoration: none; + background-color: @tooltipBackground; + .border-radius(4px); +} + +// Arrows +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.tooltip { + &.top .tooltip-arrow { + bottom: 0; + left: 50%; + margin-left: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth @tooltipArrowWidth 0; + border-top-color: @tooltipArrowColor; + } + &.right .tooltip-arrow { + top: 50%; + left: 0; + margin-top: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth @tooltipArrowWidth @tooltipArrowWidth 0; + border-right-color: @tooltipArrowColor; + } + &.left .tooltip-arrow { + top: 50%; + right: 0; + margin-top: -@tooltipArrowWidth; + border-width: @tooltipArrowWidth 0 @tooltipArrowWidth @tooltipArrowWidth; + border-left-color: @tooltipArrowColor; + } + &.bottom .tooltip-arrow { + top: 0; + left: 50%; + margin-left: -@tooltipArrowWidth; + border-width: 0 @tooltipArrowWidth @tooltipArrowWidth; + border-bottom-color: @tooltipArrowColor; + } +} diff --git a/examples/container/css/bootstrap/type.less b/examples/container/css/bootstrap/type.less new file mode 100644 index 00000000..2e0f386e --- /dev/null +++ b/examples/container/css/bootstrap/type.less @@ -0,0 +1,221 @@ +// +// Typography +// -------------------------------------------------- + + +// Body text +// ------------------------- + +p { + margin: 0 0 @baseLineHeight / 2; +} +.lead { + margin-bottom: @baseLineHeight; + font-size: @baseFontSize * 1.5; + font-weight: 200; + line-height: @baseLineHeight * 1.5; +} + + +// Emphasis & misc +// ------------------------- + +small { + font-size: 85%; // Ex: 14px base font * 85% = about 12px +} +strong { + font-weight: bold; +} +em { + font-style: italic; +} +cite { + font-style: normal; +} + +// Utility classes +.muted { + color: @grayLight; +} +.text-warning { + color: @warningText; +} +.text-error { + color: @errorText; +} +.text-info { + color: @infoText; +} +.text-success { + color: @successText; +} + + +// Headings +// ------------------------- + +h1, h2, h3, h4, h5, h6 { + margin: (@baseLineHeight / 2) 0; + font-family: @headingsFontFamily; + font-weight: @headingsFontWeight; + line-height: 1; + color: @headingsColor; + text-rendering: optimizelegibility; // Fix the character spacing for headings + small { + font-weight: normal; + line-height: 1; + color: @grayLight; + } +} +h1 { font-size: 36px; line-height: 40px; } +h2 { font-size: 30px; line-height: 40px; } +h3 { font-size: 24px; line-height: 40px; } +h4 { font-size: 18px; line-height: 20px; } +h5 { font-size: 14px; line-height: 20px; } +h6 { font-size: 12px; line-height: 20px; } + +h1 small { font-size: 24px; } +h2 small { font-size: 18px; } +h3 small { font-size: 14px; } +h4 small { font-size: 14px; } + + +// Page header +// ------------------------- + +.page-header { + padding-bottom: (@baseLineHeight / 2) - 1; + margin: @baseLineHeight 0 (@baseLineHeight * 1.5); + border-bottom: 1px solid @grayLighter; +} + + + +// Lists +// -------------------------------------------------- + +// Unordered and Ordered lists +ul, ol { + padding: 0; + margin: 0 0 @baseLineHeight / 2 25px; +} +ul ul, +ul ol, +ol ol, +ol ul { + margin-bottom: 0; +} +li { + line-height: @baseLineHeight; +} +ul.unstyled, +ol.unstyled { + margin-left: 0; + list-style: none; +} + +// Description Lists +dl { + margin-bottom: @baseLineHeight; +} +dt, +dd { + line-height: @baseLineHeight; +} +dt { + font-weight: bold; +} +dd { + margin-left: @baseLineHeight / 2; +} +// Horizontal layout (like forms) +.dl-horizontal { + .clearfix(); // Ensure dl clears floats if empty dd elements present + dt { + float: left; + width: @horizontalComponentOffset - 20; + clear: left; + text-align: right; + .text-overflow(); + } + dd { + margin-left: @horizontalComponentOffset; + } +} + +// MISC +// ---- + +// Horizontal rules +hr { + margin: @baseLineHeight 0; + border: 0; + border-top: 1px solid @hrBorder; + border-bottom: 1px solid @white; +} + +// Abbreviations and acronyms +abbr[title] { + cursor: help; + border-bottom: 1px dotted @grayLight; +} +abbr.initialism { + font-size: 90%; + text-transform: uppercase; +} + +// Blockquotes +blockquote { + padding: 0 0 0 15px; + margin: 0 0 @baseLineHeight; + border-left: 5px solid @grayLighter; + p { + margin-bottom: 0; + #font > .shorthand(16px,300,@baseLineHeight * 1.25); + } + small { + display: block; + line-height: @baseLineHeight; + color: @grayLight; + &:before { + content: '\2014 \00A0'; + } + } + + // Float right with text-align: right + &.pull-right { + float: right; + padding-right: 15px; + padding-left: 0; + border-right: 5px solid @grayLighter; + border-left: 0; + p, + small { + text-align: right; + } + small { + &:before { + content: ''; + } + &:after { + content: '\00A0 \2014'; + } + } + } +} + +// Quotes +q:before, +q:after, +blockquote:before, +blockquote:after { + content: ""; +} + +// Addresses +address { + display: block; + margin-bottom: @baseLineHeight; + font-style: normal; + line-height: @baseLineHeight; +} diff --git a/examples/container/css/bootstrap/utilities.less b/examples/container/css/bootstrap/utilities.less new file mode 100644 index 00000000..314b4ffd --- /dev/null +++ b/examples/container/css/bootstrap/utilities.less @@ -0,0 +1,30 @@ +// +// Utility classes +// -------------------------------------------------- + + +// Quick floats +.pull-right { + float: right; +} +.pull-left { + float: left; +} + +// Toggling content +.hide { + display: none; +} +.show { + display: block; +} + +// Visibility +.invisible { + visibility: hidden; +} + +// For Affix plugin +.affix { + position: fixed; +} diff --git a/examples/container/css/bootstrap/variables.less b/examples/container/css/bootstrap/variables.less new file mode 100644 index 00000000..7d6efe00 --- /dev/null +++ b/examples/container/css/bootstrap/variables.less @@ -0,0 +1,279 @@ +// +// Variables +// -------------------------------------------------- + + +// Global values +// -------------------------------------------------- + + +// Grays +// ------------------------- +@black: #000; +@grayDarker: #222; +@grayDark: #333; +@gray: #555; +@grayLight: #999; +@grayLighter: #eee; +@white: #fff; + + +// Accent colors +// ------------------------- +@blue: #049cdb; +@blueDark: #0064cd; +@green: #46a546; +@red: #9d261d; +@yellow: #ffc40d; +@orange: #f89406; +@pink: #c3325f; +@purple: #7a43b6; + + +// Scaffolding +// ------------------------- +@bodyBackground: @white; +@textColor: @grayDark; + + +// Links +// ------------------------- +@linkColor: #08c; +@linkColorHover: darken(@linkColor, 15%); + + +// Typography +// ------------------------- +@sansFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; +@serifFontFamily: Georgia, "Times New Roman", Times, serif; +@monoFontFamily: Monaco, Menlo, Consolas, "Courier New", monospace; + +@baseFontSize: 14px; +@baseFontFamily: @sansFontFamily; +@baseLineHeight: 20px; +@altFontFamily: @serifFontFamily; + +@headingsFontFamily: inherit; // empty to use BS default, @baseFontFamily +@headingsFontWeight: bold; // instead of browser default, bold +@headingsColor: inherit; // empty to use BS default, @textColor + +// Tables +// ------------------------- +@tableBackground: transparent; // overall background-color +@tableBackgroundAccent: #f9f9f9; // for striping +@tableBackgroundHover: #f5f5f5; // for hover +@tableBorder: #ddd; // table and cell border + +// Buttons +// ------------------------- +@btnBackground: @white; +@btnBackgroundHighlight: darken(@white, 10%); +@btnBorder: #bbb; + +@btnPrimaryBackground: @linkColor; +@btnPrimaryBackgroundHighlight: spin(@btnPrimaryBackground, 20%); + +@btnInfoBackground: #5bc0de; +@btnInfoBackgroundHighlight: #2f96b4; + +@btnSuccessBackground: #62c462; +@btnSuccessBackgroundHighlight: #51a351; + +@btnWarningBackground: lighten(@orange, 15%); +@btnWarningBackgroundHighlight: @orange; + +@btnDangerBackground: #ee5f5b; +@btnDangerBackgroundHighlight: #bd362f; + +@btnInverseBackground: #444; +@btnInverseBackgroundHighlight: @grayDarker; + + +// Forms +// ------------------------- +@inputBackground: @white; +@inputBorder: #ccc; +@inputBorderRadius: 3px; +@inputDisabledBackground: @grayLighter; +@formActionsBackground: #f5f5f5; + +// Dropdowns +// ------------------------- +@dropdownBackground: @white; +@dropdownBorder: rgba(0,0,0,.2); +@dropdownDividerTop: #e5e5e5; +@dropdownDividerBottom: @white; + +@dropdownLinkColor: @grayDark; +@dropdownLinkColorHover: @white; +@dropdownLinkColorActive: @dropdownLinkColor; + +@dropdownLinkBackgroundActive: @linkColor; +@dropdownLinkBackgroundHover: @dropdownLinkBackgroundActive; + + + +// COMPONENT VARIABLES +// -------------------------------------------------- + +// Z-index master list +// ------------------------- +// Used for a bird's eye view of components dependent on the z-axis +// Try to avoid customizing these :) +@zindexDropdown: 1000; +@zindexPopover: 1010; +@zindexTooltip: 1030; +@zindexFixedNavbar: 1030; +@zindexModalBackdrop: 1040; +@zindexModal: 1050; + + +// Sprite icons path +// ------------------------- +@iconSpritePath: "../img/glyphicons-halflings.png"; +@iconWhiteSpritePath: "../img/glyphicons-halflings-white.png"; + + +// Input placeholder text color +// ------------------------- +@placeholderText: @grayLight; + + +// Hr border color +// ------------------------- +@hrBorder: @grayLighter; + + +// Horizontal forms & lists +// ------------------------- +@horizontalComponentOffset: 180px; + + +// Wells +// ------------------------- +@wellBackground: #f5f5f5; + + +// Navbar +// ------------------------- +@navbarCollapseWidth: 979px; + +@navbarHeight: 40px; +@navbarBackgroundHighlight: #ffffff; +@navbarBackground: darken(@navbarBackgroundHighlight, 5%); +@navbarBorder: darken(@navbarBackground, 12%); + +@navbarText: #777; +@navbarLinkColor: #777; +@navbarLinkColorHover: @grayDark; +@navbarLinkColorActive: @gray; +@navbarLinkBackgroundHover: transparent; +@navbarLinkBackgroundActive: darken(@navbarBackground, 5%); + +@navbarBrandColor: @navbarLinkColor; + +// Inverted navbar +@navbarInverseBackground: #111111; +@navbarInverseBackgroundHighlight: #222222; +@navbarInverseBorder: #252525; + +@navbarInverseText: @grayLight; +@navbarInverseLinkColor: @grayLight; +@navbarInverseLinkColorHover: @white; +@navbarInverseLinkColorActive: @navbarInverseLinkColorHover; +@navbarInverseLinkBackgroundHover: transparent; +@navbarInverseLinkBackgroundActive: @navbarInverseBackground; + +@navbarInverseSearchBackground: lighten(@navbarInverseBackground, 25%); +@navbarInverseSearchBackgroundFocus: @white; +@navbarInverseSearchBorder: @navbarInverseBackground; +@navbarInverseSearchPlaceholderColor: #ccc; + +@navbarInverseBrandColor: @navbarInverseLinkColor; + + +// Pagination +// ------------------------- +@paginationBackground: #fff; +@paginationBorder: #ddd; +@paginationActiveBackground: #f5f5f5; + + +// Hero unit +// ------------------------- +@heroUnitBackground: @grayLighter; +@heroUnitHeadingColor: inherit; +@heroUnitLeadColor: inherit; + + +// Form states and alerts +// ------------------------- +@warningText: #c09853; +@warningBackground: #fcf8e3; +@warningBorder: darken(spin(@warningBackground, -10), 3%); + +@errorText: #b94a48; +@errorBackground: #f2dede; +@errorBorder: darken(spin(@errorBackground, -10), 3%); + +@successText: #468847; +@successBackground: #dff0d8; +@successBorder: darken(spin(@successBackground, -10), 5%); + +@infoText: #3a87ad; +@infoBackground: #d9edf7; +@infoBorder: darken(spin(@infoBackground, -10), 7%); + + +// Tooltips and popovers +// ------------------------- +@tooltipColor: #fff; +@tooltipBackground: #000; +@tooltipArrowWidth: 5px; +@tooltipArrowColor: @tooltipBackground; + +@popoverBackground: #fff; +@popoverArrowWidth: 10px; +@popoverArrowColor: #fff; +@popoverTitleBackground: darken(@popoverBackground, 3%); + +// Special enhancement for popovers +@popoverArrowOuterWidth: @popoverArrowWidth + 1; +@popoverArrowOuterColor: rgba(0,0,0,.25); + + + +// GRID +// -------------------------------------------------- + + +// Default 940px grid +// ------------------------- +@gridColumns: 12; +@gridColumnWidth: 60px; +@gridGutterWidth: 20px; +@gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); + +// 1200px min +@gridColumnWidth1200: 70px; +@gridGutterWidth1200: 30px; +@gridRowWidth1200: (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1)); + +// 768px-979px +@gridColumnWidth768: 42px; +@gridGutterWidth768: 20px; +@gridRowWidth768: (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1)); + + +// Fluid grid +// ------------------------- +@fluidGridColumnWidth: percentage(@gridColumnWidth/@gridRowWidth); +@fluidGridGutterWidth: percentage(@gridGutterWidth/@gridRowWidth); + +// 1200px min +@fluidGridColumnWidth1200: percentage(@gridColumnWidth1200/@gridRowWidth1200); +@fluidGridGutterWidth1200: percentage(@gridGutterWidth1200/@gridRowWidth1200); + +// 768px-979px +@fluidGridColumnWidth768: percentage(@gridColumnWidth768/@gridRowWidth768); +@fluidGridGutterWidth768: percentage(@gridGutterWidth768/@gridRowWidth768); diff --git a/examples/container/css/bootstrap/wells.less b/examples/container/css/bootstrap/wells.less new file mode 100644 index 00000000..e4e0a9be --- /dev/null +++ b/examples/container/css/bootstrap/wells.less @@ -0,0 +1,29 @@ +// +// Wells +// -------------------------------------------------- + + +// Base class +.well { + min-height: 20px; + padding: 19px; + margin-bottom: 20px; + background-color: @wellBackground; + border: 1px solid darken(@wellBackground, 7%); + .border-radius(4px); + .box-shadow(inset 0 1px 1px rgba(0,0,0,.05)); + blockquote { + border-color: #ddd; + border-color: rgba(0,0,0,.15); + } +} + +// Sizes +.well-large { + padding: 24px; + .border-radius(6px); +} +.well-small { + padding: 9px; + .border-radius(3px); +} diff --git a/examples/container/css/container.css b/examples/container/css/container.css index 4f535c96..d109f3fa 100644 --- a/examples/container/css/container.css +++ b/examples/container/css/container.css @@ -1,3 +1,17 @@ +html { + font-size:100%; + -webkit-text-size-adjust:100%; + -ms-text-size-adjust:100%; +} +body { + margin:0; + font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; + font-size:14px; + line-height:20px; + color:#333333; + background-color:#ffffff; +} + body.example-page { padding-top:60px; font-size: 13px; diff --git a/examples/container/css/namespaced-css.less b/examples/container/css/namespaced-css.less new file mode 100644 index 00000000..06d56773 --- /dev/null +++ b/examples/container/css/namespaced-css.less @@ -0,0 +1,4 @@ +.f2-example-container { + @import "bootstrap/bootstrap.less"; + @import "bootstrap/responsive.less"; +} \ No newline at end of file diff --git a/examples/container/index.html b/examples/container/index.html index 1c6b21cd..76a53448 100644 --- a/examples/container/index.html +++ b/examples/container/index.html @@ -10,7 +10,7 @@ - + diff --git a/docs/sdk/classes/F2.AppManifest.html b/docs/sdk/classes/F2.AppManifest.html index fbc9480c..e8a5d391 100644 --- a/docs/sdk/classes/F2.AppManifest.html +++ b/docs/sdk/classes/F2.AppManifest.html @@ -3,7 +3,7 @@ F2 - F2.AppManifest - + @@ -528,7 +528,7 @@


    diff --git a/docs/sdk/classes/F2.Constants.Css.html b/docs/sdk/classes/F2.Constants.Css.html index fa784d2e..14dcb249 100644 --- a/docs/sdk/classes/F2.Constants.Css.html +++ b/docs/sdk/classes/F2.Constants.Css.html @@ -3,7 +3,7 @@ F2 - F2.Constants.Css - + @@ -760,7 +760,7 @@


    diff --git a/docs/sdk/classes/F2.Constants.Events.html b/docs/sdk/classes/F2.Constants.Events.html index f8cdcd2a..e9a9243d 100644 --- a/docs/sdk/classes/F2.Constants.Events.html +++ b/docs/sdk/classes/F2.Constants.Events.html @@ -3,7 +3,7 @@ F2 - F2.Constants.Events - + @@ -578,7 +578,7 @@


    diff --git a/docs/sdk/classes/F2.Constants.Sockets.html b/docs/sdk/classes/F2.Constants.Sockets.html index c9b4dfcd..c5a069d8 100644 --- a/docs/sdk/classes/F2.Constants.Sockets.html +++ b/docs/sdk/classes/F2.Constants.Sockets.html @@ -3,7 +3,7 @@ F2 - F2.Constants.Sockets - + @@ -616,7 +616,7 @@


    diff --git a/docs/sdk/classes/F2.Constants.Views.html b/docs/sdk/classes/F2.Constants.Views.html index 76000ebb..bbdbbe01 100644 --- a/docs/sdk/classes/F2.Constants.Views.html +++ b/docs/sdk/classes/F2.Constants.Views.html @@ -3,7 +3,7 @@ F2 - F2.Constants.Views - + @@ -674,7 +674,7 @@


    diff --git a/docs/sdk/classes/F2.Constants.html b/docs/sdk/classes/F2.Constants.html index 58140867..79a2e79f 100644 --- a/docs/sdk/classes/F2.Constants.html +++ b/docs/sdk/classes/F2.Constants.html @@ -3,7 +3,7 @@ F2 - F2.Constants - + @@ -281,7 +281,7 @@

    F2.Constants


    diff --git a/docs/sdk/classes/F2.ContainerConfig.UI.Mask.html b/docs/sdk/classes/F2.ContainerConfig.UI.Mask.html index 16a61248..3dec491a 100644 --- a/docs/sdk/classes/F2.ContainerConfig.UI.Mask.html +++ b/docs/sdk/classes/F2.ContainerConfig.UI.Mask.html @@ -3,7 +3,7 @@ F2 - F2.ContainerConfig.UI.Mask - + @@ -596,7 +596,7 @@


    diff --git a/docs/sdk/classes/F2.ContainerConfig.UI.html b/docs/sdk/classes/F2.ContainerConfig.UI.html index 4aa6a650..3a178d4e 100644 --- a/docs/sdk/classes/F2.ContainerConfig.UI.html +++ b/docs/sdk/classes/F2.ContainerConfig.UI.html @@ -3,7 +3,7 @@ F2 - F2.ContainerConfig.UI - + @@ -281,7 +281,7 @@

    F2.ContainerConfig.UI


    diff --git a/docs/sdk/classes/F2.ContainerConfig.html b/docs/sdk/classes/F2.ContainerConfig.html index b9545db7..e7234bb9 100644 --- a/docs/sdk/classes/F2.ContainerConfig.html +++ b/docs/sdk/classes/F2.ContainerConfig.html @@ -3,7 +3,7 @@ F2 - F2.ContainerConfig - + @@ -939,7 +939,7 @@


    diff --git a/docs/sdk/classes/F2.Events.html b/docs/sdk/classes/F2.Events.html index 78f9afb3..0d7d20de 100644 --- a/docs/sdk/classes/F2.Events.html +++ b/docs/sdk/classes/F2.Events.html @@ -3,7 +3,7 @@ F2 - F2.Events - + @@ -1180,7 +1180,7 @@

    Parameters:


    diff --git a/docs/sdk/classes/F2.Rpc.html b/docs/sdk/classes/F2.Rpc.html index 07317dce..b71212bd 100644 --- a/docs/sdk/classes/F2.Rpc.html +++ b/docs/sdk/classes/F2.Rpc.html @@ -3,7 +3,7 @@ F2 - F2.Rpc - + @@ -1680,7 +1680,7 @@

    Parameters:


    diff --git a/docs/sdk/classes/F2.UI.Modals.html b/docs/sdk/classes/F2.UI.Modals.html index b6971a8f..75ce39b1 100644 --- a/docs/sdk/classes/F2.UI.Modals.html +++ b/docs/sdk/classes/F2.UI.Modals.html @@ -3,7 +3,7 @@ F2 - F2.UI.Modals - + @@ -609,7 +609,7 @@

    Parameters:


    diff --git a/docs/sdk/classes/F2.UI.Views.html b/docs/sdk/classes/F2.UI.Views.html index c39bbdd2..8a1123e9 100644 --- a/docs/sdk/classes/F2.UI.Views.html +++ b/docs/sdk/classes/F2.UI.Views.html @@ -3,7 +3,7 @@ F2 - F2.UI.Views - + @@ -693,7 +693,7 @@

    Parameters:


    diff --git a/docs/sdk/classes/F2.UI.html b/docs/sdk/classes/F2.UI.html index b61d0935..0a5e6d0e 100644 --- a/docs/sdk/classes/F2.UI.html +++ b/docs/sdk/classes/F2.UI.html @@ -3,7 +3,7 @@ F2 - F2.UI - + @@ -1293,7 +1293,7 @@

    Parameters:


    diff --git a/docs/sdk/classes/F2.html b/docs/sdk/classes/F2.html index 9f36ddc7..fa8398bc 100644 --- a/docs/sdk/classes/F2.html +++ b/docs/sdk/classes/F2.html @@ -3,7 +3,7 @@ F2 - F2 - + @@ -1493,7 +1493,7 @@

    Defined in
    -
    sdk/src/container.js:270
    +
    sdk/src/container.js:275
    @@ -1788,7 +1788,7 @@

    Defined in
    -
    sdk/src/container.js:292
    +
    sdk/src/container.js:297
    @@ -2060,7 +2060,7 @@

    Defined in
    -
    sdk/src/container.js:307
    +
    sdk/src/container.js:312
    @@ -2139,7 +2139,7 @@

    Defined in
    -
    sdk/src/container.js:327
    +
    sdk/src/container.js:332
    @@ -2340,7 +2340,7 @@

    Defined in
    -
    sdk/src/container.js:245
    +
    sdk/src/container.js:250
    @@ -2670,7 +2670,7 @@

    Defined in
    -
    sdk/src/container.js:333
    +
    sdk/src/container.js:338
    @@ -2771,7 +2771,7 @@

    Defined in
    -
    sdk/src/container.js:470
    +
    sdk/src/container.js:475
    @@ -2837,7 +2837,7 @@

    Defined in
    -
    sdk/src/container.js:485
    +
    sdk/src/container.js:490
    @@ -3213,7 +3213,7 @@

    Example:


    diff --git a/docs/sdk/data.json b/docs/sdk/data.json index bf32752f..9d29260d 100644 --- a/docs/sdk/data.json +++ b/docs/sdk/data.json @@ -1416,7 +1416,7 @@ }, { "file": "sdk/src/container.js", - "line": 245, + "line": 250, "description": "Loads the app's html/css/javascript into an iframe", "itemtype": "method", "name": "loadSecureApp", @@ -1439,7 +1439,7 @@ }, { "file": "sdk/src/container.js", - "line": 270, + "line": 275, "description": "Checks if the app is valid", "itemtype": "method", "name": "_validateApp", @@ -1461,7 +1461,7 @@ }, { "file": "sdk/src/container.js", - "line": 292, + "line": 297, "description": "Gets the current list of apps in the container", "itemtype": "method", "name": "getContainerState", @@ -1474,7 +1474,7 @@ }, { "file": "sdk/src/container.js", - "line": 307, + "line": 312, "description": "Initializes the container. This method must be called before performing\nany other actions in the container.", "itemtype": "method", "name": "init", @@ -1490,7 +1490,7 @@ }, { "file": "sdk/src/container.js", - "line": 327, + "line": 332, "description": "Has the container been init?", "itemtype": "method", "name": "isInit", @@ -1503,7 +1503,7 @@ }, { "file": "sdk/src/container.js", - "line": 333, + "line": 338, "description": "Begins the loading process for all apps. The app will\nbe passed the {{#crossLink \"F2.AppConfig\"}}{{/crossLink}} object which will\ncontain the app's unique instanceId within the container. Optionally, the\n{{#crossLink \"F2.AppManifest\"}}{{/crossLink}} can be passed in and those\nassets will be used instead of making a request.", "itemtype": "method", "name": "registerApps", @@ -1525,7 +1525,7 @@ }, { "file": "sdk/src/container.js", - "line": 470, + "line": 475, "description": "Removes all apps from the container", "itemtype": "method", "name": "removeAllApps", @@ -1534,7 +1534,7 @@ }, { "file": "sdk/src/container.js", - "line": 485, + "line": 490, "description": "Removes an app from the container", "itemtype": "method", "name": "removeApp", diff --git a/docs/sdk/files/sdk_src_classes.js.html b/docs/sdk/files/sdk_src_classes.js.html index 5650eadf..4e0a09e3 100644 --- a/docs/sdk/files/sdk_src_classes.js.html +++ b/docs/sdk/files/sdk_src_classes.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/classes.js - + @@ -564,7 +564,7 @@

    File: sdk/src/classes.js


    diff --git a/docs/sdk/files/sdk_src_constants.js.html b/docs/sdk/files/sdk_src_constants.js.html index 67125f00..e743fc81 100644 --- a/docs/sdk/files/sdk_src_constants.js.html +++ b/docs/sdk/files/sdk_src_constants.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/constants.js - + @@ -504,7 +504,7 @@

    File: sdk/src/constants.js


    diff --git a/docs/sdk/files/sdk_src_container.js.html b/docs/sdk/files/sdk_src_container.js.html index e4946cda..5575fd07 100644 --- a/docs/sdk/files/sdk_src_container.js.html +++ b/docs/sdk/files/sdk_src_container.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/container.js - + @@ -410,6 +410,16 @@

    File: sdk/src/container.js

    } }); }; + //eval inlines + var evalInlines = function(){ + jQuery.each(inlines, function(i, e) { + try { + eval(e); + } catch (exception) { + F2.log('Error loading inline script: ' + exception + '\n\n' + e); + } + }); + }; // load styles var stylesFragment = []; @@ -438,13 +448,7 @@

    File: sdk/src/container.js

    type:'GET', success:function() { if (++scriptsLoaded == scriptCount) { - jQuery.each(inlines, function(i, e) { - try { - eval(e); - } catch (exception) { - F2.log('Error loading inline script: ' + exception + '\n\n' + e); - } - }); + evalInlines(); // fire the load event to tell the app it can proceed appInit(); } @@ -457,6 +461,7 @@

    File: sdk/src/container.js

    // if no scripts were to be processed, fire the appLoad event if (!scriptCount) { + evalInlines(); appInit(); } }; @@ -580,7 +585,7 @@

    File: sdk/src/container.js

    var callbackStack = {}; var haveManifests = false; appConfigs = [].concat(appConfigs); - appManifests = appManifests || []; + appManifests = [].concat(appManifests || []); haveManifests = !!appManifests.length; // appConfigs must have a length @@ -732,7 +737,7 @@

    File: sdk/src/container.js


    diff --git a/docs/sdk/files/sdk_src_events.js.html b/docs/sdk/files/sdk_src_events.js.html index a2190632..a3050105 100644 --- a/docs/sdk/files/sdk_src_events.js.html +++ b/docs/sdk/files/sdk_src_events.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/events.js - + @@ -309,7 +309,7 @@

    File: sdk/src/events.js


    diff --git a/docs/sdk/files/sdk_src_rpc.js.html b/docs/sdk/files/sdk_src_rpc.js.html index d887426b..9c9b0036 100644 --- a/docs/sdk/files/sdk_src_rpc.js.html +++ b/docs/sdk/files/sdk_src_rpc.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/rpc.js - + @@ -550,7 +550,7 @@

    File: sdk/src/rpc.js


    diff --git a/docs/sdk/files/sdk_src_ui.js.html b/docs/sdk/files/sdk_src_ui.js.html index 13dc6468..ddcd4ac0 100644 --- a/docs/sdk/files/sdk_src_ui.js.html +++ b/docs/sdk/files/sdk_src_ui.js.html @@ -3,7 +3,7 @@ F2 - sdk/src/ui.js - + @@ -652,7 +652,7 @@

    File: sdk/src/ui.js


    diff --git a/docs/sdk/index.html b/docs/sdk/index.html index d80b6bf8..60937df2 100644 --- a/docs/sdk/index.html +++ b/docs/sdk/index.html @@ -3,7 +3,7 @@ F2 - The Open Financial Framework - + @@ -243,7 +243,7 @@

    Versioning

    Talk

    -

    Have a question? Want to chat? Open an Issue on GitHub, ask it on our Google Group or send an email to info@openf2.org.

    +

    Have a question? Want to chat? Open an Issue on GitHub, ask it on our Google Group or send an email to info@openf2.org.

    Bug Tracking

    @@ -253,7 +253,7 @@

    Developers

    If you just want to build F2 containers and/or apps, you can skip the Build F2 section below. You do not need the command line to work with F2.

    -

    Build F2

    +

    Build F2 Build Status

    For those wishing to contribute back to F2, we've included a build file in the project which contains the logic for compiling F2.js and the specification docs. The build script runs on Node.js and has a few dependencies. To install, cd to your F2/build folder, and run the following commands in npm:

    @@ -273,6 +273,12 @@

    Build F2

    We are using markitdown, a lightweight pandoc wrapper, for converting markdown files to HTML for the docs.

    +NuGet Package + +

    Good news if you're using C#! We have an F2 NuGet package available. In the Package Manager Console run:

    + +

    PM> Install-Package F2

    +

    Collaboration

    Join our team and help contribute to F2 on GitHub. Begin by reading our contribution guidelines, and then start by forking the repo, sending pull requests, or submitting issues.

    @@ -294,7 +300,7 @@

    Copyright and License


    diff --git a/docs/sdk/modules/f2.html b/docs/sdk/modules/f2.html index 385d8a50..190f638f 100644 --- a/docs/sdk/modules/f2.html +++ b/docs/sdk/modules/f2.html @@ -3,7 +3,7 @@ F2 - f2 - + @@ -366,7 +366,7 @@

    f2 Module


    From b492079694ac91946f23b59f5ee9cf4178735c68 Mon Sep 17 00:00:00 2001 From: markhealey Date: Wed, 3 Apr 2013 22:51:16 -0600 Subject: [PATCH 23/25] Fixed #47 --- examples/apps/JavaScript/Chart/appclass.js | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/examples/apps/JavaScript/Chart/appclass.js b/examples/apps/JavaScript/Chart/appclass.js index 54f25594..dd0dd218 100644 --- a/examples/apps/JavaScript/Chart/appclass.js +++ b/examples/apps/JavaScript/Chart/appclass.js @@ -154,13 +154,9 @@ F2.Apps["com_openf2_examples_javascript_chart"] = (function(){ else downSeriesData.push( [ prevJSUTCDate, minVal ], [ currentJSUTCDate, minVal ] ); // Add the up month/down month data to the chart's series - if ($.browser.msie && parseInt($.browser.version) < 9) { - //commenting out for issue #1. - //o-do to come back and get grid lines working. - } else { - hcChartObj.series[1].setData(upSeriesData, false); - hcChartObj.series[2].setData(downSeriesData, false); - } + hcChartObj.series[1].setData(upSeriesData, false); + hcChartObj.series[2].setData(downSeriesData, false); + hcChartObj.yAxis[0].setExtremes(dataRanges.dataMin, dataRanges.dataMax, true, false); this.ui.updateHeight(); From ca20560afde24deaf4de426b21d4088d70bc6427 Mon Sep 17 00:00:00 2001 From: markhealey Date: Wed, 3 Apr 2013 22:56:35 -0600 Subject: [PATCH 24/25] Fixed #48 --- .../apps/JavaScript/HelloWorld/appclass.js | 39 ++++++++++--------- 1 file changed, 20 insertions(+), 19 deletions(-) diff --git a/examples/apps/JavaScript/HelloWorld/appclass.js b/examples/apps/JavaScript/HelloWorld/appclass.js index 8f22fbb7..ce835d18 100644 --- a/examples/apps/JavaScript/HelloWorld/appclass.js +++ b/examples/apps/JavaScript/HelloWorld/appclass.js @@ -9,33 +9,34 @@ F2.Apps["com_openf2_examples_javascript_helloworld"] = (function() { App_Class.prototype.init = function () { - this.$root.on('click', 'a.testAlert', $.proxy(function() { - this.ui.Modals.alert("Hello World!", function() { - F2.log('callback fired!'); - }); - }, this)); - - this.$root.on('click', 'a.testConfirm', $.proxy(function() { - this.ui.Modals.confirm( - "Hello World!", - function() { - F2.log('ok callback fired!'); - }, - function() { - F2.log('cancel callback fired!'); - } - ); - }, this)); + this.$root + .on('click', 'a.testAlert', $.proxy(function() { + this.ui.Modals.alert("Hello World!", function() { + F2.log('callback fired!'); + }); + }, this)) + .on('click', 'a.testConfirm', $.proxy(function() { + this.ui.Modals.confirm( + "Hello World!", + function() { + F2.log('ok callback fired!'); + }, + function() { + F2.log('cancel callback fired!'); + } + ); + }, this)) + ; this.ui.setTitle((this.appConfig.isSecure ? 'Secure' : '') + ' Hello World (JavaScript)'); this.ui.updateHeight(); - + // bind symbol change event F2.Events.on(F2.Constants.Events.CONTAINER_SYMBOL_CHANGE, $.proxy(this._handleSymbolChange, this)); }; App_Class.prototype._handleSymbolChange = function (data) { - + var symbolAlert = $("div.symbolAlert", this.$root); symbolAlert = (symbolAlert.length) ? symbolAlert From 3a927fb0d7c837aa2d5fda7c5028017797a5acc1 Mon Sep 17 00:00:00 2001 From: brianbaker Date: Mon, 8 Apr 2013 08:35:11 -0600 Subject: [PATCH 25/25] Release 1.1.2 --- build/F2.json | 12 +- docs/app-development.html | 10 +- docs/container-development.html | 22 +- docs/extending-f2.html | 10 +- docs/f2js-sdk.html | 10 +- docs/index.html | 12 +- docs/js/f2.js | 4 +- docs/js/f2.min.js | 4 +- docs/sdk/classes/F2.App.html | 20 +- docs/sdk/classes/F2.AppConfig.html | 80 ++--- .../classes/F2.AppManifest.AppContent.html | 18 +- docs/sdk/classes/F2.AppManifest.html | 24 +- docs/sdk/classes/F2.Constants.Css.html | 62 ++-- docs/sdk/classes/F2.Constants.Events.html | 26 +- docs/sdk/classes/F2.Constants.Sockets.html | 28 +- docs/sdk/classes/F2.Constants.Views.html | 26 +- docs/sdk/classes/F2.Constants.html | 12 +- .../classes/F2.ContainerConfig.UI.Mask.html | 26 +- docs/sdk/classes/F2.ContainerConfig.UI.html | 12 +- docs/sdk/classes/F2.ContainerConfig.html | 42 +-- docs/sdk/classes/F2.Events.html | 24 +- docs/sdk/classes/F2.Rpc.html | 46 +-- docs/sdk/classes/F2.UI.Modals.html | 16 +- docs/sdk/classes/F2.UI.Views.html | 18 +- docs/sdk/classes/F2.UI.html | 32 +- docs/sdk/classes/F2.html | 102 +++--- docs/sdk/data.json | 320 ++++++++++-------- docs/sdk/files/sdk_src_F2.js.html | 14 +- docs/sdk/files/sdk_src_classes.js.html | 14 +- docs/sdk/files/sdk_src_constants.js.html | 14 +- docs/sdk/files/sdk_src_container.js.html | 14 +- docs/sdk/files/sdk_src_events.js.html | 14 +- docs/sdk/files/sdk_src_rpc.js.html | 14 +- docs/sdk/files/sdk_src_ui.js.html | 14 +- docs/sdk/index.html | 12 +- docs/sdk/modules/f2.html | 12 +- f2.js | 4 +- sdk/f2.debug.js | 4 +- sdk/f2.min.js | 4 +- sdk/f2.no-third-party.js | 4 +- 40 files changed, 593 insertions(+), 563 deletions(-) diff --git a/build/F2.json b/build/F2.json index 202caf58..615e90ac 100644 --- a/build/F2.json +++ b/build/F2.json @@ -2,15 +2,15 @@ "docs": { "version": "1.1.2", "shortVersion": "1.1.2", - "releaseDate": "2013-03-07T19:10:50.102Z", - "lastUpdateDate": "2013-04-04T05:07:15.915Z", - "lastUpdateDateFormatted": "3 April 2013" + "releaseDate": "2013-04-08T14:34:33.095Z", + "lastUpdateDate": "2013-04-08T14:34:35.678Z", + "lastUpdateDateFormatted": "8 April 2013" }, "sdk": { "version": "1.1.2", "shortVersion": "1.1", - "releaseDate": "2013-03-07T19:10:50.102Z", - "lastUpdateDate": "2013-03-17T16:11:54.929Z" + "releaseDate": "2013-04-08T14:34:33.095Z", + "lastUpdateDate": "2013-04-08T14:34:33.926Z" }, - "branch": "1.2-wip" + "branch": "master" } \ No newline at end of file diff --git a/docs/app-development.html b/docs/app-development.html index f38eefb8..21d6a911 100644 --- a/docs/app-development.html +++ b/docs/app-development.html @@ -3,8 +3,8 @@ F2 - App Development - - + + @@ -26,7 +26,7 @@ - + \ No newline at end of file diff --git a/docs/container-development.html b/docs/container-development.html index 997a8c13..68455cad 100644 --- a/docs/container-development.html +++ b/docs/container-development.html @@ -3,8 +3,8 @@ F2 - Container Development - - + + @@ -26,7 +26,7 @@ - + \ No newline at end of file diff --git a/docs/extending-f2.html b/docs/extending-f2.html index b230caae..971a98b4 100644 --- a/docs/extending-f2.html +++ b/docs/extending-f2.html @@ -3,8 +3,8 @@ F2 - Extending F2 - - + + @@ -26,7 +26,7 @@ - + \ No newline at end of file diff --git a/docs/f2js-sdk.html b/docs/f2js-sdk.html index 82ec57dc..c401b24b 100644 --- a/docs/f2js-sdk.html +++ b/docs/f2js-sdk.html @@ -3,8 +3,8 @@ F2 - F2.js SDK - - + + @@ -26,7 +26,7 @@ - + \ No newline at end of file diff --git a/docs/index.html b/docs/index.html index efd9eb96..f10ae011 100644 --- a/docs/index.html +++ b/docs/index.html @@ -6,8 +6,8 @@ - - + + @@ -29,7 +29,7 @@ - + \ No newline at end of file diff --git a/docs/js/f2.js b/docs/js/f2.js index 3248f5b6..528c7b4f 100644 --- a/docs/js/f2.js +++ b/docs/js/f2.js @@ -93,7 +93,7 @@ var $, jQuery = $ = window.jQuery.noConflict(true); (function(N,d,p,K,k,H){var b=this;var n=Math.floor(Math.random()*10000);var q=Function.prototype;var Q=/^((http.?:)\/\/([^:\/\s]+)(:\d+)*)/;var R=/[\-\w]+\/\.\.\//;var F=/([^:])\/\//g;var I="";var o={};var M=N.easyXDM;var U="easyXDM_";var E;var y=false;var i;var h;function C(X,Z){var Y=typeof X[Z];return Y=="function"||(!!(Y=="object"&&X[Z]))||Y=="unknown"}function u(X,Y){return !!(typeof(X[Y])=="object"&&X[Y])}function r(X){return Object.prototype.toString.call(X)==="[object Array]"}function c(){try{var X=new ActiveXObject("ShockwaveFlash.ShockwaveFlash");i=Array.prototype.slice.call(X.GetVariable("$version").match(/(\d+),(\d+),(\d+),(\d+)/),1);h=parseInt(i[0],10)>9&&parseInt(i[1],10)>0;X=null;return true}catch(Y){return false}}var v,x;if(C(N,"addEventListener")){v=function(Z,X,Y){Z.addEventListener(X,Y,false)};x=function(Z,X,Y){Z.removeEventListener(X,Y,false)}}else{if(C(N,"attachEvent")){v=function(X,Z,Y){X.attachEvent("on"+Z,Y)};x=function(X,Z,Y){X.detachEvent("on"+Z,Y)}}else{throw new Error("Browser not supported")}}var W=false,J=[],L;if("readyState" in d){L=d.readyState;W=L=="complete"||(~navigator.userAgent.indexOf("AppleWebKit/")&&(L=="loaded"||L=="interactive"))}else{W=!!d.body}function s(){if(W){return}W=true;for(var X=0;X')}else{Z=d.createElement("IFRAME");Z.name=X.props.name}Z.id=Z.name=X.props.name;delete X.props.name;if(X.onLoad){v(Z,"load",X.onLoad)}if(typeof X.container=="string"){X.container=d.getElementById(X.container)}if(!X.container){T(Z.style,{position:"absolute",top:"-2000px"});X.container=d.body}var Y=X.props.src;delete X.props.src;T(Z,X.props);Z.border=Z.frameBorder=0;Z.allowTransparency=true;X.container.appendChild(Z);Z.src=Y;X.props.src=Y;return Z}function V(aa,Z){if(typeof aa=="string"){aa=[aa]}var Y,X=aa.length;while(X--){Y=aa[X];Y=new RegExp(Y.substr(0,1)=="^"?Y:("^"+Y.replace(/(\*)/g,".$1").replace(/\?/g,".")+"$"));if(Y.test(Z)){return true}}return false}function l(Z){var ae=Z.protocol,Y;Z.isHost=Z.isHost||t(S.xdm_p);y=Z.hash||false;if(!Z.props){Z.props={}}if(!Z.isHost){Z.channel=S.xdm_c;Z.secret=S.xdm_s;Z.remote=S.xdm_e;ae=S.xdm_p;if(Z.acl&&!V(Z.acl,Z.remote)){throw new Error("Access denied for "+Z.remote)}}else{Z.remote=B(Z.remote);Z.channel=Z.channel||"default"+n++;Z.secret=Math.random().toString(16).substring(2);if(t(ae)){if(j(p.href)==j(Z.remote)){ae="4"}else{if(C(N,"postMessage")||C(d,"postMessage")){ae="1"}else{if(Z.swf&&C(N,"ActiveXObject")&&c()){ae="6"}else{if(navigator.product==="Gecko"&&"frameElement" in N&&navigator.userAgent.indexOf("WebKit")==-1){ae="5"}else{if(Z.remoteHelper){Z.remoteHelper=B(Z.remoteHelper);ae="2"}else{ae="0"}}}}}}}Z.protocol=ae;switch(ae){case"0":T(Z,{interval:100,delay:2000,useResize:true,useParent:false,usePolling:false},true);if(Z.isHost){if(!Z.local){var ac=p.protocol+"//"+p.host,X=d.body.getElementsByTagName("img"),ad;var aa=X.length;while(aa--){ad=X[aa];if(ad.src.substring(0,ac.length)===ac){Z.local=ad.src;break}}if(!Z.local){Z.local=N}}var ab={xdm_c:Z.channel,xdm_p:0};if(Z.local===N){Z.usePolling=true;Z.useParent=true;Z.local=p.protocol+"//"+p.host+p.pathname+p.search;ab.xdm_e=Z.local;ab.xdm_pa=1}else{ab.xdm_e=B(Z.local)}if(Z.container){Z.useResize=false;ab.xdm_po=1}Z.remote=P(Z.remote,ab)}else{T(Z,{channel:S.xdm_c,remote:S.xdm_e,useParent:!t(S.xdm_pa),usePolling:!t(S.xdm_po),useResize:Z.useParent?false:Z.useResize})}Y=[new o.stack.HashTransport(Z),new o.stack.ReliableBehavior({}),new o.stack.QueueBehavior({encode:true,maxLength:4000-Z.remote.length}),new o.stack.VerifyBehavior({initiate:Z.isHost})];break;case"1":Y=[new o.stack.PostMessageTransport(Z)];break;case"2":Y=[new o.stack.NameTransport(Z),new o.stack.QueueBehavior(),new o.stack.VerifyBehavior({initiate:Z.isHost})];break;case"3":Y=[new o.stack.NixTransport(Z)];break;case"4":Y=[new o.stack.SameOriginTransport(Z)];break;case"5":Y=[new o.stack.FrameElementTransport(Z)];break;case"6":if(!i){c()}Y=[new o.stack.FlashTransport(Z)];break}Y.push(new o.stack.QueueBehavior({lazy:Z.lazy,remove:true}));return Y}function D(aa){var ab,Z={incoming:function(ad,ac){this.up.incoming(ad,ac)},outgoing:function(ac,ad){this.down.outgoing(ac,ad)},callback:function(ac){this.up.callback(ac)},init:function(){this.down.init()},destroy:function(){this.down.destroy()}};for(var Y=0,X=aa.length;Y<\/script>')}}};(function(){var X={};o.Fn={set:function(Y,Z){X[Y]=Z},get:function(Z,Y){var aa=X[Z];if(Y){delete X[Z]}return aa}}}());o.Socket=function(Y){var X=D(l(Y).concat([{incoming:function(ab,aa){Y.onMessage(ab,aa)},callback:function(aa){if(Y.onReady){Y.onReady(aa)}}}])),Z=j(Y.remote);this.origin=j(Y.remote);this.destroy=function(){X.destroy()};this.postMessage=function(aa){X.outgoing(aa,Z)};X.init()};o.Rpc=function(Z,Y){if(Y.local){for(var ab in Y.local){if(Y.local.hasOwnProperty(ab)){var aa=Y.local[ab];if(typeof aa==="function"){Y.local[ab]={method:aa}}}}}var X=D(l(Z).concat([new o.stack.RpcBehavior(this,Y),{callback:function(ac){if(Z.onReady){Z.onReady(ac)}}}]));this.origin=j(Z.remote);this.destroy=function(){X.destroy()};X.init()};o.stack.SameOriginTransport=function(Y){var Z,ab,aa,X;return(Z={outgoing:function(ad,ae,ac){aa(ad);if(ac){ac()}},destroy:function(){if(ab){ab.parentNode.removeChild(ab);ab=null}},onDOMReady:function(){X=j(Y.remote);if(Y.isHost){T(Y.props,{src:P(Y.remote,{xdm_e:p.protocol+"//"+p.host+p.pathname,xdm_c:Y.channel,xdm_p:4}),name:U+Y.channel+"_provider"});ab=A(Y);o.Fn.set(Y.channel,function(ac){aa=ac;K(function(){Z.up.callback(true)},0);return function(ad){Z.up.incoming(ad,X)}})}else{aa=m().Fn.get(Y.channel,true)(function(ac){Z.up.incoming(ac,X)});K(function(){Z.up.callback(true)},0)}},init:function(){G(Z.onDOMReady,Z)}})};o.stack.FlashTransport=function(aa){var ac,X,ab,ad,Y,ae;function af(ah,ag){K(function(){ac.up.incoming(ah,ad)},0)}function Z(ah){var ag=aa.swf+"?host="+aa.isHost;var aj="easyXDM_swf_"+Math.floor(Math.random()*10000);o.Fn.set("flash_loaded"+ah.replace(/[\-.]/g,"_"),function(){o.stack.FlashTransport[ah].swf=Y=ae.firstChild;var ak=o.stack.FlashTransport[ah].queue;for(var al=0;al"}return(ac={outgoing:function(ah,ai,ag){Y.postMessage(aa.channel,ah.toString());if(ag){ag()}},destroy:function(){try{Y.destroyChannel(aa.channel)}catch(ag){}Y=null;if(X){X.parentNode.removeChild(X);X=null}},onDOMReady:function(){ad=aa.remote;o.Fn.set("flash_"+aa.channel+"_init",function(){K(function(){ac.up.callback(true)})});o.Fn.set("flash_"+aa.channel+"_onMessage",af);aa.swf=B(aa.swf);var ah=z(aa.swf);var ag=function(){o.stack.FlashTransport[ah].init=true;Y=o.stack.FlashTransport[ah].swf;Y.createChannel(aa.channel,aa.secret,j(aa.remote),aa.isHost);if(aa.isHost){if(h&&aa.swfNoThrottle){T(aa.props,{position:"fixed",right:0,top:0,height:"20px",width:"20px"})}T(aa.props,{src:P(aa.remote,{xdm_e:j(p.href),xdm_c:aa.channel,xdm_p:6,xdm_s:aa.secret}),name:U+aa.channel+"_provider"});X=A(aa)}};if(o.stack.FlashTransport[ah]&&o.stack.FlashTransport[ah].init){ag()}else{if(!o.stack.FlashTransport[ah]){o.stack.FlashTransport[ah]={queue:[ag]};Z(ah)}else{o.stack.FlashTransport[ah].queue.push(ag)}}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.PostMessageTransport=function(aa){var ac,ad,Y,Z;function X(ae){if(ae.origin){return j(ae.origin)}if(ae.uri){return j(ae.uri)}if(ae.domain){return p.protocol+"//"+ae.domain}throw"Unable to retrieve the origin of the event"}function ab(af){var ae=X(af);if(ae==Z&&af.data.substring(0,aa.channel.length+1)==aa.channel+" "){ac.up.incoming(af.data.substring(aa.channel.length+1),ae)}}return(ac={outgoing:function(af,ag,ae){Y.postMessage(aa.channel+" "+af,ag||Z);if(ae){ae()}},destroy:function(){x(N,"message",ab);if(ad){Y=null;ad.parentNode.removeChild(ad);ad=null}},onDOMReady:function(){Z=j(aa.remote);if(aa.isHost){var ae=function(af){if(af.data==aa.channel+"-ready"){Y=("postMessage" in ad.contentWindow)?ad.contentWindow:ad.contentWindow.document;x(N,"message",ae);v(N,"message",ab);K(function(){ac.up.callback(true)},0)}};v(N,"message",ae);T(aa.props,{src:P(aa.remote,{xdm_e:j(p.href),xdm_c:aa.channel,xdm_p:1}),name:U+aa.channel+"_provider"});ad=A(aa)}else{v(N,"message",ab);Y=("postMessage" in N.parent)?N.parent:N.parent.document;Y.postMessage(aa.channel+"-ready",Z);K(function(){ac.up.callback(true)},0)}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.FrameElementTransport=function(Y){var Z,ab,aa,X;return(Z={outgoing:function(ad,ae,ac){aa.call(this,ad);if(ac){ac()}},destroy:function(){if(ab){ab.parentNode.removeChild(ab);ab=null}},onDOMReady:function(){X=j(Y.remote);if(Y.isHost){T(Y.props,{src:P(Y.remote,{xdm_e:j(p.href),xdm_c:Y.channel,xdm_p:5}),name:U+Y.channel+"_provider"});ab=A(Y);ab.fn=function(ac){delete ab.fn;aa=ac;K(function(){Z.up.callback(true)},0);return function(ad){Z.up.incoming(ad,X)}}}else{if(d.referrer&&j(d.referrer)!=S.xdm_e){N.top.location=S.xdm_e}aa=N.frameElement.fn(function(ac){Z.up.incoming(ac,X)});Z.up.callback(true)}},init:function(){G(Z.onDOMReady,Z)}})};o.stack.NameTransport=function(ab){var ac;var ae,ai,aa,ag,ah,Y,X;function af(al){var ak=ab.remoteHelper+(ae?"#_3":"#_2")+ab.channel;ai.contentWindow.sendMessage(al,ak)}function ad(){if(ae){if(++ag===2||!ae){ac.up.callback(true)}}else{af("ready");ac.up.callback(true)}}function aj(ak){ac.up.incoming(ak,Y)}function Z(){if(ah){K(function(){ah(true)},0)}}return(ac={outgoing:function(al,am,ak){ah=ak;af(al)},destroy:function(){ai.parentNode.removeChild(ai);ai=null;if(ae){aa.parentNode.removeChild(aa);aa=null}},onDOMReady:function(){ae=ab.isHost;ag=0;Y=j(ab.remote);ab.local=B(ab.local);if(ae){o.Fn.set(ab.channel,function(al){if(ae&&al==="ready"){o.Fn.set(ab.channel,aj);ad()}});X=P(ab.remote,{xdm_e:ab.local,xdm_c:ab.channel,xdm_p:2});T(ab.props,{src:X+"#"+ab.channel,name:U+ab.channel+"_provider"});aa=A(ab)}else{ab.remoteHelper=ab.remote;o.Fn.set(ab.channel,aj)}ai=A({props:{src:ab.local+"#_4"+ab.channel},onLoad:function ak(){var al=ai||this;x(al,"load",ak);o.Fn.set(ab.channel+"_load",Z);(function am(){if(typeof al.contentWindow.sendMessage=="function"){ad()}else{K(am,50)}}())}})},init:function(){G(ac.onDOMReady,ac)}})};o.stack.HashTransport=function(Z){var ac;var ah=this,af,aa,X,ad,am,ab,al;var ag,Y;function ak(ao){if(!al){return}var an=Z.remote+"#"+(am++)+"_"+ao;((af||!ag)?al.contentWindow:al).location=an}function ae(an){ad=an;ac.up.incoming(ad.substring(ad.indexOf("_")+1),Y)}function aj(){if(!ab){return}var an=ab.location.href,ap="",ao=an.indexOf("#");if(ao!=-1){ap=an.substring(ao)}if(ap&&ap!=ad){ae(ap)}}function ai(){aa=setInterval(aj,X)}return(ac={outgoing:function(an,ao){ak(an)},destroy:function(){N.clearInterval(aa);if(af||!ag){al.parentNode.removeChild(al)}al=null},onDOMReady:function(){af=Z.isHost;X=Z.interval;ad="#"+Z.channel;am=0;ag=Z.useParent;Y=j(Z.remote);if(af){Z.props={src:Z.remote,name:U+Z.channel+"_provider"};if(ag){Z.onLoad=function(){ab=N;ai();ac.up.callback(true)}}else{var ap=0,an=Z.delay/50;(function ao(){if(++ap>an){throw new Error("Unable to reference listenerwindow")}try{ab=al.contentWindow.frames[U+Z.channel+"_consumer"]}catch(aq){}if(ab){ai();ac.up.callback(true)}else{K(ao,50)}}())}al=A(Z)}else{ab=N;ai();if(ag){al=parent;ac.up.callback(true)}else{T(Z,{props:{src:Z.remote+"#"+Z.channel+new Date(),name:U+Z.channel+"_consumer"},onLoad:function(){ac.up.callback(true)}});al=A(Z)}}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.ReliableBehavior=function(Y){var aa,ac;var ab=0,X=0,Z="";return(aa={incoming:function(af,ad){var ae=af.indexOf("_"),ag=af.substring(0,ae).split(",");af=af.substring(ae+1);if(ag[0]==ab){Z="";if(ac){ac(true)}}if(af.length>0){aa.down.outgoing(ag[1]+","+ab+"_"+Z,ad);if(X!=ag[1]){X=ag[1];aa.up.incoming(af,ad)}}},outgoing:function(af,ad,ae){Z=af;ac=ae;aa.down.outgoing(X+","+(++ab)+"_"+af,ad)}})};o.stack.QueueBehavior=function(Z){var ac,ad=[],ag=true,aa="",af,X=0,Y=false,ab=false;function ae(){if(Z.remove&&ad.length===0){w(ac);return}if(ag||ad.length===0||af){return}ag=true;var ah=ad.shift();ac.down.outgoing(ah.data,ah.origin,function(ai){ag=false;if(ah.callback){K(function(){ah.callback(ai)},0)}ae()})}return(ac={init:function(){if(t(Z)){Z={}}if(Z.maxLength){X=Z.maxLength;ab=true}if(Z.lazy){Y=true}else{ac.down.init()}},callback:function(ai){ag=false;var ah=ac.up;ae();ah.callback(ai)},incoming:function(ak,ai){if(ab){var aj=ak.indexOf("_"),ah=parseInt(ak.substring(0,aj),10);aa+=ak.substring(aj+1);if(ah===0){if(Z.encode){aa=k(aa)}ac.up.incoming(aa,ai);aa=""}}else{ac.up.incoming(ak,ai)}},outgoing:function(al,ai,ak){if(Z.encode){al=H(al)}var ah=[],aj;if(ab){while(al.length!==0){aj=al.substring(0,X);al=al.substring(aj.length);ah.push(aj)}while((aj=ah.shift())){ad.push({data:ah.length+"_"+aj,origin:ai,callback:ah.length===0?ak:null})}}else{ad.push({data:al,origin:ai,callback:ak})}if(Y){ac.down.init()}else{ae()}},destroy:function(){af=true;ac.down.destroy()}})};o.stack.VerifyBehavior=function(ab){var ac,aa,Y,Z=false;function X(){aa=Math.random().toString(16).substring(2);ac.down.outgoing(aa)}return(ac={incoming:function(af,ad){var ae=af.indexOf("_");if(ae===-1){if(af===aa){ac.up.callback(true)}else{if(!Y){Y=af;if(!ab.initiate){X()}ac.down.outgoing(af)}}}else{if(af.substring(0,ae)===Y){ac.up.incoming(af.substring(ae+1),ad)}}},outgoing:function(af,ad,ae){ac.down.outgoing(aa+"_"+af,ad,ae)},callback:function(ad){if(ab.initiate){X()}}})};o.stack.RpcBehavior=function(ad,Y){var aa,af=Y.serializer||O();var ae=0,ac={};function X(ag){ag.jsonrpc="2.0";aa.down.outgoing(af.stringify(ag))}function ab(ag,ai){var ah=Array.prototype.slice;return function(){var aj=arguments.length,al,ak={method:ai};if(aj>0&&typeof arguments[aj-1]==="function"){if(aj>1&&typeof arguments[aj-2]==="function"){al={success:arguments[aj-2],error:arguments[aj-1]};ak.params=ah.call(arguments,0,aj-2)}else{al={success:arguments[aj-1]};ak.params=ah.call(arguments,0,aj-1)}ac[""+(++ae)]=al;ak.id=ae}else{ak.params=ah.call(arguments,0)}if(ag.namedParams&&ak.params.length===1){ak.params=ak.params[0]}X(ak)}}function Z(an,am,ai,al){if(!ai){if(am){X({id:am,error:{code:-32601,message:"Procedure not found."}})}return}var ak,ah;if(am){ak=function(ao){ak=q;X({id:am,result:ao})};ah=function(ao,ap){ah=q;var aq={id:am,error:{code:-32099,message:ao}};if(ap){aq.error.data=ap}X(aq)}}else{ak=ah=q}if(!r(al)){al=[al]}try{var ag=ai.method.apply(ai.scope,al.concat([ak,ah]));if(!t(ag)){ak(ag)}}catch(aj){ah(aj.message)}}return(aa={incoming:function(ah,ag){var ai=af.parse(ah);if(ai.method){if(Y.handle){Y.handle(ai,X)}else{Z(ai.method,ai.id,Y.local[ai.method],ai.params)}}else{var aj=ac[ai.id];if(ai.error){if(aj.error){aj.error(ai.error)}}else{if(aj.success){aj.success(ai.result)}}delete ac[ai.id]}},init:function(){if(Y.remote){for(var ag in Y.remote){if(Y.remote.hasOwnProperty(ag)){ad[ag]=ab(Y.remote[ag],ag)}}}aa.down.init()},destroy:function(){for(var ag in Y.remote){if(Y.remote.hasOwnProperty(ag)&&ad.hasOwnProperty(ag)){delete ad[ag]}}aa.down.destroy()}})};b.easyXDM=o})(window,document,location,window.setTimeout,decodeURIComponent,encodeURIComponent);; /*! - * F2 v1.1.1 + * F2 v1.1.2 * Copyright (c) 2013 Markit On Demand, Inc. http://www.openf2.org * * Permission is hereby granted, free of charge, to any person obtaining a copy @@ -114,7 +114,7 @@ var $, jQuery = $ = window.jQuery.noConflict(true); * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ -;var F2;F2={appConfigReplacer:function(e,t){return e=="root"||e=="ui"||e=="height"?undefined:t},Apps:{},extend:function(e,t,n){var r=typeof t=="function",i=e?e.split("."):[],s=this;t=t||{},i[0]==="F2"&&(i=i.slice(1));for(var o=0,u=i.length;o-1},log:function(){window.console&&window.console.log&&console.log([].slice.call(arguments))},parse:function(e){return JSON.parse(e)},stringify:function(e,t,n){return JSON.stringify(e,t,n)},version:function(){return"1.1.1"}}; +;var F2;F2={appConfigReplacer:function(e,t){return e=="root"||e=="ui"||e=="height"?undefined:t},Apps:{},extend:function(e,t,n){var r=typeof t=="function",i=e?e.split("."):[],s=this;t=t||{},i[0]==="F2"&&(i=i.slice(1));for(var o=0,u=i.length;o-1},log:function(){window.console&&window.console.log&&console.log([].slice.call(arguments))},parse:function(e){return JSON.parse(e)},stringify:function(e,t,n){return JSON.stringify(e,t,n)},version:function(){return"1.1.2"}}; F2.extend("",{App:function(e,t,n){return{init:function(){}}},AppConfig:{appId:"",context:{},enableBatchRequests:!1,height:0,instanceId:"",isSecure:!1,manifestUrl:"",maxWidth:0,minGridSize:4,minWidth:300,name:"",root:undefined,ui:undefined,views:[]},AppManifest:{apps:[],inlineScripts:[],scripts:[],styles:[]},AppContent:{data:{},html:"",status:""},ContainerConfig:{afterAppRender:function(e,t){},appRender:function(e,t){},beforeAppRender:function(e){},isSecureAppPage:!1,UI:{Mask:{backgroundColor:"#FFF",loadingIcon:"",opacity:.6,useClasses:!1,zIndex:2}},secureAppPagePath:"",supportedViews:[]}}); F2.extend("Constants",{Css:function(){var e="f2-";return{APP:e+"app",APP_CONTAINER:e+"app-container",APP_TITLE:e+"app-title",APP_VIEW:e+"app-view",APP_VIEW_TRIGGER:e+"app-view-trigger",MASK:e+"mask",MASK_CONTAINER:e+"mask-container"}}(),Events:function(){var e="App.",t="Container.";return{APP_SYMBOL_CHANGE:e+"symbolChange",APP_WIDTH_CHANGE:e+"widthChange.",CONTAINER_SYMBOL_CHANGE:t+"symbolChange",CONTAINER_WIDTH_CHANGE:t+"widthChange"}}(),JSONP_CALLBACK:"F2_jsonpCallback_",Sockets:{EVENT:"__event__",LOAD:"__socketLoad__",RPC:"__rpc__",RPC_CALLBACK:"__rpcCallback__",UI_RPC:"__uiRpc__"},Views:{DATA_ATTRIBUTE:"data-f2-view",ABOUT:"about",HELP:"help",HOME:"home",REMOVE:"remove",SETTINGS:"settings"}}); F2.extend("Events",function(){var e=new EventEmitter2({wildcard:!0});return e.setMaxListeners(0),{_socketEmit:function(){return EventEmitter2.prototype.emit.apply(e,[].slice.call(arguments))},emit:function(){return F2.Rpc.broadcast(F2.Constants.Sockets.EVENT,[].slice.call(arguments)),EventEmitter2.prototype.emit.apply(e,[].slice.call(arguments))},many:function(t,n,r){return e.many(t,n,r)},off:function(t,n){return e.off(t,n)},on:function(t,n){return e.on(t,n)},once:function(t,n){return e.once(t,n)}}}()); diff --git a/docs/js/f2.min.js b/docs/js/f2.min.js index 3248f5b6..528c7b4f 100644 --- a/docs/js/f2.min.js +++ b/docs/js/f2.min.js @@ -93,7 +93,7 @@ var $, jQuery = $ = window.jQuery.noConflict(true); (function(N,d,p,K,k,H){var b=this;var n=Math.floor(Math.random()*10000);var q=Function.prototype;var Q=/^((http.?:)\/\/([^:\/\s]+)(:\d+)*)/;var R=/[\-\w]+\/\.\.\//;var F=/([^:])\/\//g;var I="";var o={};var M=N.easyXDM;var U="easyXDM_";var E;var y=false;var i;var h;function C(X,Z){var Y=typeof X[Z];return Y=="function"||(!!(Y=="object"&&X[Z]))||Y=="unknown"}function u(X,Y){return !!(typeof(X[Y])=="object"&&X[Y])}function r(X){return Object.prototype.toString.call(X)==="[object Array]"}function c(){try{var X=new ActiveXObject("ShockwaveFlash.ShockwaveFlash");i=Array.prototype.slice.call(X.GetVariable("$version").match(/(\d+),(\d+),(\d+),(\d+)/),1);h=parseInt(i[0],10)>9&&parseInt(i[1],10)>0;X=null;return true}catch(Y){return false}}var v,x;if(C(N,"addEventListener")){v=function(Z,X,Y){Z.addEventListener(X,Y,false)};x=function(Z,X,Y){Z.removeEventListener(X,Y,false)}}else{if(C(N,"attachEvent")){v=function(X,Z,Y){X.attachEvent("on"+Z,Y)};x=function(X,Z,Y){X.detachEvent("on"+Z,Y)}}else{throw new Error("Browser not supported")}}var W=false,J=[],L;if("readyState" in d){L=d.readyState;W=L=="complete"||(~navigator.userAgent.indexOf("AppleWebKit/")&&(L=="loaded"||L=="interactive"))}else{W=!!d.body}function s(){if(W){return}W=true;for(var X=0;X')}else{Z=d.createElement("IFRAME");Z.name=X.props.name}Z.id=Z.name=X.props.name;delete X.props.name;if(X.onLoad){v(Z,"load",X.onLoad)}if(typeof X.container=="string"){X.container=d.getElementById(X.container)}if(!X.container){T(Z.style,{position:"absolute",top:"-2000px"});X.container=d.body}var Y=X.props.src;delete X.props.src;T(Z,X.props);Z.border=Z.frameBorder=0;Z.allowTransparency=true;X.container.appendChild(Z);Z.src=Y;X.props.src=Y;return Z}function V(aa,Z){if(typeof aa=="string"){aa=[aa]}var Y,X=aa.length;while(X--){Y=aa[X];Y=new RegExp(Y.substr(0,1)=="^"?Y:("^"+Y.replace(/(\*)/g,".$1").replace(/\?/g,".")+"$"));if(Y.test(Z)){return true}}return false}function l(Z){var ae=Z.protocol,Y;Z.isHost=Z.isHost||t(S.xdm_p);y=Z.hash||false;if(!Z.props){Z.props={}}if(!Z.isHost){Z.channel=S.xdm_c;Z.secret=S.xdm_s;Z.remote=S.xdm_e;ae=S.xdm_p;if(Z.acl&&!V(Z.acl,Z.remote)){throw new Error("Access denied for "+Z.remote)}}else{Z.remote=B(Z.remote);Z.channel=Z.channel||"default"+n++;Z.secret=Math.random().toString(16).substring(2);if(t(ae)){if(j(p.href)==j(Z.remote)){ae="4"}else{if(C(N,"postMessage")||C(d,"postMessage")){ae="1"}else{if(Z.swf&&C(N,"ActiveXObject")&&c()){ae="6"}else{if(navigator.product==="Gecko"&&"frameElement" in N&&navigator.userAgent.indexOf("WebKit")==-1){ae="5"}else{if(Z.remoteHelper){Z.remoteHelper=B(Z.remoteHelper);ae="2"}else{ae="0"}}}}}}}Z.protocol=ae;switch(ae){case"0":T(Z,{interval:100,delay:2000,useResize:true,useParent:false,usePolling:false},true);if(Z.isHost){if(!Z.local){var ac=p.protocol+"//"+p.host,X=d.body.getElementsByTagName("img"),ad;var aa=X.length;while(aa--){ad=X[aa];if(ad.src.substring(0,ac.length)===ac){Z.local=ad.src;break}}if(!Z.local){Z.local=N}}var ab={xdm_c:Z.channel,xdm_p:0};if(Z.local===N){Z.usePolling=true;Z.useParent=true;Z.local=p.protocol+"//"+p.host+p.pathname+p.search;ab.xdm_e=Z.local;ab.xdm_pa=1}else{ab.xdm_e=B(Z.local)}if(Z.container){Z.useResize=false;ab.xdm_po=1}Z.remote=P(Z.remote,ab)}else{T(Z,{channel:S.xdm_c,remote:S.xdm_e,useParent:!t(S.xdm_pa),usePolling:!t(S.xdm_po),useResize:Z.useParent?false:Z.useResize})}Y=[new o.stack.HashTransport(Z),new o.stack.ReliableBehavior({}),new o.stack.QueueBehavior({encode:true,maxLength:4000-Z.remote.length}),new o.stack.VerifyBehavior({initiate:Z.isHost})];break;case"1":Y=[new o.stack.PostMessageTransport(Z)];break;case"2":Y=[new o.stack.NameTransport(Z),new o.stack.QueueBehavior(),new o.stack.VerifyBehavior({initiate:Z.isHost})];break;case"3":Y=[new o.stack.NixTransport(Z)];break;case"4":Y=[new o.stack.SameOriginTransport(Z)];break;case"5":Y=[new o.stack.FrameElementTransport(Z)];break;case"6":if(!i){c()}Y=[new o.stack.FlashTransport(Z)];break}Y.push(new o.stack.QueueBehavior({lazy:Z.lazy,remove:true}));return Y}function D(aa){var ab,Z={incoming:function(ad,ac){this.up.incoming(ad,ac)},outgoing:function(ac,ad){this.down.outgoing(ac,ad)},callback:function(ac){this.up.callback(ac)},init:function(){this.down.init()},destroy:function(){this.down.destroy()}};for(var Y=0,X=aa.length;Y<\/script>')}}};(function(){var X={};o.Fn={set:function(Y,Z){X[Y]=Z},get:function(Z,Y){var aa=X[Z];if(Y){delete X[Z]}return aa}}}());o.Socket=function(Y){var X=D(l(Y).concat([{incoming:function(ab,aa){Y.onMessage(ab,aa)},callback:function(aa){if(Y.onReady){Y.onReady(aa)}}}])),Z=j(Y.remote);this.origin=j(Y.remote);this.destroy=function(){X.destroy()};this.postMessage=function(aa){X.outgoing(aa,Z)};X.init()};o.Rpc=function(Z,Y){if(Y.local){for(var ab in Y.local){if(Y.local.hasOwnProperty(ab)){var aa=Y.local[ab];if(typeof aa==="function"){Y.local[ab]={method:aa}}}}}var X=D(l(Z).concat([new o.stack.RpcBehavior(this,Y),{callback:function(ac){if(Z.onReady){Z.onReady(ac)}}}]));this.origin=j(Z.remote);this.destroy=function(){X.destroy()};X.init()};o.stack.SameOriginTransport=function(Y){var Z,ab,aa,X;return(Z={outgoing:function(ad,ae,ac){aa(ad);if(ac){ac()}},destroy:function(){if(ab){ab.parentNode.removeChild(ab);ab=null}},onDOMReady:function(){X=j(Y.remote);if(Y.isHost){T(Y.props,{src:P(Y.remote,{xdm_e:p.protocol+"//"+p.host+p.pathname,xdm_c:Y.channel,xdm_p:4}),name:U+Y.channel+"_provider"});ab=A(Y);o.Fn.set(Y.channel,function(ac){aa=ac;K(function(){Z.up.callback(true)},0);return function(ad){Z.up.incoming(ad,X)}})}else{aa=m().Fn.get(Y.channel,true)(function(ac){Z.up.incoming(ac,X)});K(function(){Z.up.callback(true)},0)}},init:function(){G(Z.onDOMReady,Z)}})};o.stack.FlashTransport=function(aa){var ac,X,ab,ad,Y,ae;function af(ah,ag){K(function(){ac.up.incoming(ah,ad)},0)}function Z(ah){var ag=aa.swf+"?host="+aa.isHost;var aj="easyXDM_swf_"+Math.floor(Math.random()*10000);o.Fn.set("flash_loaded"+ah.replace(/[\-.]/g,"_"),function(){o.stack.FlashTransport[ah].swf=Y=ae.firstChild;var ak=o.stack.FlashTransport[ah].queue;for(var al=0;al"}return(ac={outgoing:function(ah,ai,ag){Y.postMessage(aa.channel,ah.toString());if(ag){ag()}},destroy:function(){try{Y.destroyChannel(aa.channel)}catch(ag){}Y=null;if(X){X.parentNode.removeChild(X);X=null}},onDOMReady:function(){ad=aa.remote;o.Fn.set("flash_"+aa.channel+"_init",function(){K(function(){ac.up.callback(true)})});o.Fn.set("flash_"+aa.channel+"_onMessage",af);aa.swf=B(aa.swf);var ah=z(aa.swf);var ag=function(){o.stack.FlashTransport[ah].init=true;Y=o.stack.FlashTransport[ah].swf;Y.createChannel(aa.channel,aa.secret,j(aa.remote),aa.isHost);if(aa.isHost){if(h&&aa.swfNoThrottle){T(aa.props,{position:"fixed",right:0,top:0,height:"20px",width:"20px"})}T(aa.props,{src:P(aa.remote,{xdm_e:j(p.href),xdm_c:aa.channel,xdm_p:6,xdm_s:aa.secret}),name:U+aa.channel+"_provider"});X=A(aa)}};if(o.stack.FlashTransport[ah]&&o.stack.FlashTransport[ah].init){ag()}else{if(!o.stack.FlashTransport[ah]){o.stack.FlashTransport[ah]={queue:[ag]};Z(ah)}else{o.stack.FlashTransport[ah].queue.push(ag)}}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.PostMessageTransport=function(aa){var ac,ad,Y,Z;function X(ae){if(ae.origin){return j(ae.origin)}if(ae.uri){return j(ae.uri)}if(ae.domain){return p.protocol+"//"+ae.domain}throw"Unable to retrieve the origin of the event"}function ab(af){var ae=X(af);if(ae==Z&&af.data.substring(0,aa.channel.length+1)==aa.channel+" "){ac.up.incoming(af.data.substring(aa.channel.length+1),ae)}}return(ac={outgoing:function(af,ag,ae){Y.postMessage(aa.channel+" "+af,ag||Z);if(ae){ae()}},destroy:function(){x(N,"message",ab);if(ad){Y=null;ad.parentNode.removeChild(ad);ad=null}},onDOMReady:function(){Z=j(aa.remote);if(aa.isHost){var ae=function(af){if(af.data==aa.channel+"-ready"){Y=("postMessage" in ad.contentWindow)?ad.contentWindow:ad.contentWindow.document;x(N,"message",ae);v(N,"message",ab);K(function(){ac.up.callback(true)},0)}};v(N,"message",ae);T(aa.props,{src:P(aa.remote,{xdm_e:j(p.href),xdm_c:aa.channel,xdm_p:1}),name:U+aa.channel+"_provider"});ad=A(aa)}else{v(N,"message",ab);Y=("postMessage" in N.parent)?N.parent:N.parent.document;Y.postMessage(aa.channel+"-ready",Z);K(function(){ac.up.callback(true)},0)}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.FrameElementTransport=function(Y){var Z,ab,aa,X;return(Z={outgoing:function(ad,ae,ac){aa.call(this,ad);if(ac){ac()}},destroy:function(){if(ab){ab.parentNode.removeChild(ab);ab=null}},onDOMReady:function(){X=j(Y.remote);if(Y.isHost){T(Y.props,{src:P(Y.remote,{xdm_e:j(p.href),xdm_c:Y.channel,xdm_p:5}),name:U+Y.channel+"_provider"});ab=A(Y);ab.fn=function(ac){delete ab.fn;aa=ac;K(function(){Z.up.callback(true)},0);return function(ad){Z.up.incoming(ad,X)}}}else{if(d.referrer&&j(d.referrer)!=S.xdm_e){N.top.location=S.xdm_e}aa=N.frameElement.fn(function(ac){Z.up.incoming(ac,X)});Z.up.callback(true)}},init:function(){G(Z.onDOMReady,Z)}})};o.stack.NameTransport=function(ab){var ac;var ae,ai,aa,ag,ah,Y,X;function af(al){var ak=ab.remoteHelper+(ae?"#_3":"#_2")+ab.channel;ai.contentWindow.sendMessage(al,ak)}function ad(){if(ae){if(++ag===2||!ae){ac.up.callback(true)}}else{af("ready");ac.up.callback(true)}}function aj(ak){ac.up.incoming(ak,Y)}function Z(){if(ah){K(function(){ah(true)},0)}}return(ac={outgoing:function(al,am,ak){ah=ak;af(al)},destroy:function(){ai.parentNode.removeChild(ai);ai=null;if(ae){aa.parentNode.removeChild(aa);aa=null}},onDOMReady:function(){ae=ab.isHost;ag=0;Y=j(ab.remote);ab.local=B(ab.local);if(ae){o.Fn.set(ab.channel,function(al){if(ae&&al==="ready"){o.Fn.set(ab.channel,aj);ad()}});X=P(ab.remote,{xdm_e:ab.local,xdm_c:ab.channel,xdm_p:2});T(ab.props,{src:X+"#"+ab.channel,name:U+ab.channel+"_provider"});aa=A(ab)}else{ab.remoteHelper=ab.remote;o.Fn.set(ab.channel,aj)}ai=A({props:{src:ab.local+"#_4"+ab.channel},onLoad:function ak(){var al=ai||this;x(al,"load",ak);o.Fn.set(ab.channel+"_load",Z);(function am(){if(typeof al.contentWindow.sendMessage=="function"){ad()}else{K(am,50)}}())}})},init:function(){G(ac.onDOMReady,ac)}})};o.stack.HashTransport=function(Z){var ac;var ah=this,af,aa,X,ad,am,ab,al;var ag,Y;function ak(ao){if(!al){return}var an=Z.remote+"#"+(am++)+"_"+ao;((af||!ag)?al.contentWindow:al).location=an}function ae(an){ad=an;ac.up.incoming(ad.substring(ad.indexOf("_")+1),Y)}function aj(){if(!ab){return}var an=ab.location.href,ap="",ao=an.indexOf("#");if(ao!=-1){ap=an.substring(ao)}if(ap&&ap!=ad){ae(ap)}}function ai(){aa=setInterval(aj,X)}return(ac={outgoing:function(an,ao){ak(an)},destroy:function(){N.clearInterval(aa);if(af||!ag){al.parentNode.removeChild(al)}al=null},onDOMReady:function(){af=Z.isHost;X=Z.interval;ad="#"+Z.channel;am=0;ag=Z.useParent;Y=j(Z.remote);if(af){Z.props={src:Z.remote,name:U+Z.channel+"_provider"};if(ag){Z.onLoad=function(){ab=N;ai();ac.up.callback(true)}}else{var ap=0,an=Z.delay/50;(function ao(){if(++ap>an){throw new Error("Unable to reference listenerwindow")}try{ab=al.contentWindow.frames[U+Z.channel+"_consumer"]}catch(aq){}if(ab){ai();ac.up.callback(true)}else{K(ao,50)}}())}al=A(Z)}else{ab=N;ai();if(ag){al=parent;ac.up.callback(true)}else{T(Z,{props:{src:Z.remote+"#"+Z.channel+new Date(),name:U+Z.channel+"_consumer"},onLoad:function(){ac.up.callback(true)}});al=A(Z)}}},init:function(){G(ac.onDOMReady,ac)}})};o.stack.ReliableBehavior=function(Y){var aa,ac;var ab=0,X=0,Z="";return(aa={incoming:function(af,ad){var ae=af.indexOf("_"),ag=af.substring(0,ae).split(",");af=af.substring(ae+1);if(ag[0]==ab){Z="";if(ac){ac(true)}}if(af.length>0){aa.down.outgoing(ag[1]+","+ab+"_"+Z,ad);if(X!=ag[1]){X=ag[1];aa.up.incoming(af,ad)}}},outgoing:function(af,ad,ae){Z=af;ac=ae;aa.down.outgoing(X+","+(++ab)+"_"+af,ad)}})};o.stack.QueueBehavior=function(Z){var ac,ad=[],ag=true,aa="",af,X=0,Y=false,ab=false;function ae(){if(Z.remove&&ad.length===0){w(ac);return}if(ag||ad.length===0||af){return}ag=true;var ah=ad.shift();ac.down.outgoing(ah.data,ah.origin,function(ai){ag=false;if(ah.callback){K(function(){ah.callback(ai)},0)}ae()})}return(ac={init:function(){if(t(Z)){Z={}}if(Z.maxLength){X=Z.maxLength;ab=true}if(Z.lazy){Y=true}else{ac.down.init()}},callback:function(ai){ag=false;var ah=ac.up;ae();ah.callback(ai)},incoming:function(ak,ai){if(ab){var aj=ak.indexOf("_"),ah=parseInt(ak.substring(0,aj),10);aa+=ak.substring(aj+1);if(ah===0){if(Z.encode){aa=k(aa)}ac.up.incoming(aa,ai);aa=""}}else{ac.up.incoming(ak,ai)}},outgoing:function(al,ai,ak){if(Z.encode){al=H(al)}var ah=[],aj;if(ab){while(al.length!==0){aj=al.substring(0,X);al=al.substring(aj.length);ah.push(aj)}while((aj=ah.shift())){ad.push({data:ah.length+"_"+aj,origin:ai,callback:ah.length===0?ak:null})}}else{ad.push({data:al,origin:ai,callback:ak})}if(Y){ac.down.init()}else{ae()}},destroy:function(){af=true;ac.down.destroy()}})};o.stack.VerifyBehavior=function(ab){var ac,aa,Y,Z=false;function X(){aa=Math.random().toString(16).substring(2);ac.down.outgoing(aa)}return(ac={incoming:function(af,ad){var ae=af.indexOf("_");if(ae===-1){if(af===aa){ac.up.callback(true)}else{if(!Y){Y=af;if(!ab.initiate){X()}ac.down.outgoing(af)}}}else{if(af.substring(0,ae)===Y){ac.up.incoming(af.substring(ae+1),ad)}}},outgoing:function(af,ad,ae){ac.down.outgoing(aa+"_"+af,ad,ae)},callback:function(ad){if(ab.initiate){X()}}})};o.stack.RpcBehavior=function(ad,Y){var aa,af=Y.serializer||O();var ae=0,ac={};function X(ag){ag.jsonrpc="2.0";aa.down.outgoing(af.stringify(ag))}function ab(ag,ai){var ah=Array.prototype.slice;return function(){var aj=arguments.length,al,ak={method:ai};if(aj>0&&typeof arguments[aj-1]==="function"){if(aj>1&&typeof arguments[aj-2]==="function"){al={success:arguments[aj-2],error:arguments[aj-1]};ak.params=ah.call(arguments,0,aj-2)}else{al={success:arguments[aj-1]};ak.params=ah.call(arguments,0,aj-1)}ac[""+(++ae)]=al;ak.id=ae}else{ak.params=ah.call(arguments,0)}if(ag.namedParams&&ak.params.length===1){ak.params=ak.params[0]}X(ak)}}function Z(an,am,ai,al){if(!ai){if(am){X({id:am,error:{code:-32601,message:"Procedure not found."}})}return}var ak,ah;if(am){ak=function(ao){ak=q;X({id:am,result:ao})};ah=function(ao,ap){ah=q;var aq={id:am,error:{code:-32099,message:ao}};if(ap){aq.error.data=ap}X(aq)}}else{ak=ah=q}if(!r(al)){al=[al]}try{var ag=ai.method.apply(ai.scope,al.concat([ak,ah]));if(!t(ag)){ak(ag)}}catch(aj){ah(aj.message)}}return(aa={incoming:function(ah,ag){var ai=af.parse(ah);if(ai.method){if(Y.handle){Y.handle(ai,X)}else{Z(ai.method,ai.id,Y.local[ai.method],ai.params)}}else{var aj=ac[ai.id];if(ai.error){if(aj.error){aj.error(ai.error)}}else{if(aj.success){aj.success(ai.result)}}delete ac[ai.id]}},init:function(){if(Y.remote){for(var ag in Y.remote){if(Y.remote.hasOwnProperty(ag)){ad[ag]=ab(Y.remote[ag],ag)}}}aa.down.init()},destroy:function(){for(var ag in Y.remote){if(Y.remote.hasOwnProperty(ag)&&ad.hasOwnProperty(ag)){delete ad[ag]}}aa.down.destroy()}})};b.easyXDM=o})(window,document,location,window.setTimeout,decodeURIComponent,encodeURIComponent);; /*! - * F2 v1.1.1 + * F2 v1.1.2 * Copyright (c) 2013 Markit On Demand, Inc. http://www.openf2.org * * Permission is hereby granted, free of charge, to any person obtaining a copy @@ -114,7 +114,7 @@ var $, jQuery = $ = window.jQuery.noConflict(true); * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ -;var F2;F2={appConfigReplacer:function(e,t){return e=="root"||e=="ui"||e=="height"?undefined:t},Apps:{},extend:function(e,t,n){var r=typeof t=="function",i=e?e.split("."):[],s=this;t=t||{},i[0]==="F2"&&(i=i.slice(1));for(var o=0,u=i.length;o-1},log:function(){window.console&&window.console.log&&console.log([].slice.call(arguments))},parse:function(e){return JSON.parse(e)},stringify:function(e,t,n){return JSON.stringify(e,t,n)},version:function(){return"1.1.1"}}; +;var F2;F2={appConfigReplacer:function(e,t){return e=="root"||e=="ui"||e=="height"?undefined:t},Apps:{},extend:function(e,t,n){var r=typeof t=="function",i=e?e.split("."):[],s=this;t=t||{},i[0]==="F2"&&(i=i.slice(1));for(var o=0,u=i.length;o-1},log:function(){window.console&&window.console.log&&console.log([].slice.call(arguments))},parse:function(e){return JSON.parse(e)},stringify:function(e,t,n){return JSON.stringify(e,t,n)},version:function(){return"1.1.2"}}; F2.extend("",{App:function(e,t,n){return{init:function(){}}},AppConfig:{appId:"",context:{},enableBatchRequests:!1,height:0,instanceId:"",isSecure:!1,manifestUrl:"",maxWidth:0,minGridSize:4,minWidth:300,name:"",root:undefined,ui:undefined,views:[]},AppManifest:{apps:[],inlineScripts:[],scripts:[],styles:[]},AppContent:{data:{},html:"",status:""},ContainerConfig:{afterAppRender:function(e,t){},appRender:function(e,t){},beforeAppRender:function(e){},isSecureAppPage:!1,UI:{Mask:{backgroundColor:"#FFF",loadingIcon:"",opacity:.6,useClasses:!1,zIndex:2}},secureAppPagePath:"",supportedViews:[]}}); F2.extend("Constants",{Css:function(){var e="f2-";return{APP:e+"app",APP_CONTAINER:e+"app-container",APP_TITLE:e+"app-title",APP_VIEW:e+"app-view",APP_VIEW_TRIGGER:e+"app-view-trigger",MASK:e+"mask",MASK_CONTAINER:e+"mask-container"}}(),Events:function(){var e="App.",t="Container.";return{APP_SYMBOL_CHANGE:e+"symbolChange",APP_WIDTH_CHANGE:e+"widthChange.",CONTAINER_SYMBOL_CHANGE:t+"symbolChange",CONTAINER_WIDTH_CHANGE:t+"widthChange"}}(),JSONP_CALLBACK:"F2_jsonpCallback_",Sockets:{EVENT:"__event__",LOAD:"__socketLoad__",RPC:"__rpc__",RPC_CALLBACK:"__rpcCallback__",UI_RPC:"__uiRpc__"},Views:{DATA_ATTRIBUTE:"data-f2-view",ABOUT:"about",HELP:"help",HOME:"home",REMOVE:"remove",SETTINGS:"settings"}}); F2.extend("Events",function(){var e=new EventEmitter2({wildcard:!0});return e.setMaxListeners(0),{_socketEmit:function(){return EventEmitter2.prototype.emit.apply(e,[].slice.call(arguments))},emit:function(){return F2.Rpc.broadcast(F2.Constants.Sockets.EVENT,[].slice.call(arguments)),EventEmitter2.prototype.emit.apply(e,[].slice.call(arguments))},many:function(t,n,r){return e.many(t,n,r)},off:function(t,n){return e.off(t,n)},on:function(t,n){return e.on(t,n)},once:function(t,n){return e.once(t,n)}}}()); diff --git a/docs/sdk/classes/F2.App.html b/docs/sdk/classes/F2.App.html index a4092ff1..0cbd27cd 100644 --- a/docs/sdk/classes/F2.App.html +++ b/docs/sdk/classes/F2.App.html @@ -3,8 +3,8 @@ F2 - F2.App - - + + @@ -25,7 +25,7 @@