diff options
Diffstat (limited to 'openecomp-ui/resources/scss/bootstrap-cust')
12 files changed, 377 insertions, 0 deletions
diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_buttons.scss b/openecomp-ui/resources/scss/bootstrap-cust/_buttons.scss new file mode 100644 index 0000000000..bf58006d89 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_buttons.scss @@ -0,0 +1,13 @@ + +.btn { + height: 30px; + min-width: 95px; +} + +.btn-default .fa { + color: $brand-primary; +} + +.btn-info { + @include button-variant($text-black, $tlv-gray, $light-gray); +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_close.scss b/openecomp-ui/resources/scss/bootstrap-cust/_close.scss new file mode 100644 index 0000000000..38d7138d86 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_close.scss @@ -0,0 +1,7 @@ +// +// Close icons +// -------------------------------------------------- + +.close { + font-size: $heading-font-1; +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_dropdowns.scss b/openecomp-ui/resources/scss/bootstrap-cust/_dropdowns.scss new file mode 100644 index 0000000000..d6f895261c --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_dropdowns.scss @@ -0,0 +1,16 @@ + +.caret { + right: 8px; + top: 12px; + position: absolute; +} + +.dropdown-menu { + padding: 0; + li a { + height: 30px; + } + .divider { + margin: 0; + } +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_forms.scss b/openecomp-ui/resources/scss/bootstrap-cust/_forms.scss new file mode 100644 index 0000000000..545b23ee7f --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_forms.scss @@ -0,0 +1,110 @@ +.form-group { + .control-label { + @extend .body-2-medium; + } + &.required { + label:before { + content: "*"; + color: $red; + margin: 0 4px 0 0; + } + } +} +.form-control { + @extend .body-1; + border-radius: 2px; + height: 30px; + @include box-shadow(none); + &:focus { + @include box-shadow(none); + } + &:hover { + border-color: $gray; + } +} + +label { + @extend .body-3; + margin-bottom: 8px; +} + +select.form-control { + display: block; + width: 215px; +} + +select[multiple] { + background: none; +} + +input[type="radio"], input[type="checkbox"] { + margin: 0; + + &:before { + content: ""; + display: inline-block; + width: 11px; + height: 11px; + margin-right: 10px; + position: absolute; + background-color: $white; + border: 1px solid $blue; + box-sizing: content-box; + } +} + +.radio label { + font-weight: normal; + display: inline-block; + cursor: pointer; + margin-right: $body-font-1; + font-size: $body-font-1; +} + +.checkbox label { + font-weight: normal; + display: inline-block; + cursor: pointer; + margin-right: $body-font-1; + font-size: $body-font-1; +} + +.radio input:before { + border-radius: 8px; +} + +.checkbox input:before { + border-radius: 2px; +} + +input[type=radio]:checked:before { + content: "\2022"; + color: $blue; + font-size: 30px; + text-align: center; + line-height: 11px; + font-family: $radio-font-family; +} + +input[type=checkbox]:checked:before { + font-family: $icon-font-family; + content: "\f00c"; + font-size: $icon-font-size; + color: $blue; + text-align: center; +} + +.radio, +.checkbox { + margin-top: 0px; + margin-bottom: 0px; +} + +.radio input[type="radio"], +.radio-inline input[type="radio"], +.checkbox input[type="checkbox"], +.checkbox-inline input[type="checkbox"] { + position: absolute; + margin-left: -20px; + top: 2px; +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_list-group.scss b/openecomp-ui/resources/scss/bootstrap-cust/_list-group.scss new file mode 100644 index 0000000000..b94f91bac9 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_list-group.scss @@ -0,0 +1,5 @@ + +.list-group-item { + border: none; + border-top: 3px solid $list-group-border; +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_mixins.scss b/openecomp-ui/resources/scss/bootstrap-cust/_mixins.scss new file mode 100644 index 0000000000..774e662014 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_mixins.scss @@ -0,0 +1,3 @@ + + +@import "mixins/buttons";
\ No newline at end of file diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_modals.scss b/openecomp-ui/resources/scss/bootstrap-cust/_modals.scss new file mode 100644 index 0000000000..6bc6e46b2f --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_modals.scss @@ -0,0 +1,18 @@ +.modal-content { + .modal-header { + border-top: 3px solid $blue; + .modal-title { + @extend .heading-2; + } + } + + .modal-body{ + padding: 15px; + } + + .modal-footer { + padding: 15px; + border-top: 0; + background-color: $tlv-gray; + } +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_navbar.scss b/openecomp-ui/resources/scss/bootstrap-cust/_navbar.scss new file mode 100644 index 0000000000..acf2024b56 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_navbar.scss @@ -0,0 +1,3 @@ +.navbar { + border: none; +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_navs.scss b/openecomp-ui/resources/scss/bootstrap-cust/_navs.scss new file mode 100644 index 0000000000..7b9cff963d --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_navs.scss @@ -0,0 +1,30 @@ +.nav { + > li { + > a { + padding: 10px 10px 3px; + } + } +} + +.nav-tabs { + @include box-shadow(0px 2px 1px -1px $gray); + padding: 0 28px; + + > li { + @extend .body-1; + + > a { + color: $dark-gray; + text-transform: uppercase; + } + + &.active > a { + &, + &:hover, + &:focus { + @extend .body-1-medium; + border-bottom: 3px solid $blue; + } + } + } +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_panels.scss b/openecomp-ui/resources/scss/bootstrap-cust/_panels.scss new file mode 100644 index 0000000000..9ee5622292 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_panels.scss @@ -0,0 +1,3 @@ +.panel { + border: none; +}
\ No newline at end of file diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_tables.scss b/openecomp-ui/resources/scss/bootstrap-cust/_tables.scss new file mode 100644 index 0000000000..6902914f35 --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_tables.scss @@ -0,0 +1,42 @@ +.table { + // Cells + > thead, + > tbody, + > tfoot { + > tr { + > th, + > td { + border-top: none; + } + } + } + // Bottom align for column headings + > thead > tr > th { + border-bottom: none; + } + // Account for multiple tbody instances + > tbody + tbody { + border-top: none; + } + + +} + +.table-striped { + > tbody > tr:nth-of-type( odd ) { + background-color: $background-gray; + } +} + +.table-striped { + > tbody > tr:nth-of-type( even ) { + background-color: $gray; + } +} + +.table-hover { + > tbody > tr:hover { + background-color: $tlv-hover; + cursor: pointer; + } +} diff --git a/openecomp-ui/resources/scss/bootstrap-cust/_variables.scss b/openecomp-ui/resources/scss/bootstrap-cust/_variables.scss new file mode 100644 index 0000000000..59f0e3db7c --- /dev/null +++ b/openecomp-ui/resources/scss/bootstrap-cust/_variables.scss @@ -0,0 +1,127 @@ + +//== Colors +// +//## Gray and brand colors for use across Bootstrap. + +$gray-darker: $dark-gray; +$gray-dark: $dark-gray; +$gray: $gray; +$gray-light: $light-gray; +$gray-lighter: $light-gray; + +$brand-primary: $blue; +$brand-success: $green; +$brand-info: $light-gray; +$brand-warning: $yellow; +$brand-danger: $red; + + +//== Scaffolding +// +//## Settings for some of the most global styles. + +$body-bg: $white; +$text-color: $text-black; +$link-color: $link-blue; +$link-hover-color: $blue; + +//== Typography +// +//## Font, line-height, and color for body text, headings, and more. +$font-family-sans-serif: omnes-regular, "Omnes-Regular", "Helvetica Neue", Helvetica, Arial, sans-serif; +//$font-family-base: $font-family-sans-serif !default; +$font-size-base: $body-font-2; +$font-size-large: $body-font-1; +$font-size-small: $body-font-3; +$font-size-h1: $heading-font-1; +$font-size-h2: $heading-font-2; +$font-size-h3: $heading-font-4; +$font-size-h4: $heading-font-5; + + + +//== Components +// +//## Define common padding and border radius sizes and more. +$border-radius-base: 0; +$border-radius-large: 0; +$border-radius-small: 0; + + +//== Buttons +// +//## For each of Bootstrap's buttons, define text, background and border color. + +// $btn-font-weight: normal !default; +$btn-default-color: $text-color; +$btn-default-bg: $white; +$btn-default-border: $light-gray; + +$btn-success-color: $white; + +// Allows for customizing button radius independently from global border radius +$btn-border-radius-base: 2px; +$btn-border-radius-large: 2px; +$btn-border-radius-small: 2px; + +//== Dropdowns +// +$dropdown-bg: $white; +$dropdown-border: $link-blue; +$dropdown-link-color: $text-black; +$dropdown-divider-bg: $gray; +//** Hover color for dropdown links. +$dropdown-link-hover-color: $black; +//** Hover background for dropdown links. +$dropdown-link-hover-bg: $tlv-hover; + +//** Active dropdown menu item text color. +$dropdown-link-active-color: $black; +//** Active dropdown menu item background color. +$dropdown-link-active-bg: $tlv-hover; + +//== Forms +// +//## +$form-group-margin-bottom: 24px; + + +$input-bg: $white; +$input-bg-disabled: $tlv-light-gray; +$input-color: $dark-gray; +$input-border: $light-gray; +$input-border-focus: $dark-blue; + +//== Modals +// +//## +$modal-content-bg: $white; +$modal-inner-padding: 0 15px; +$modal-title-padding: 30px 25px 10px 25px; + + +//== Close +// +//## +$close-color: $tlv-light-gray; + +//== Navs +// +//## +//=== Shared nav styles +$nav-link-hover-bg: transparent; + +$navbar-inverse-bg: $gray; + +//== Tabs +$nav-tabs-border-color: transparent; +$nav-tabs-link-hover-border-color: transparent; +$nav-tabs-active-link-hover-bg: transparent; +$nav-tabs-active-link-hover-color: $text-black; +$nav-tabs-active-link-hover-border-color: transparent; + + +//== Popovers +// +//## +$popover-bg: $background-gray; |