Skip to content

Commit

Permalink
Merge pull request #2156 from jhawthorn/bootstrap-4-beta
Browse files Browse the repository at this point in the history 
Bootstrap 4.0.0-beta
  • Loading branch information
@jhawthorn
jhawthorn authored Aug 16, 2017
2 parents b518ca4 + 273d1ef commit 28fda1d
Show file tree
Hide file tree
Showing 91 changed files with 2,066 additions and 4,210 deletions.
2 changes: 1 addition & 1 deletion backend/app/assets/javascripts/spree/backend.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
//= require solidus_admin/underscore
//= require solidus_admin/backbone
//= require solidus_admin/backbone-nested-models
//= require solidus_admin/tether
//= require solidus_admin/popover
//= require solidus_admin/bootstrap
//= require prism
//= require spree
Expand Down
35 changes: 15 additions & 20 deletions backend/app/assets/stylesheets/spree/backend/_bootstrap_custom.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,10 @@
//
// Grayscale and brand colors for use across Bootstrap.

$brand-primary: $color-3 !default;
$brand-success: $color-2 !default;
$brand-warning: $color-6 !default;
$brand-danger: $color-5 !default;
$blue: $color-3 !default;
$red: $color-5 !default;
$orange: $color-6 !default;
$green: $color-2 !default;

// Body
//
Expand All @@ -23,10 +23,9 @@ $body-color: $color-4 !default;
//
// Style anchor elements.

$link-color: $color-3 !default;
$link-decoration: none !default;
$link-hover-color: $color-2 !default;
$link-hover-decoration: none !default;
$link-decoration: none !default;
$link-hover-color: $color-2 !default;
$link-hover-decoration: none !default;

// Grid columns
//
Expand All @@ -47,12 +46,12 @@ $font-size-root: 13px !default;
$font-weight-normal: 400 !default;
$font-weight-bold: 600 !default;

$font-size-h1: $font-size-root + 12 !default;
$font-size-h2: $font-size-root + 10 !default;
$font-size-h3: $font-size-root + 8 !default;
$font-size-h4: $font-size-root + 6 !default;
$font-size-h5: $font-size-root + 4 !default;
$font-size-h6: $font-size-root + 2 !default;
$h1-font-size: $font-size-root + 12 !default;
$h2-font-size: $font-size-root + 10 !default;
$h3-font-size: $font-size-root + 8 !default;
$h4-font-size: $font-size-root + 6 !default;
$h5-font-size: $font-size-root + 4 !default;
$h6-font-size: $font-size-root + 2 !default;

$headings-font-weight: $font-weight-bold !default;
$headings-color: $color-4 !default;
Expand All @@ -67,9 +66,9 @@ $border-radius: 3px !default;

$input-color: $color-3 !default;
$input-border-color: $color-border !default;
$input-border-focus: $color-2 !default;
$input-focus-border-color: $color-2 !default;

$custom-select-focus-border-color: $input-border-focus !default;
$custom-select-focus-border-color: $input-focus-border-color !default;

// Dropdowns
//
Expand All @@ -78,10 +77,6 @@ $custom-select-focus-border-color: $input-border-focus !default;
$dropdown-link-hover-color: #fff !default;
$dropdown-link-hover-bg: $color-3 !default;

// Badges

$badge-default-bg: $color-7 !default;

// Breadcrumbs

$breadcrumb-bg: transparent !default;
Expand Down
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/components/_date-picker.scss
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.date-range-filter {
.range-divider {
color: $gray;
color: $gray-800;
}
}

Expand Down
16 changes: 8 additions & 8 deletions backend/app/assets/stylesheets/spree/backend/components/_messages.scss
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
.errorExplanation {
padding: 5px;
border: 1px solid very-light($brand-danger, 12);
background-color: very-light($brand-danger, 6);
border: 1px solid very-light(theme-color("danger"), 12);
background-color: very-light(theme-color("danger"), 6);
border-radius: 3px;
color: very-light($brand-danger, 30);
color: very-light(theme-color("danger"), 30);
margin-bottom: 15px;

h2 {
font-size: 140%;
color: very-light($brand-danger, 30);
color: very-light(theme-color("danger"), 30);
margin-bottom: 5px;
}

Expand Down Expand Up @@ -37,9 +37,9 @@
color: $color-1;
font-weight: $font-weight-bold;

&.notice { background-color: rgba($brand-warning, 0.8) }
&.success { background-color: rgba($brand-success, 0.8) }
&.error { background-color: rgba($brand-danger, 0.8) }
&.notice { background-color: rgba(theme-color("warning"), 0.8) }
&.success { background-color: rgba(theme-color("success"), 0.8) }
&.error { background-color: rgba(theme-color("danger"), 0.8) }
}

.alert {
Expand All @@ -50,5 +50,5 @@
text-decoration: underline;
}

&.error a { color: very-light($brand-danger, 10) }
&.error a { color: very-light(theme-color("danger"), 10) }
}
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/components/_navigation.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ nav.menu {
.admin-nav {
border-right: $border-sidebar;
background: $color-sidebar-bg;
z-index: $zindex-navbar;
z-index: $zindex-sticky;
}

.admin-nav-header {
Expand Down
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/components/_number_with_currency.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
border-right: 0;

&:focus + .number-with-currency-select {
border-left-color: $input-border-focus;
border-left-color: $input-focus-border-color;
}
}

Expand Down
26 changes: 11 additions & 15 deletions backend/app/assets/stylesheets/spree/backend/plugins/_bootstrap_tooltip.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,30 +3,26 @@
background-color: $color;
}

&.tooltip-top,
&.bs-tether-element-attached-bottom {
.tooltip-inner::before {
&.bs-tooltip-top {
.arrow::before {
border-top-color: $color;
}
}

&.tooltip-right,
&.bs-tether-element-attached-left {
.tooltip-inner::before {
&.bs-tooltip-right {
.arrow::before {
border-right-color: $color;
}
}

&.tooltip-bottom,
&.bs-tether-element-attached-top {
.tooltip-inner::before {
&.bs-tooltip-bottom {
.arrow::before {
border-bottom-color: $color;
}
}

&.tooltip-left,
&.bs-tether-element-attached-right {
.tooltip-inner::before {
&.bs-tooltip-left {
.arrow::before {
border-left-color: $color;
}
}
Expand All @@ -36,12 +32,12 @@
pointer-events: none;

&.action-edit, &.action-save, &.action-capture, &.action-add {
@include bootstrap-tooltip-color($brand-success);
@include bootstrap-tooltip-color(theme-color("success"));
}
&.action-clone, &.action-cancel {
@include bootstrap-tooltip-color($brand-warning);
@include bootstrap-tooltip-color(theme-color("warning"));
}
&.action-void, &.action-failure, &.action-remove {
@include bootstrap-tooltip-color($brand-danger);
@include bootstrap-tooltip-color(theme-color("danger"));
}
}
12 changes: 7 additions & 5 deletions backend/app/assets/stylesheets/spree/backend/plugins/_select2.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
border: $input-btn-border-width solid $input-border-color;
@include border-radius($input-border-radius);
background: $input-bg;
height: calc(#{$input-height} + #{2*$input-btn-border-width});
height: $input-height;
padding: 0;

.select2-arrow {
background: transparent;
Expand All @@ -17,7 +18,8 @@
}

>.select2-chosen {
line-height: $input-height;
padding: $input-btn-padding-y $input-btn-padding-x;
line-height: $input-btn-line-height;
color: $input-color;
}
}
Expand All @@ -39,7 +41,7 @@
.select2-choices.select2-choices, /* Needs extra specificity */
.select2-choice {
box-shadow: none; /* Remove default outline */
border-color: $input-border-focus;
border-color: $input-focus-border-color;
}
}

Expand All @@ -49,7 +51,7 @@
}

.select2-search-choice {
background: $badge-default-bg;
background: $gray-200;
border: 0;
margin: 2px 0 3px 5px; // adjust the margin to respect the adjusted line height
}
Expand All @@ -72,7 +74,7 @@
}

.select2-drop-active {
border: $input-btn-border-width solid $input-border-focus;
border: $input-btn-border-width solid $input-focus-border-color;
border-top: 0;
}

Expand Down
12 changes: 6 additions & 6 deletions backend/app/assets/stylesheets/spree/backend/sections/_orders.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
.order-total {
font-size: 35px;
font-weight: $font-weight-bold;
color: $brand-success;
color: theme-color("success");
}
}

Expand All @@ -28,7 +28,7 @@
.customer {
font-size: 20px;
font-weight: $font-weight-bold;
color: $brand-success;
color: theme-color("success");
}
}

Expand All @@ -37,10 +37,10 @@
color: $body-color;

.shipment-number {
color: $brand-success;
color: theme-color("success");
}
.stock-location-name {
color: $brand-success;
color: theme-color("success");
}
}
}
Expand Down Expand Up @@ -83,11 +83,11 @@ form.admin-ship-shipment {

table.line-items {
input.error {
border-color: $brand-danger;
border-color: theme-color("danger");
}

.select2-container.error {
border-radius: 4px;
border: 1px solid $brand-danger;
border: 1px solid theme-color("danger");
}
}
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/sections/_products.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ div[data-hook="admin_products_index_search_buttons"] {
}

&.with-images {
border-color: $brand-success;
border-color: theme-color("success");
}
}

Expand Down
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/sections/_promotions.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -121,7 +121,7 @@
cursor: pointer;

&:hover {
color: $brand-danger;
color: theme-color("danger");
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions backend/app/assets/stylesheets/spree/backend/sections/_stock_management.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,12 +31,12 @@
}

input.error {
border-color: $brand-danger;
border-color: theme-color("danger");
}

.select2-container.error {
border-radius: 4px;
border: 1px solid $brand-danger;
border: 1px solid theme-color("danger");
}
}

Expand Down
20 changes: 10 additions & 10 deletions backend/app/assets/stylesheets/spree/backend/shared/_forms.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,25 +8,25 @@ input[type="url"],
input[type="number"],
input[type="tel"],
textarea {
padding: $input-padding-y $input-padding-x;
padding: $input-btn-padding-y $input-btn-padding-x;
color: $input-color;
border: $input-btn-border-width solid $input-border-color;
border-radius: $input-border-radius;
background: $input-bg;
font-size: $font-size-base;
line-height: $input-line-height;
line-height: $input-btn-line-height;

&:focus {
border-color: $input-border-focus;
border-color: $input-focus-border-color;
outline: 0;
}

&:disabled {
background: $input-bg-disabled;
background: $input-disabled-bg;
}

&::placeholder {
color: $input-color-placeholder;
color: $input-placeholder-color;
// Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.
opacity: 1;
}
Expand Down Expand Up @@ -68,7 +68,7 @@ button,
.button {
&:not(.close) {
@extend .btn;
@include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
@include button-variant(theme-color("primary"), theme-color("primary"));
}

&:before {
Expand Down Expand Up @@ -134,21 +134,21 @@ span.info {
&.withError {
.field_with_errors {
label {
color: very-light($brand-danger, 30);
color: very-light(theme-color("danger"), 30);
}

input {
border-color: very-light($brand-danger, 15);
border-color: very-light(theme-color("danger"), 15);
}
}
.formError {
color: very-light($brand-danger, 30);
color: very-light(theme-color("danger"), 30);
font-style: italic;
font-size: 85%;
}
.select2-container {
border-radius: 4px;
border: 1px solid very-light($brand-danger, 15);
border: 1px solid very-light(theme-color("danger"), 15);
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion backend/app/assets/stylesheets/spree/backend/shared/_header.scss
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
.main-header {
display: flex;
align-items: center;
padding: 15px map-get($grid-gutter-widths, "xl");
padding: 15px $grid-gutter-width;
background-color: very-light($color-3, 4);
border-bottom: 1px solid $color-border;
height: $main-header-height;
Expand Down
Loading

0 comments on commit 28fda1d

Please sign in to comment.