diff --git a/misc/theme-cicada/Makefile b/misc/theme-cicada/Makefile new file mode 100644 index 0000000000..afe844dc19 --- /dev/null +++ b/misc/theme-cicada/Makefile @@ -0,0 +1,8 @@ +PLUGIN_NAME= Theme-Cicada +PLUGIN_VERSION= 0.1 +PLUGIN_REVISION= 1 +PLUGIN_COMMENT= grey-orange theme +PLUGIN_MAINTAINER= remic-webdesign@chello.at +PLUGIN_DEVEL= yes + +.include "../../Mk/plugins.mk" \ No newline at end of file diff --git a/misc/theme-cicada/pkg-descr b/misc/theme-cicada/pkg-descr new file mode 100644 index 0000000000..73866b41c6 --- /dev/null +++ b/misc/theme-cicada/pkg-descr @@ -0,0 +1,4 @@ +Cicada Theme +Orange Grey Dark + +Email: remic-webdesign@chello.at diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/LICENSE b/misc/theme-cicada/src/opnsense/www/themes/cicada/LICENSE new file mode 100644 index 0000000000..4e7f5527ba --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2013-2014 bootstrap-select + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.eot b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.eot new file mode 100644 index 0000000000..e9f423425c Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.eot differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.otf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.otf new file mode 100644 index 0000000000..98dbee74d5 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.otf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.ttf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.ttf new file mode 100644 index 0000000000..5d65c93242 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.ttf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.woff b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.woff new file mode 100644 index 0000000000..d1d40f840f Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Bold/SourceSansPro-Bold.woff differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.eot b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.eot new file mode 100644 index 0000000000..ba7f8d9515 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.eot differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.otf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.otf new file mode 100644 index 0000000000..bdcfb27a4f Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.otf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.ttf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.ttf new file mode 100644 index 0000000000..44486cdc67 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.ttf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.woff b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.woff new file mode 100644 index 0000000000..460ab12a63 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Regular/SourceSansPro-Regular.woff differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.eot b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.eot new file mode 100644 index 0000000000..2f7a52c454 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.eot differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.otf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.otf new file mode 100644 index 0000000000..fffdbafeb7 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.otf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.ttf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.ttf new file mode 100644 index 0000000000..86b00c067e Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.ttf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.woff b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.woff new file mode 100644 index 0000000000..43379631b2 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/SourceSansPro-Semibold/SourceSansPro-Semibold.woff differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.eot b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.eot new file mode 100644 index 0000000000..4a4ca865d6 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.eot differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.svg b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.svg new file mode 100644 index 0000000000..e3e2dc739d --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.svg @@ -0,0 +1,229 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf new file mode 100644 index 0000000000..67fa00bf83 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.woff b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.woff new file mode 100644 index 0000000000..8c54182aa5 Binary files /dev/null and b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/fonts/bootstrap/glyphicons-halflings-regular.woff differ diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-compass.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-compass.scss new file mode 100644 index 0000000000..82706c47c5 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-compass.scss @@ -0,0 +1,7 @@ +@function twbs-font-path($path) { + @return font-url($path, true); +} + +@function twbs-image-path($path) { + @return image-url($path, true); +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-mincer.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-mincer.scss new file mode 100644 index 0000000000..34132501f2 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-mincer.scss @@ -0,0 +1,17 @@ +// Mincer asset helper functions +// +// This must be imported into a .css.ejs.scss file. +// Then, <% %>-interpolations will be parsed as strings by Sass, and evaluated by EJS after Sass compilation. + + +@function twbs-font-path($path) { + // do something like following + // from "path/to/font.ext#suffix" to "<%- asset_path(path/to/font.ext)) + #suffix %>" + // from "path/to/font.ext?#suffix" to "<%- asset_path(path/to/font.ext)) + ?#suffix %>" + // or from "path/to/font.ext" just "<%- asset_path(path/to/font.ext)) %>" + @return "<%- asset_path('#{$path}'.replace(/[#?].*$/, '')) + '#{$path}'.replace(/(^[^#?]*)([#?]?.*$)/, '$2') %>"; +} + +@function twbs-image-path($file) { + @return "<%- asset_path('#{$file}') %>"; +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-sprockets.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-sprockets.scss new file mode 100644 index 0000000000..7d3069280e --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/_bootstrap-sprockets.scss @@ -0,0 +1,7 @@ +@function twbs-font-path($path) { + @return font-path($path); +} + +@function twbs-image-path($path) { + @return image-path($path); +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-dialog.less b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-dialog.less new file mode 100644 index 0000000000..8fbd3f7596 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-dialog.less @@ -0,0 +1,137 @@ +.modal-backdrop { + z-index: -1; +} + +.bootstrap-dialog { + + .modal-header { + border-top-left-radius: 4px; + border-top-right-radius: 4px; + } + .bootstrap-dialog-title { + color: #fff; + display: inline-block; + } + .bootstrap-dialog-button-icon { + margin-right: 3px; + } + .bootstrap-dialog-close-button { + float: right; + filter:alpha(opacity=90); + -moz-opacity:0.9; + -khtml-opacity: 0.9; + opacity: 0.9; + &:hover { + cursor: pointer; + filter: alpha(opacity=100); + -moz-opacity: 1; + -khtml-opacity: 1; + opacity: 1; + } + } + + /* dialog types */ + &.type-default { + .modal-header { + background-color: #fff; + } + .bootstrap-dialog-title { + color: #333; + } + } + + &.type-info { + .modal-header { + background-color: #B0CDDB; + } + } + + &.type-primary { + .modal-header { + background-color: #EA7105; + } + } + + &.type-success { + .modal-header { + background-color: #9BD275; + } + } + + &.type-warning { + .modal-header { + background-color: #f0ad4e; + } + } + + &.type-danger { + .modal-header { + background-color: #d9534f; + } + } + + &.size-large { + .bootstrap-dialog-title { + font-size: 24px; + } + .bootstrap-dialog-close-button { + font-size: 30px; + } + .bootstrap-dialog-message { + font-size: 18px; + } + } + + /** + * Icon animation + * Copied from font-awesome: http://fontawesome.io/ + **/ + .icon-spin { + display: inline-block; + -moz-animation: spin 2s infinite linear; + -o-animation: spin 2s infinite linear; + -webkit-animation: spin 2s infinite linear; + animation: spin 2s infinite linear; + } + @-moz-keyframes spin { + 0% { + -moz-transform: rotate(0deg); + } + 100% { + -moz-transform: rotate(359deg); + } + } + @-webkit-keyframes spin { + 0% { + -webkit-transform: rotate(0deg); + } + 100% { + -webkit-transform: rotate(359deg); + } + } + @-o-keyframes spin { + 0% { + -o-transform: rotate(0deg); + } + 100% { + -o-transform: rotate(359deg); + } + } + @-ms-keyframes spin { + 0% { + -ms-transform: rotate(0deg); + } + 100% { + -ms-transform: rotate(359deg); + } + } + @keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(359deg); + } + } + /** End of icon animation **/ +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/css/bootstrap-select.css b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/css/bootstrap-select.css new file mode 100644 index 0000000000..f99797782c --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/css/bootstrap-select.css @@ -0,0 +1,259 @@ +.bootstrap-select { + width: 348px \0; + /*IE9 and below*/ +} +.bootstrap-select > .dropdown-toggle { + width: 100%; + padding-right: 25px; + z-index: 1; +} +.bootstrap-select > select { + position: absolute !important; + bottom: 0; + left: 50%; + width: 0.11px !important; + height: 100% !important; + padding: 0 !important; + opacity: 0 !important; + border: none; +} +.bootstrap-select > select.mobile-device { + top: 0; + left: 0; + display: block !important; + width: 100% !important; + z-index: 2; +} +.has-error .bootstrap-select .dropdown-toggle, +.error .bootstrap-select .dropdown-toggle { + border-color: #b94a48; +} +.bootstrap-select.fit-width { + width: auto !important; +} +.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) { + width: 348px; +} +.bootstrap-select .dropdown-toggle:focus { + outline: thin dotted #333333 !important; + outline: 5px auto -webkit-focus-ring-color !important; + outline-offset: -2px; +} +.bootstrap-select.form-control { + margin-bottom: 0; + padding: 0; + border: none; +} +.bootstrap-select.form-control:not([class*="col-"]) { + width: 100%; +} +.bootstrap-select.form-control.input-group-btn { + z-index: auto; +} +.bootstrap-select.btn-group:not(.input-group-btn), +.bootstrap-select.btn-group[class*="col-"] { + float: none; + display: inline-block; + margin-left: 0; +} +.bootstrap-select.btn-group.dropdown-menu-right, +.bootstrap-select.btn-group[class*="col-"].dropdown-menu-right, +.row .bootstrap-select.btn-group[class*="col-"].dropdown-menu-right { + float: right; +} +.form-inline .bootstrap-select.btn-group, +.form-horizontal .bootstrap-select.btn-group, +.form-group .bootstrap-select.btn-group { + margin-bottom: 0; +} +.form-group-lg .bootstrap-select.btn-group.form-control, +.form-group-sm .bootstrap-select.btn-group.form-control { + padding: 0; +} +.form-inline .bootstrap-select.btn-group .form-control { + width: 100%; +} +.bootstrap-select.btn-group.disabled, +.bootstrap-select.btn-group > .disabled { + cursor: not-allowed; +} +.bootstrap-select.btn-group.disabled:focus, +.bootstrap-select.btn-group > .disabled:focus { + outline: none !important; +} +.bootstrap-select.btn-group.bs-container { + position: absolute; +} +.bootstrap-select.btn-group.bs-container .dropdown-menu { + z-index: 1035; +} +.bootstrap-select.btn-group .dropdown-toggle .filter-option { + display: inline-block; + overflow: hidden; + width: 100%; + text-align: left; +} +.bootstrap-select.btn-group .dropdown-toggle .caret { + position: absolute; + top: 50%; + right: 12px; + margin-top: -2px; + vertical-align: middle; +} +.bootstrap-select.btn-group[class*="col-"] .dropdown-toggle { + width: 100%; +} +.bootstrap-select.btn-group .dropdown-menu { + min-width: 100%; + box-sizing: border-box; +} +.bootstrap-select.btn-group .dropdown-menu.inner { + position: static; + float: none; + border: 0; + padding: 0; + margin: 0; + border-radius: 0; + box-shadow: none; +} +.bootstrap-select.btn-group .dropdown-menu li { + position: relative; +} +.bootstrap-select.btn-group .dropdown-menu li.active small { + color: #333; +} +.bootstrap-select.btn-group .dropdown-menu li.disabled a { + cursor: not-allowed; +} +.bootstrap-select.btn-group .dropdown-menu li a { + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.bootstrap-select.btn-group .dropdown-menu li a.opt { + position: relative; + padding-left: 2.25em; +} +.bootstrap-select.btn-group .dropdown-menu li a span.check-mark { + display: none; +} +.bootstrap-select.btn-group .dropdown-menu li a span.text { + display: inline-block; +} +.bootstrap-select.btn-group .dropdown-menu li small { + padding-left: 0.5em; +} +.bootstrap-select.btn-group .dropdown-menu .notify { + position: absolute; + bottom: 5px; + width: 96%; + margin: 0 2%; + min-height: 26px; + padding: 3px 5px; + background: #f5f5f5; + border: 1px solid #e3e3e3; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); + pointer-events: none; + opacity: 0.9; + box-sizing: border-box; +} +.bootstrap-select.btn-group .no-results { + padding: 3px; + background: #f5f5f5; + margin: 0 5px; + white-space: nowrap; +} +.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option { + position: static; +} +.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret { + position: static; + top: auto; + margin-top: -1px; +} +.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark { + position: absolute; + display: inline-block; + right: 15px; + margin-top: 5px; +} +.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text { + margin-right: 34px; +} +.bootstrap-select.show-menu-arrow.open > .dropdown-toggle { + z-index: 1036; +} +.bootstrap-select.show-menu-arrow .dropdown-toggle:before { + content: ''; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + border-bottom: 7px solid rgba(204, 204, 204, 0.2); + position: absolute; + bottom: -4px; + left: 9px; + display: none; +} +.bootstrap-select.show-menu-arrow .dropdown-toggle:after { + content: ''; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid white; + position: absolute; + bottom: -4px; + left: 10px; + display: none; +} +.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before { + bottom: auto; + top: -3px; + border-top: 7px solid rgba(204, 204, 204, 0.2); + border-bottom: 0; +} +.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after { + bottom: auto; + top: -3px; + border-top: 6px solid white; + border-bottom: 0; +} +.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before { + right: 12px; + left: auto; +} +.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after { + right: 13px; + left: auto; +} +.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:before, +.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:after { + display: block; +} +.bs-searchbox, +.bs-actionsbox, +.bs-donebutton { + padding: 4px 8px; +} +.bs-actionsbox { + width: 100%; + box-sizing: border-box; +} +.bs-actionsbox .btn-group button { + width: 50%; +} +.bs-donebutton { + float: left; + width: 100%; + box-sizing: border-box; +} +.bs-donebutton .btn-group button { + width: 100%; +} +.bs-searchbox + .bs-actionsbox { + padding: 0 8px 4px; +} +.bs-searchbox .form-control { + margin-bottom: 0; + width: 100%; + float: none; +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/css/variables.css b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/css/variables.css new file mode 100644 index 0000000000..e69de29bb2 diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/bootstrap-select.less b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/bootstrap-select.less new file mode 100644 index 0000000000..49f13a7021 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/bootstrap-select.less @@ -0,0 +1,348 @@ +@import "variables"; + +// Mixins +.cursor-disabled() { + cursor: not-allowed; +} + +// Rules +.bootstrap-select { + width: 348px \0; /*IE9 and below*/ + + // The selectpicker button + > .dropdown-toggle { + width: 100%; + padding-right: 25px; + z-index: 1; + } + + > select { + position: absolute !important; + bottom: 0; + left: 50%; + width: 0.11px !important; + height: 100% !important; + padding: 0 !important; + opacity: 0 !important; + border: none; + + &.mobile-device { + top: 0; + left: 0; + display: block !important; + width: 100% !important; + z-index: 2; + } + } + + // Error display + .has-error & .dropdown-toggle, + .error & .dropdown-toggle { + border-color: @color-red-error; + } + + &.fit-width { + width: auto !important; + } + + &:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) { + width: @width-default; + } + + .dropdown-toggle:focus { + outline: thin dotted #333333 !important; + outline: 5px auto -webkit-focus-ring-color !important; + outline-offset: -2px; + } +} + +.bootstrap-select.form-control { + margin-bottom: 0; + padding: 0; + border: none; + + &:not([class*="col-"]) { + width: 100%; + } + + &.input-group-btn { + z-index: auto; + } +} + +// The selectpicker components +.bootstrap-select.btn-group { + &:not(.input-group-btn), + &[class*="col-"] { + float: none; + display: inline-block; + margin-left: 0; + } + + // Forces the pull to the right, if necessary + &, + &[class*="col-"], + .row &[class*="col-"] { + &.dropdown-menu-right { + float: right; + } + } + + .form-inline &, + .form-horizontal &, + .form-group & { + margin-bottom: 0; + } + + .form-group-lg &.form-control, + .form-group-sm &.form-control { + padding: 0; + } + + // Set the width of the live search (and any other form control within an inline form) + // see https://github.com/silviomoreto/bootstrap-select/issues/685 + .form-inline & .form-control { + width: 100%; + } + + &.disabled, + > .disabled { + .cursor-disabled(); + + &:focus { + outline: none !important; + } + } + + &.bs-container { + position: absolute; + + .dropdown-menu { + z-index: @zindex-select-dropdown; + } + } + + // The selectpicker button + .dropdown-toggle { + .filter-option { + display: inline-block; + overflow: hidden; + width: 100%; + text-align: left; + } + + .caret { + position: absolute; + top: 50%; + right: 12px; + margin-top: -2px; + vertical-align: middle; + } + } + + &[class*="col-"] .dropdown-toggle { + width: 100%; + } + + // The selectpicker dropdown + .dropdown-menu { + min-width: 100%; + box-sizing: border-box; + + &.inner { + position: static; + float: none; + border: 0; + padding: 0; + margin: 0; + border-radius: 0; + box-shadow: none; + } + + li { + position: relative; + + &.active small { + color: #fff; + } + + &.disabled a { + .cursor-disabled(); + } + + a { + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + + &.opt { + position: relative; + padding-left: 2.25em; + } + + span.check-mark { + display: none; + } + + span.text { + display: inline-block; + } + } + + small { + padding-left: 0.5em; + } + } + + .notify { + position: absolute; + bottom: 5px; + width: 96%; + margin: 0 2%; + min-height: 26px; + padding: 3px 5px; + background: rgb(245, 245, 245); + border: 1px solid rgb(227, 227, 227); + box-shadow: inset 0 1px 1px fade(rgb(0, 0, 0), 5%); + pointer-events: none; + opacity: 0.9; + box-sizing: border-box; + } + } + + .no-results { + padding: 3px; + background: #f5f5f5; + margin: 0 5px; + white-space: nowrap; + } + + &.fit-width .dropdown-toggle { + .filter-option { + position: static; + } + + .caret { + position: static; + top: auto; + margin-top: -1px; + } + } + + &.show-tick .dropdown-menu li { + &.selected a span.check-mark { + position: absolute; + display: inline-block; + right: 15px; + margin-top: 5px; + } + + a span.text { + margin-right: 34px; + } + } +} + +.bootstrap-select.show-menu-arrow { + &.open > .dropdown-toggle { + z-index: (@zindex-select-dropdown + 1); + } + + .dropdown-toggle { + &:before { + content: ''; + border-left: 7px solid transparent; + border-right: 7px solid transparent; + border-bottom: 7px solid @color-grey-arrow; + position: absolute; + bottom: -4px; + left: 9px; + display: none; + } + + &:after { + content: ''; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid white; + position: absolute; + bottom: -4px; + left: 10px; + display: none; + } + } + + &.dropup .dropdown-toggle { + &:before { + bottom: auto; + top: -3px; + border-top: 7px solid @color-grey-arrow; + border-bottom: 0; + } + + &:after { + bottom: auto; + top: -3px; + border-top: 6px solid white; + border-bottom: 0; + } + } + + &.pull-right .dropdown-toggle { + &:before { + right: 12px; + left: auto; + } + + &:after { + right: 13px; + left: auto; + } + } + + &.open > .dropdown-toggle { + &:before, + &:after { + display: block; + } + } +} + +.bs-searchbox, +.bs-actionsbox, +.bs-donebutton { + padding: 4px 8px; +} + +.bs-actionsbox { + width: 100%; + box-sizing: border-box; + + & .btn-group button { + width: 50%; + } +} + +.bs-donebutton { + float: left; + width: 100%; + box-sizing: border-box; + + & .btn-group button { + width: 100%; + } +} + +.bs-searchbox { + & + .bs-actionsbox { + padding: 0 8px 4px; + } + + & .form-control { + margin-bottom: 0; + width: 100%; + float: none; + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/variables.less b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/variables.less new file mode 100644 index 0000000000..97a510c23a --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap-select/less/variables.less @@ -0,0 +1,7 @@ +@color-red-error: rgb(185, 74, 72); +@color-blue-hover: rgba(100, 177, 216, 0.4); +@color-grey-arrow: rgba(204, 204, 204, 0.2); + +@width-default: 348px; // 3 960px-grid columns + +@zindex-select-dropdown: 1035; // must be lower than a modal background (1040) but higher than the fixed navbar (1030) diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_alerts.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_alerts.scss new file mode 100644 index 0000000000..e45de83058 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_alerts.scss @@ -0,0 +1,68 @@ +// +// Alerts +// -------------------------------------------------- + + +// Base styles +// ------------------------- + +.alert { + padding: $alert-padding; + margin-bottom: $line-height-computed; + border: 1px solid transparent; + border-radius: $alert-border-radius; + + // Headings for larger alerts + h4 { + margin-top: 0; + // Specified for the h4 to prevent conflicts of changing $headings-color + color: inherit; + } + // Provide class for links that match alerts + .alert-link { + font-weight: $alert-link-font-weight; + } + + // Improve alignment and spacing of inner content + > p, + > ul { + margin-bottom: 0; + } + > p + p { + margin-top: 5px; + } +} + +// Dismissible alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0. +.alert-dismissible { + padding-right: ($alert-padding + 20); + + // Adjust close link position + .close { + position: relative; + top: -2px; + right: -21px; + color: inherit; + } +} + +// Alternate styles +// +// Generate contextual modifier classes for colorizing the alert. + +.alert-success { + @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text); +} +.alert-info { + @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text); +} +.alert-warning { + @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text); +} +.alert-danger { + @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text); +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_badges.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_badges.scss new file mode 100644 index 0000000000..02394ae7fa --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_badges.scss @@ -0,0 +1,57 @@ +// +// Badges +// -------------------------------------------------- + + +// Base class +.badge { + display: inline-block; + min-width: 10px; + padding: 3px 7px; + font-size: $font-size-small; + font-weight: $badge-font-weight; + color: $badge-color; + line-height: $badge-line-height; + vertical-align: baseline; + white-space: nowrap; + text-align: center; + background-color: $badge-bg; + border-radius: $badge-border-radius; + + // Empty badges collapse automatically (not available in IE8) + &:empty { + display: none; + } + + // Quick fix for badges in buttons + .btn & { + position: relative; + top: -1px; + } + .btn-xs & { + top: 0; + padding: 1px 5px; + } + + // [converter] extracted a& to a.badge + + // Account for badges in navs + a.list-group-item.active > &, + .nav-pills > .active > a > & { + color: $badge-active-color; + background-color: $badge-active-bg; + } + .nav-pills > li > a > & { + margin-left: 3px; + } +} + +// Hover state, but only for links +a.badge { + &:hover, + &:focus { + color: $badge-link-hover-color; + text-decoration: none; + cursor: pointer; + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_breadcrumbs.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_breadcrumbs.scss new file mode 100644 index 0000000000..3641e333b8 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_breadcrumbs.scss @@ -0,0 +1,26 @@ +// +// Breadcrumbs +// -------------------------------------------------- + + +.breadcrumb { + padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal; + margin-bottom: $line-height-computed; + list-style: none; + background-color: $breadcrumb-bg; + border-radius: $border-radius-base; + + > li { + display: inline-block; + + + li:before { + content: "#{$breadcrumb-separator}\00a0"; // Unicode space added since inline-block means non-collapsing white-space + padding: 0 5px; + color: $breadcrumb-color; + } + } + + > .active { + color: $breadcrumb-active-color; + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_button-groups.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_button-groups.scss new file mode 100644 index 0000000000..63ccd927c8 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_button-groups.scss @@ -0,0 +1,240 @@ +// +// Button groups +// -------------------------------------------------- + +// Make the div behave like a button +.btn-group, +.btn-group-vertical { + position: relative; + display: inline-block; + vertical-align: middle; // match .btn alignment given font-size hack above + > .btn { + position: relative; + float: left; + // Bring the "active" button to the front + &:hover, + &:focus, + &:active, + &.active { + z-index: 2; + } + &:focus { + // Remove focus outline when dropdown JS adds it after closing the menu + outline: 0; + } + } +} + +// Prevent double borders when buttons are next to each other +.btn-group { + .btn + .btn, + .btn + .btn-group, + .btn-group + .btn, + .btn-group + .btn-group { + margin-left: -1px; + } +} + +// Optional: Group multiple button groups together for a toolbar +.btn-toolbar { + margin-left: -5px; // Offset the first child's margin + @include clearfix(); + + .btn-group, + .input-group { + float: left; + } + > .btn, + > .btn-group, + > .input-group { + margin-left: 5px; + } +} + +.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { + border-radius: 0; +} + +// 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; + &:not(:last-child):not(.dropdown-toggle) { + @include border-right-radius(0); + } +} +// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it +.btn-group > .btn:last-child:not(:first-child), +.btn-group > .dropdown-toggle:not(:first-child) { + @include border-left-radius(0); +} + +// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group) +.btn-group > .btn-group { + float: left; +} +.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group > .btn-group:first-child { + > .btn:last-child, + > .dropdown-toggle { + @include border-right-radius(0); + } +} +.btn-group > .btn-group:last-child > .btn:first-child { + @include border-left-radius(0); +} + +// On active and open, don't show outline +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle { + outline: 0; +} + + +// Sizing +// +// Remix the default button sizing classes into new ones for easier manipulation. + +.btn-group-xs > .btn { @extend .btn-xs; } +.btn-group-sm > .btn { @extend .btn-sm; } +.btn-group-lg > .btn { @extend .btn-lg; } + + +// Split button dropdowns +// ---------------------- + +// Give the line between buttons some depth +.btn-group > .btn + .dropdown-toggle { + padding-left: 8px; + padding-right: 8px; +} +.btn-group > .btn-lg + .dropdown-toggle { + padding-left: 12px; + padding-right: 12px; +} + +// The clickable button for toggling the menu +// Remove the gradient and set the same inset shadow as the :active state +.btn-group.open .dropdown-toggle { + @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + + // Show no shadow for `.btn-link` since it has no other button styles. + &.btn-link { + @include box-shadow(none); + } +} + + +// Reposition the caret +.btn .caret { + margin-left: 0; +} +// Carets in other button sizes +.btn-lg .caret { + border-width: $caret-width-large $caret-width-large 0; + border-bottom-width: 0; +} +// Upside down carets for .dropup +.dropup .btn-lg .caret { + border-width: 0 $caret-width-large $caret-width-large; +} + + +// Vertical button groups +// ---------------------- + +.btn-group-vertical { + > .btn, + > .btn-group, + > .btn-group > .btn { + display: block; + float: none; + width: 100%; + max-width: 100%; + } + + // Clear floats so dropdown menus can be properly placed + > .btn-group { + @include clearfix(); + > .btn { + float: none; + } + } + + > .btn + .btn, + > .btn + .btn-group, + > .btn-group + .btn, + > .btn-group + .btn-group { + margin-top: -1px; + margin-left: 0; + } +} + +.btn-group-vertical > .btn { + &:not(:first-child):not(:last-child) { + border-radius: 0; + } + &:first-child:not(:last-child) { + border-top-right-radius: $border-radius-base; + @include border-bottom-radius(0); + } + &:last-child:not(:first-child) { + border-bottom-left-radius: $border-radius-base; + @include border-top-radius(0); + } +} +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group-vertical > .btn-group:first-child:not(:last-child) { + > .btn:last-child, + > .dropdown-toggle { + @include border-bottom-radius(0); + } +} +.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { + @include border-top-radius(0); +} + + + +// Justified button groups +// ---------------------- + +.btn-group-justified { + display: table; + width: 100%; + table-layout: fixed; + border-collapse: separate; + > .btn, + > .btn-group { + float: none; + display: table-cell; + width: 1%; + } + > .btn-group .btn { + width: 100%; + } + + > .btn-group .dropdown-menu { + left: auto; + } +} + + +// Checkbox and radio options +// +// In order to support the browser's form validation feedback, powered by the +// `required` attribute, we have to "hide" the inputs via `opacity`. We cannot +// use `display: none;` or `visibility: hidden;` as that also hides the popover. +// This way, we ensure a DOM element is visible to position the popover from. +// +// See https://github.com/twbs/bootstrap/pull/12794 for more. + +[data-toggle="buttons"] > .btn > input[type="radio"], +[data-toggle="buttons"] > .btn > input[type="checkbox"] { + position: absolute; + z-index: -1; + @include opacity(0); +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_buttons.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_buttons.scss new file mode 100644 index 0000000000..f2684c1b76 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_buttons.scss @@ -0,0 +1,159 @@ +// +// Buttons +// -------------------------------------------------- + + +// Base styles +// -------------------------------------------------- + +.btn { + display: inline-block; + margin-bottom: 0; // For input.btn + font-weight: $btn-font-weight; + text-align: center; + vertical-align: middle; + cursor: pointer; + background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid transparent; + white-space: nowrap; + @include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $border-radius-base); + @include user-select(none); + + @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border); + + &, + &:active, + &.active { + &:focus { + @include tab-focus(); + } + } + + &:hover, + &:focus { + color: $btn-default-color; + text-decoration: none; + } + + &:active, + &.active { + outline: 0; + background-image: none; + @include box-shadow(inset 0 3px 5px rgba(0,0,0,.125)); + } + + &.disabled, + &[disabled], + fieldset[disabled] & { + cursor: not-allowed; + pointer-events: none; // Future-proof disabling of clicks + @include opacity(.65); + @include box-shadow(none); + } +} + + +// Alternate buttons +// -------------------------------------------------- + +.btn-default { + @include button-variant($btn-default-color, $btn-default-bg, $btn-default-border); +} +.btn-primary { + @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border); +} +// Success appears as green +.btn-success { + @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border); +} +// Info appears as blue-green +.btn-info { + @include button-variant($btn-info-color, $btn-info-bg, $btn-info-border); +} +// Warning appears as orange +.btn-warning { + @include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border); +} +// Danger and error appear as red +.btn-danger { + @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border); +} + + +// Link buttons +// ------------------------- + +// Make a button look and behave like a link +.btn-link { + color: $link-color; + font-weight: normal; + cursor: pointer; + border-radius: 0; + + &, + &:active, + &[disabled], + fieldset[disabled] & { + background-color: transparent; + @include box-shadow(none); + } + &, + &:hover, + &:focus, + &:active { + border-color: transparent; + } + &:hover, + &:focus { + color: $link-hover-color; + text-decoration: underline; + background-color: transparent; + } + &[disabled], + fieldset[disabled] & { + &:hover, + &:focus { + color: $btn-link-disabled-color; + text-decoration: none; + } + } +} + + +// Button Sizes +// -------------------------------------------------- + +.btn-lg { + // line-height: ensure even-numbered height of button next to large input + @include button-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large); +} +.btn-sm { + // line-height: ensure proper height of button next to small input + @include button-size($padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small); +} +.btn-xs { + @include button-size($padding-xs-vertical, $padding-xs-horizontal, $font-size-small, $line-height-small, $border-radius-small); +} + + +// Block button +// -------------------------------------------------- + +.btn-block { + display: block; + width: 100%; +} + +// 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%; + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_carousel.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_carousel.scss new file mode 100644 index 0000000000..e9e2f7ce1e --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_carousel.scss @@ -0,0 +1,243 @@ +// +// Carousel +// -------------------------------------------------- + + +// Wrapper for the slide container and indicators +.carousel { + position: relative; +} + +.carousel-inner { + position: relative; + overflow: hidden; + width: 100%; + + > .item { + display: none; + position: relative; + @include transition(.6s ease-in-out left); + + // Account for jankitude on images + > img, + > a > img { + @include img-responsive(); + 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: 0; + left: 0; + bottom: 0; + width: $carousel-control-width; + @include opacity($carousel-control-opacity); + font-size: $carousel-control-font-size; + color: $carousel-control-color; + text-align: center; + text-shadow: $carousel-text-shadow; + // We can't have this transition here because WebKit cancels the carousel + // animation if you trip this while in the middle of another animation. + + // Set gradients for backgrounds + &.left { + @include gradient-horizontal($start-color: rgba(0,0,0,.5), $end-color: rgba(0,0,0,.0001)); + } + &.right { + left: auto; + right: 0; + @include gradient-horizontal($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.5)); + } + + // Hover/focus state + &:hover, + &:focus { + outline: 0; + color: $carousel-control-color; + text-decoration: none; + @include opacity(.9); + } + + // Toggles + .icon-prev, + .icon-next, + .glyphicon-chevron-left, + .glyphicon-chevron-right { + position: absolute; + top: 50%; + z-index: 5; + display: inline-block; + } + .icon-prev, + .glyphicon-chevron-left { + left: 50%; + margin-left: -10px; + } + .icon-next, + .glyphicon-chevron-right { + right: 50%; + margin-right: -10px; + } + .icon-prev, + .icon-next { + width: 20px; + height: 20px; + margin-top: -10px; + font-family: serif; + } + + + .icon-prev { + &:before { + content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039) + } + } + .icon-next { + &:before { + content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A) + } + } +} + +// Optional indicator pips +// +// Add an unordered list with the following class and add a list item for each +// slide your carousel holds. + +.carousel-indicators { + position: absolute; + bottom: 10px; + left: 50%; + z-index: 15; + width: 60%; + margin-left: -30%; + padding-left: 0; + list-style: none; + text-align: center; + + li { + display: inline-block; + width: 10px; + height: 10px; + margin: 1px; + text-indent: -999px; + border: 1px solid $carousel-indicator-border-color; + border-radius: 10px; + cursor: pointer; + + // IE8-9 hack for event handling + // + // Internet Explorer 8-9 does not support clicks on elements without a set + // `background-color`. We cannot use `filter` since that's not viewed as a + // background color by the browser. Thus, a hack is needed. + // + // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we + // set alpha transparency for the best results possible. + background-color: #000 \9; // IE8 + background-color: rgba(0,0,0,0); // IE9 + } + .active { + margin: 0; + width: 12px; + height: 12px; + background-color: $carousel-indicator-active-bg; + } +} + +// Optional captions +// ----------------------------- +// Hidden by default for smaller viewports +.carousel-caption { + position: absolute; + left: 15%; + right: 15%; + bottom: 20px; + z-index: 10; + padding-top: 20px; + padding-bottom: 20px; + color: $carousel-caption-color; + text-align: center; + text-shadow: $carousel-text-shadow; + & .btn { + text-shadow: none; // No shadow for button elements in carousel-caption + } +} + + +// Scale up controls for tablets and up +@media screen and (min-width: $screen-sm-min) { + + // Scale up the controls a smidge + .carousel-control { + .glyphicon-chevron-left, + .glyphicon-chevron-right, + .icon-prev, + .icon-next { + width: 30px; + height: 30px; + margin-top: -15px; + font-size: 30px; + } + .glyphicon-chevron-left, + .icon-prev { + margin-left: -15px; + } + .glyphicon-chevron-right, + .icon-next { + margin-right: -15px; + } + } + + // Show and left align the captions + .carousel-caption { + left: 20%; + right: 20%; + padding-bottom: 30px; + } + + // Move up the indicators + .carousel-indicators { + bottom: 20px; + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_close.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_close.scss new file mode 100644 index 0000000000..62ce30fa37 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_close.scss @@ -0,0 +1,35 @@ +// +// Close icons +// -------------------------------------------------- + + +.close { + float: right; + font-size: ($font-size-base * 1.5); + font-weight: $close-font-weight; + line-height: 1; + color: $close-color; + text-shadow: $close-text-shadow; + @include opacity(.2); + + &:hover, + &:focus { + color: $close-color; + text-decoration: none; + cursor: pointer; + @include opacity(.5); + } + + // [converter] extracted button& to button.close +} + +// 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; +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_code.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_code.scss new file mode 100644 index 0000000000..8d83b14d79 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_code.scss @@ -0,0 +1,68 @@ +// +// Code (inline and block) +// -------------------------------------------------- + + +// Inline and block code styles +code, +kbd, +pre, +samp { + font-family: $font-family-monospace; +} + +// Inline code +code { + padding: 2px 4px; + font-size: 90%; + color: $code-color; + background-color: $code-bg; + border-radius: $border-radius-base; +} + +// User input typically entered via keyboard +kbd { + padding: 2px 4px; + font-size: 90%; + color: $kbd-color; + background-color: $kbd-bg; + border-radius: $border-radius-small; + box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); + + kbd { + padding: 0; + font-size: 100%; + box-shadow: none; + } +} + +// Blocks of code +pre { + display: block; + padding: (($line-height-computed - 1) / 2); + margin: 0 0 ($line-height-computed / 2); + font-size: ($font-size-base - 1); // 14px to 13px + line-height: $line-height-base; + word-break: break-all; + word-wrap: break-word; + color: $pre-color; + background-color: $pre-bg; + border: 1px solid $pre-border-color; + border-radius: $border-radius-base; + + // Account for some code outputs that place code tags in pre tags + code { + padding: 0; + font-size: inherit; + color: inherit; + white-space: pre-wrap; + background-color: transparent; + border-radius: 0; + } +} + +// Enable scrollable blocks of code +.pre-scrollable { + max-height: $pre-scrollable-max-height; + overflow-y: scroll; +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_component-animations.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_component-animations.scss new file mode 100644 index 0000000000..8c3fd07a27 --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_component-animations.scss @@ -0,0 +1,35 @@ +// +// Component animations +// -------------------------------------------------- + +// Heads up! +// +// We don't use the `.opacity()` mixin here since it causes a bug with text +// fields in IE7-8. Source: https://github.com/twbs/bootstrap/pull/3552. + +.fade { + opacity: 0; + @include transition(opacity .15s linear); + &.in { + opacity: 1; + } +} + +.collapse { + display: none; + + &.in { display: block; } + // [converter] extracted tr&.in to tr.collapse.in + // [converter] extracted tbody&.in to tbody.collapse.in +} + +tr.collapse.in { display: table-row; } + +tbody.collapse.in { display: table-row-group; } + +.collapsing { + position: relative; + height: 0; + overflow: hidden; + @include transition(height .35s ease); +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_dropdowns.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_dropdowns.scss new file mode 100644 index 0000000000..df50ec0cbc --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_dropdowns.scss @@ -0,0 +1,214 @@ +// +// Dropdown menus +// -------------------------------------------------- + + +// Dropdown arrow/caret +.caret { + display: inline-block; + width: 0; + height: 0; + margin-left: 2px; + vertical-align: middle; + border-top: $caret-width-base solid; + border-right: $caret-width-base solid transparent; + border-left: $caret-width-base solid transparent; +} + +// The dropdown wrapper (div) +.dropdown { + position: relative; +} + +// Prevent the focus on the dropdown toggle when closing dropdowns +.dropdown-toggle:focus { + outline: 0; +} + +// The dropdown menu (ul) +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: $zindex-dropdown; + 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; + font-size: $font-size-base; + text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) + background-color: $dropdown-bg; + border: 1px solid $dropdown-fallback-border; // IE8 fallback + border: 1px solid $dropdown-border; + border-radius: $border-radius-base; + @include box-shadow(0 6px 12px rgba(0,0,0,.175)); + background-clip: padding-box; + + // Aligns the dropdown menu to right + // + // Deprecated as of 3.1.0 in favor of `.dropdown-menu-[dir]` + &.pull-right { + right: 0; + left: auto; + } + + // Dividers (basically an hr) within the dropdown + .divider { + @include nav-divider($dropdown-divider-bg); + } + + // Links within the dropdown menu + > li > a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: normal; + line-height: $line-height-base; + color: $dropdown-link-color; + white-space: nowrap; // prevent links from randomly breaking onto new lines + } +} + +// Hover/Focus state +.dropdown-menu > li > a { + &:hover, + &:focus { + text-decoration: none; + color: $dropdown-link-hover-color; + background-color: $dropdown-link-hover-bg; + } +} + +// Active state +.dropdown-menu > .active > a { + &, + &:hover, + &:focus { + color: $dropdown-link-active-color; + text-decoration: none; + outline: 0; + background-color: $dropdown-link-active-bg; + } +} + +// Disabled state +// +// Gray out text and ensure the hover/focus state remains gray + +.dropdown-menu > .disabled > a { + &, + &:hover, + &:focus { + color: $dropdown-link-disabled-color; + } +} +// Nuke hover/focus effects +.dropdown-menu > .disabled > a { + &:hover, + &:focus { + text-decoration: none; + background-color: transparent; + background-image: none; // Remove CSS gradient + @include reset-filter(); + cursor: not-allowed; + } +} + +// Open state for the dropdown +.open { + // Show the menu + > .dropdown-menu { + display: block; + } + + // Remove the outline when :focus is triggered + > a { + outline: 0; + } +} + +// Menu positioning +// +// Add extra class to `.dropdown-menu` to flip the alignment of the dropdown +// menu with the parent. +.dropdown-menu-right { + left: auto; // Reset the default from `.dropdown-menu` + right: 0; +} +// With v3, we enabled auto-flipping if you have a dropdown within a right +// aligned nav component. To enable the undoing of that, we provide an override +// to restore the default dropdown menu alignment. +// +// This is only for left-aligning a dropdown menu within a `.navbar-right` or +// `.pull-right` nav component. +.dropdown-menu-left { + left: 0; + right: auto; +} + +// Dropdown section headers +.dropdown-header { + display: block; + padding: 3px 20px; + font-size: $font-size-small; + line-height: $line-height-base; + color: $dropdown-header-color; + white-space: nowrap; // as with > li > a +} + +// Backdrop to catch body clicks on mobile, etc. +.dropdown-backdrop { + position: fixed; + left: 0; + right: 0; + bottom: 0; + top: 0; + z-index: ($zindex-dropdown - 10); +} + +// 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: $caret-width-base solid; + content: ""; + } + // Different positioning for bottom up menu + .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 1px; + } +} + + +// Component alignment +// +// Reiterate per navbar.less and the modified component alignment there. + +@media (min-width: $grid-float-breakpoint) { + .navbar-right { + .dropdown-menu { + right: 0; left: auto; + } + // Necessary for overrides of the default right aligned menu. + // Will remove come v4 in all likelihood. + .dropdown-menu-left { + left: 0; right: auto; + } + } +} diff --git a/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_forms.scss b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_forms.scss new file mode 100644 index 0000000000..ea6b36a7ae --- /dev/null +++ b/misc/theme-cicada/src/opnsense/www/themes/cicada/assets/stylesheets/bootstrap/_forms.scss @@ -0,0 +1,540 @@ +// +// Forms +// -------------------------------------------------- + + +// Normalize non-controls +// +// Restyle and baseline non-control form elements. + +fieldset { + padding: 0; + margin: 0; + border: 0; + // Chrome and Firefox set a min-width: min-content; on fieldsets, + // so we reset that to ensure it behaves more like a standard block element. + // See https://github.com/twbs/bootstrap/issues/12359. + min-width: 0; +} + +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: $line-height-computed; + font-size: ($font-size-base * 1.5); + line-height: inherit; + color: $legend-color; + border: 0; + border-bottom: 1px solid $legend-border-color; +} + +label { + display: inline-block; + max-width: 100%; // Force IE8 to wrap long content (see https://github.com/twbs/bootstrap/issues/13141) + margin-bottom: 5px; + font-weight: normal; +} + + +// Normalize form controls +// +// While most of our form styles require extra classes, some basic normalization +// is required to ensure optimum display with or without those classes to better +// address browser inconsistencies. + +// Override content-box in Normalize (isnt specific enough) +input[type="search"] { + @include box-sizing(border-box); +} + +// Position radios and checkboxes better +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + margin-top: 1px \9; // IE8-9 + line-height: normal; +} + +// Set the height of file controls to match text inputs +input[type="file"] { + display: block; +} + +// Make range inputs behave like textual form controls +input[type="range"] { + display: block; + width: 100%; +} + +// Make multiple select elements height not fixed +select[multiple], +select[size] { + height: auto; +} + +// Focus for file, radio, and checkbox +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + @include tab-focus(); +} + +// Adjust output element +output { + display: block; + padding-top: ($padding-base-vertical + 1); + font-size: $font-size-base; + line-height: $line-height-base; + color: $input-color; +} + + +// Common form controls +// +// Shared size and type resets for form controls. Apply `.form-control` to any +// of the following form controls: +// +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"] +/* .form-control */ +{ + display: block; + width: 100%; + height: $input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border) + padding: $padding-base-vertical $padding-base-horizontal; + font-size: $font-size-base; + line-height: $line-height-base; + color: $input-color; + background-color: $input-bg; + background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214 + border: 1px solid $input-border; + border-radius: $input-border-radius; + text-overflow: ellipsis; + max-width:348px; + //@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); + @include transition(border-color ease-in-out .1s, box-shadow ease-in-out .1s); + + // Customize the `:focus` state to imitate native WebKit styles. + @include form-control-focus(); + + // Placeholder + @include placeholder(); + + // Disabled and read-only inputs + // + // HTML5 says that controls under a fieldset > legend:first-child wont be + // disabled if the fieldset is disabled. Due to implementation difficulty, we + // dont honor that edge case; we style them as disabled anyway. + &[disabled], + &[readonly], + fieldset[disabled] & { + cursor: not-allowed; + background-color: $input-bg-disabled; + opacity: 1; // iOS fix for unreadable disabled content + } + + // [converter] extracted textarea& to textarea.form-control +} + +// Reset height for `textarea`s +textarea{ + height: auto; +} + + +// Search inputs in iOS +// +// This overrides the extra rounded corners on search inputs in iOS so that our +// `.form-control` class can properly style them. Note that this cannot simply +// be added to `.form-control` as its not specific enough. For details, see +// https://github.com/twbs/bootstrap/issues/11586. + +input[type="search"] { + -webkit-appearance: none; +} + + +// Special styles for iOS temporal inputs +// +// In Mobile Safari, setting `display: block` on temporal inputs causes the +// text within the input to become vertically misaligned. +// As a workaround, we set a pixel line-height that matches the +// given height of the input. Since this fucks up everything else, we have to +// appropriately reset it for Internet Explorer and the size variations. + +input[type="date"], +input[type="time"], +input[type="datetime-local"], +input[type="month"] { + line-height: $input-height-base; + // IE8+ misaligns the text within date inputs, so we reset + line-height: $line-height-base #{\0}; + + &.input-sm { + line-height: $input-height-small; + } + &.input-lg { + line-height: $input-height-large; + } +} + + +// Form groups +// +// Designed to help with the organization and spacing of vertical forms. For +// horizontal forms, use the predefined grid classes. + +.form-group { + margin-bottom: 15px; +} + + +// Checkboxes and radios +// +// Indent the labels to position radios/checkboxes as hanging controls. + +.radio, +.checkbox { + position: relative; + display: block; + min-height: $line-height-computed; // clear the floating input if there is no label text + margin-top: 10px; + margin-bottom: 10px; + + label { + padding-left: 20px; + margin-bottom: 0; + font-weight: normal; + cursor: pointer; + } +} +.radio input[type="radio"], +.radio-inline input[type="radio"], +.checkbox input[type="checkbox"], +.checkbox-inline input[type="checkbox"] { + position: absolute; + margin-left: -20px; + margin-top: 4px \9; +} + +.radio + .radio, +.checkbox + .checkbox { + margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing +} + +// Radios and checkboxes on same line +.radio-inline, +.checkbox-inline { + display: inline-block; + padding-left: 20px; + margin-bottom: 0; + vertical-align: middle; + font-weight: normal; + cursor: pointer; +} +.radio-inline + .radio-inline, +.checkbox-inline + .checkbox-inline { + margin-top: 0; + margin-left: 10px; // space out consecutive inline controls +} + +// Apply same disabled cursor tweak as for inputs +// Some special care is needed because