Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

next #1437

Merged
merged 59 commits into from
Apr 29, 2019
Merged

next #1437

merged 59 commits into from
Apr 29, 2019

Conversation

yggg
Copy link
Contributor

@yggg yggg commented Apr 29, 2019

Please read and mark the following check list before creating a pull request:

Short description of what this resolves:

BREAKING CHANGE:

  • calendar - use primary button in cosmic theme
  • checkbox - opacity instead of lightning
  • context-menu, popover, datepicker - calc instead of round and scss calculations
  • input - opacity for placeholder instead of lightning
  • tabs - remove gradient for tab bottom separator in cosmic theme
  • toastr - use background-color instead of the gradient in cosmic theme
  • text colors are now used from success/primary/warning/etc colors
  • add color palette instead of generating colors using scss-functions, an example for primary
    color-primary-200
    color-primary-300
    color-primary-400
    color-primary-600
    color-primary-700

create-colors-palette() scss function that can be used during the theme installation process to generate palette automatically

Closes #1228
Closes #46

Starting from version 4.0, Nebular introduces new nb-icon component and NbIconLibraries service to host SVG and Font icon packs. As a breaking change, Nebular moves from nebular-icons package to much more popular Eva Icons pack consisting of 480+ beautiful SVG icons. We believe this will bring more quality and variety to interfaces based on Nebular.

Now all Nebular components internally use <nb-icon></nb-icon> component utilizing Eva Icons SVG icons. More details on nb-icon component.

There are two ways to upgrade:
Migrate to Eva Icons (recommended):

  1. install Eva Icons Nebular package npm i @nebular/eva-icons
  2. register NbEvaIconsModule in the app.module.ts
import { NbEvaIconsModule } form '@nebular/eva-icons';

@NgModule({
  imports: [
  	// ...
    NbEvaIconsModule,
  ],
})
  1. Search for all usages of <span icon="nb-*" or <i icon="nb-*"and replace with <nb-icon icon="icon-name"></nb-icon>. Full icons list akveo.github.io/eva-icons.

  2. Search for icon: 'nb-*' references in properties for such components as Menu, Actions, Tabs, etc. Replace those with icon: 'icon-name'. Please note, there is no need to specify any icon prefix (such as eva- or nb-) since prefix is specified when the icon package is registered in Nebular.

  3. Update styles if necessary.

  4. if you have nebular-icons installed, remove the package and all references.

Continue using nebular-icons
This option is also possible, but please note, Nebular Component will still use Eva Icons pack for internal component icons, such as close, arrow-down, arrow-up, etc.

  1. Register nebular-icons as a pack for Nebular in your app.component.ts
  import { NbIconLibraries } from '@nebular/theme';

  constructor(private iconLibraries: NbIconLibraries) {
    this.iconLibraries.registerFontPack('nebular', { iconClassPrefix: 'nb' });
    this.iconLibraries.setDefaultPack('nebular');
  }
  1. Search for all usages of <span icon="nb-*" or <i icon="nb-*" and replace with <nb-icon icon="icon-name"></nb-icon> without the nb- prefix since prefix is specified when the icon package is registered in Nebular.

  2. Search for icon: 'nb-*' references in properties for such components as Menu, Actions, Tabs, etc. Replace those with icon: 'icon-name' without nb- prefix since it is unnecessary and covered under the hood.

Please open an issue if you have any questions or having difficulties to migrate.
d0e528b

Following theme variables were renamed:
radio-bg -> radio-border-color, radio-inner-circle-color, radio-[status]-border-color, radio-[status]-inner-circle-color
radio-fg -> radio-text-color
radio-size -> radio-width, radio-height
radio-border-size -> radio-border-width
radio-checkmark -> radio-inner-circle-color
radio-disabled-checkmark -> radio-disabled-inner-circle
radio-indicator -> radio-circle
radio-description -> text

Following theme variables were removed:
radio-checked-bg
radio-checked-size
radio-checked-border-size
radio-checked-border-color
radio-checked-checkmark
radio-disabled-bg
radio-disabled-size
radio-disabled-border-size

'radio-bg', 'radio-checkmark' theme variables were removed.
Use radio-[status]-border-color and radio-[status]-inner-circle-color
instead.

NbRadioGroupComponent setters 'setValue', 'setName', 'setDisabled',
'setStatus' were removed. Use 'value', 'name', 'disabled', 'status'.

NbRadioComponent setter 'setDisabled' removed. Use 'disabled' instead.

Following map keys were removed:

  • border-color
  • color-gray
  • color-neutral
  • color-disabled
    Mapping for borders, disabled and similar styles would controlled
    by design system and configured for each component individually.

Properties 'checkbox-bg', 'checkbox-checked-bg' and 'checkbox-disabled-bg'
replaced with:

  • checkbox-disabled-background-color
  • checkbox-[status]-background-color
  • checkbox-[status]-checked-background-color
  • checkbox-[status]-indeterminate-background-color
  • checkbox-[status]-focus-background-color
  • checkbox-[status]-hover-background-color
  • checkbox-[status]-active-background-color

Property 'checkbox-size' splited into 'checkbox-height', 'checkbox-width'.

Following properties were removed (along with ability to change appearance of checkbox
based on checked or disabled state):

  • checkbox-checked-size
  • checkbox-checked-border-size
  • checkbox-disabled-size
  • checkbox-disabled-border-size

Property 'checkbox-border-size' replaced with 'checkbox-border-width'.

Properties 'checkbox-border-color', 'checkbox-checked-border-color', 'checkbox-disabled-border-color'
replaced with:

  • checkbox-disabled-border-color
  • checkbox-[status]-border-color
  • checkbox-[status]-checked-border-color
  • checkbox-[status]-indeterminate-border-color
  • checkbox-[status]-hover-border-color
  • checkbox-[status]-active-border-color

Properties 'checkbox-checkmark', 'checkbox-checked-checkmark', 'checkbox-disabled-checkmark'
replaced with:

  • checkbox-disabled-checkmark-color
  • checkbox-[status]-checked-checkmark-color
  • checkbox-[status]-indeterminate-checkmark-color

Check mark pseudo element replaced with nb-icon.

Checkbox classes were changed.
Class 'customised-control' replaced with 'label'.
Class 'customised-control-input' replaced with 'native-input'.
Class 'customised-control-indicator' replaced with 'custom-checkbox'.
Class 'customised-control-description' replaced with 'text'.

NbCheckboxComponent's '_value' property now private. Use 'value' instead.

Following theme properties were renamed:
form-control-border-width -> input-border-width
form-control-border-radius -> input-rectangle-border-radius
form-control-semi-round-border-radius -> input-semi-round-border-radius
form-control-round-border-radius -> input-round-border-radius
form-control-text-primary-color -> input-text-color
form-control-border-color -> input-border-color
form-control-selected-border-color -> input-focus-border-color, input-[status]-focus-color
form-control-bg -> input-background-color
form-control-focus-bg -> input-focus-border-color
form-control-placeholder-color -> input-placeholder-text-color
form-control-placeholder-font-size -> input-placeholder-font-size
form-control-font-size -> input-medium-text-font-size
form-control-font-size-sm -> input-small-text-font-size
form-control-font-size-lg -> input-large-text-font-size
form-control-padding -> input-medium-padding
form-control-padding-sm -> input-small-padding
form-control-padding-lg -> input-large-padding
form-control-info-border-color -> input-info-border-color
form-control-success-border-color -> input-success-border-color
form-control-danger-border-color -> input-danger-border-color
form-control-warning-border-color -> input-warning-border-color
form-control-border-type -> input-border-style

Removed:
form-control-label-font-weight
form-control-feedback-font-size
form-control-feedback-font-weight

Input status classes were renamed from input-[status-name] to status-[status-name].
Input size classes were renamed from input-[size-name] to size-[size-name].
Input shape classes were renamed from input-[shape-name] to shape-[shape-name].

All NbInputDirective static fields removed. Removed fields:
SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS,
STATUS_WARNING, STATUS_DANGER, SHAPE_SEMI_ROUND, SHAPE_RECTANGLE, SHAPE_ROUND.
Use NbComponentStatus, NbComponentShape, NbComponentSize instead.

NbInputDirective 'size' property and 'setSize' getter removed.
Use unified 'fieldSize' property instead.

NbInputDirective 'setFullWidth' replaced with read/write 'fullWidth' property.

Remove bootstrap theme support until it's refactored to use updated
theme properties.

Following tooltip theme properties were renamed:
tooltip-bg -> tooltip-background-color
tooltip-fg -> tooltip-text-color
tooltip-font-size -> tooltip-text-font-size
tooltip-status-fg -> tooltip-[status]-text-color
tooltip-primary-bg -> tooltip-primary-background-color
tooltip-info-bg -> tooltip-info-background-color
tooltip-success-bg -> tooltip-success-background-color
tooltip-warning-bg -> tooltip-warning-background-color
tooltip-danger-bg -> tooltip-danger-background-color

Tooltip status class renamed from [status-name]-tooltip to
status-[status-name].

Following properties where renamed:
popover-fg -> popover-text-color
popover-bg -> popover-background-color
popover-border -> popover-border-color

'isMenuShown' property removed from NbUserComponent.
'inverse' input removed from NbUserComponent.
'background' class renamed to 'initials'.
NbUserComponent SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE
size static properties were removed. Use NbComponentSize instead.

Size class names were prefixed with 'size-'.
small -> size-small
medium -> size-medium
large -> size-large
xlarge -> size-giant

Following properties were renamed:
user-font-size -> user-[size]-initials-text-font-size, user-[size]-name-text-font-size, user-[size]-title-text-font-size
user-line-height -> user-[size]-initials-text-line-height, user-[size]-name-text-line-height, user-[size]-title-text-line-height
user-bg -> user-picture-box-background-color
user-fg -> user-initials-text-color
user-fg-highlight -> user-picture-box-border-color
user-font-family-secondary -> user-name-text-font-family
user-size-small -> user-small-height, user-small-width
user-size-medium -> user-medium-height, user-medium-width
user-size-large -> user-large-height, user-large-width
user-size-xlarge -> user-giant-height, user-giant-width

NbUserComponent 'showNameValue', 'showTitleValue', 'showInitialsValue'
properties removed. Use 'showName', 'showTitle', 'showInitials' instead.

NbTabset theme properties prefix changed to 'tabset'.

Following properties were renamed:
tabs-font-family -> tabset-tab-text-font-family
tabs-font-size -> tabset-tab-text-font-size
tabs-content-font-family -> tabset-content-text-font-family
tabs-content-font-size -> tabset-content-text-font-size
tabs-active-bg -> tabset-tab-selected-background-color
tabs-padding -> tabset-tab-padding
tabs-content-padding -> tabset-content-padding
tabs-header-bg -> tabset-tab-background-color
tabs-separator -> tabset-divider-color
tabs-fg -> tabset-tab-text-color
tabs-fg-disabled -> tabset-tab-disabled-text-color
tabs-fg-text -> tabset-content-text-color
tabs-fg-heading -> tabset-tab-selected-text-color, tabset-tab-focus-text-color, tabset-tab-hover-text-color
tabs-bg -> tabset-content-background-color
tabs-selected -> tabset-tab-underline-color
tabs-icon-only-max-width -> tabset-tab-text-hide-breakpoint

Following properties were removed:
tabs-active-font-weight
tabs-selected-second-color
tabs-selected-degrees

NbRouteTabset theme properties prefix changed to 'route-tabset'.

Following properties were renamed:
route-tabs-font-family -> route-tabset-tab-text-font-family
route-tabs-font-size -> route-tabset-tab-text-font-size
route-tabs-active-bg -> route-tabset-tab-selected-background-color
route-tabs-active-font-weight ->
route-tabs-padding -> route-tabset-tab-padding
route-tabs-header-bg -> route-tabset-tab-background-color
route-tabs-separator -> route-tabset-divider-color
route-tabs-fg -> route-tabset-tab-text-color
route-tabs-fg-disabled -> route-tabset-tab-disabled-text-color
route-tabs-fg-heading -> route-tabset-tab-selected-text-color, route-tabset-tab-focus-text-color,
route-tabset-tab-hover-text-color
route-tabs-selected -> route-tabset-tab-underline-color
route-tabs-icon-only-max-width -> route-tabset-tab-text-hide-breakpoint

'route-tabs-bg' property was unused and removed.

Following properties were renamed:
card-font-size -> card-text-font-size
card-font-weight -> card-text-font-weight
card-line-height -> card-text-line-height
card-bg -> card-background-color
card-border-type -> card-border-style
card-separator -> card-divider-color
card-header-fg -> card-header-text-color
card-header-primary-bg -> card-header-primary-background-color
card-header-info-bg -> card-header-info-background-color
card-header-success-bg -> card-header-success-background-color
card-header-warning-bg -> card-header-warning-background-color
card-header-danger-bg -> card-header-danger-background-color
card-header-disabled-bg -> card-header-disabled-background-color
card-margin -> card-margin-bottom
card-height-xxsmall -> card-height-tiny
card-height-small -> card-height-small
card-height-medium -> card-height-medium
card-height-large -> card-height-large
card-height-xlarge -> card-height-giant

Following properties were removed:
card-fg
card-fg-text
card-fg-heading
card-header-fg-heading
card-header-active-bg
card-header-active-fg
card-header-border-width
card-header-border-type
card-header-border-color
card-height-xsmall
card-height-xxlarge

All NbCardComponent static fields were removed. Removed fields:
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER, ACCENT_PRIMARY, ACCENT_INFO, ACCENT_SUCCESS, ACCENT_WARNING, ACCENT_DANGER.
Use NbComponentStatus, NbComponentSize instead.

'disabled' status replaced with disabled input. 'active' status removed.
Card size class renamed from 'card-[size-name]' to 'size-[size-name]'.
Card status classes were renamed from '[status-name]-card' to
'status-[status-name]'.

NbCardComponent 'xsmall' and 'xxlarge' getters along with 'size-xsmall'
and 'size-xxlarge' removed.

NbCardComponent 'xxsmall', 'small', 'medium', 'large', 'xlarge' getters
renamed to 'tiny', 'small', 'medium', 'large', 'giant' accordingly.

Following spinner theme properties were renamed:
spinner-bg -> spinner-background-color
spinner-circle-bg -> spinner-circle-filled-color
spinner-fg -> spinner-text-color
spinner-primary-bg -> spinner-primary-circle-filled-color
spinner-info-bg -> spinner-info-circle-filled-color
spinner-success-bg -> spinner-success-circle-filled-color
spinner-warning-bg -> spinner-warning-circle-filled-color
spinner-danger-bg -> spinner-danger-circle-filled-color
spinner-xsmall -> spinner-height-tiny
spinner-small -> spinner-height-small
spinner-medium -> spinner-height-medium
spinner-large -> spinner-height-large
spinner-xlarge -> spinner-height-giant

Following properties were removed:
spinner-xxsmall
spinner-xxlarge
spinner-disabled-bg
spinner-disabled-fg
spinner-active-bg

'active' and 'disabled' along with NbSpinnerComponent STATUS_ACTIVE, STATUS_DISABLED static properties statuses were removed.

Following NbSpinnerComponent static properties were removed:
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER.

Classes '[size-name]-spinner' changed to 'size-[size-name]'.
Classes '[status-name]-spinner' changed to 'status-[status-name]'.

NbSpinnerComponent 'xxsmall' and 'xxlarge' getters removed.

Button
'accent' property removed.

Static properties removed. Removed properties:
SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, STATUS_PRIMARY,
STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER,
SHAPE_RECTANGLE, SHAPE_ROUND, SHAPE_SEMI_ROUND.
Use NbComponentSize, NbComponentStatus, NbComponentShape.

Size classes were renamed:
btn-xsmall -> size-tiny
btn-small -> size-small
btn-medium -> size-medium
btn-large -> size-large

Size getter 'xsmall' renamed to tiny.

Status classes were renamed:
btn-primary -> status-primary
btn-info -> status-info
btn-success -> status-success
btn-warning -> status-warning
btn-danger -> status-danger

Shape classes were renamed:
btn-rectangle -> shape-rectangle
btn-round -> shape-round
btn-semi-round -> shape-semi-round

'btn-outline' class renamed to 'appearance-outline'.
'btn-hero' class renamed to 'appearance-hero'.

Button theme properties prefix changed to 'button' (was 'btn').

Following theme properties were renamed:
btn-fg -> button-filled-[status]-text-color,
button-outline-[status]-[state?]-text-color,
button-ghost-[status]-[state?]-text-color,
button-hero-[status]-text-color
btn-font-family -> button-text-font-family
btn-line-height -> button-[size]-text-line-height
btn-cursor -> button-cursor
btn-[status]-bg -> button-filled-[status]-background-color
btn-[status]-hover-bg -> button-filled-[status]-hover-background-color
btn-[status]-active-bg -> button-filled-[status]-active-background-color
btn-padding-y-[size], btn-padding-x-[size] -> button-[appearance]-[size]-padding
btn-font-size-[size] -> button-[size]-text-font-size
btn-rectangle-border-radius -> button-rectangle-border-radius
btn-semi-round-border-radius -> button-semi-round-border-radius
btn-round-border-radius -> button-round-border-radius
btn-hero-shadow -> button-hero-shadow
btn-hero-text-shadow -> button-hero-text-shadow
btn-hero-bevel-size -> button-hero-bevel-size
btn-hero-glow-size -> button-hero-glow-size
btn-hero-[status]-bevel-color -> button-hero-[status]-bevel-color
btn-hero-[status]-glow-color -> button-hero-[status]-glow-color
btn-hero-[status]-left-bg -> button-hero-[status]-left-background-color
btn-hero-[status]-right-bg -> button-hero-[status]-right-background-color
btn-hero-[status]-left-hover-bg -> button-hero-[status]-hover-left-background-color
btn-hero-[status]-right-hover-bg -> button-hero-[status]-hover-right-background-color
btn-hero-[status]-left-active-bg -> button-hero-[status]-active-left-background-color
btn-hero-[status]-right-active-bg -> button-hero-[status]-active-right-background-color
btn-outline-fg -> button-outline-[status]-border-color
btn-outline-hover-fg -> button-outline-[status]-hover-border-color
btn-outline-focus-fg -> button-outline-[status]-focus-border-color

Following theme properties were removed:
btn-group-bg
btn-group-fg
btn-group-separator
btn-disabled-opacity
btn-secondary-bg
btn-secondary-hover-bg
btn-secondary-active-bg
btn-secondary-border
btn-secondary-border-width
btn-hero-secondary-bevel-color
btn-hero-secondary-glow-color
btn-hero-border-radius

'btn-pulse' status renamed to 'button-pulse'.

'btn-full-width' renamed to 'full-width'.

Progress
Following progress theme variables were renamed:
progress-bar-height-xlg -> progress-bar-giant-height
progress-bar-height-lg -> progress-bar-large-height
progress-bar-height -> progress-bar-medium-height
progress-bar-height-sm -> progress-bar-small-height
progress-bar-height-xs -> progress-bar-tiny-height
progress-bar-font-size-xlg -> progress-bar-giant-text-font-size
progress-bar-font-size-lg -> progress-bar-large-text-font-size
progress-bar-font-size -> progress-bar-medium-text-font-size
progress-bar-font-size-sm -> progress-bar-small-text-font-size
progress-bar-font-size-xs -> progress-bar-tiny-text-font-size
progress-bar-radius -> progress-bar-border-radius
progress-bar-bg -> progress-bar-[status]-background-color
progress-bar-font-color -> progress-bar-[status]-background-color
progress-bar-font-weight -> progress-bar-[size]-text-font-weight
progress-bar-primary-bg -> progress-bar-[status]-background-color
progress-bar-success-bg -> progress-bar-[status]-background-color
progress-bar-info-bg -> progress-bar-[status]-background-color
progress-bar-warning-bg -> progress-bar-[status]-background-color
progress-bar-danger-bg -> progress-bar-[status]-background-color

'progress-bar-default-bg' removed.

Size values changed from 'xs', 'sm', 'lg', 'xlg' changed to 'tiny',
'small', 'medium', 'large', 'giant'.

Size classes now set on nb-progress-bar element. Also class naming
changed to 'size-[size-name]', 'status-[status-name]'.

Accordion
NbAccordionComponent static properties were unused and removed.
STATUS_ACTIVE, STATUS_DISABLED, STATUS_PRIMARY, STATUS_INFO,
STATUS_SUCCESS, STATUS_WARNING,STATUS_DANGER.

Following theme properties were renamed:
accordion-header-font-family -> accordion-header-text-font-family
accordion-header-font-size -> accordion-header-text-font-size
accordion-header-font-weight -> accordion-header-text-font-weight
accordion-header-fg-heading -> accordion-header-text-color
accordion-header-disabled-fg -> accordion-header-disabled-text-color
accordion-header-border-type -> accordion-header-border-style
accordion-item-bg -> accordion-item-background-color
accordion-item-font-size -> accordion-item-text-font-size
accordion-item-font-weight -> accordion-item-text-font-weight
accordion-item-font-family -> accordion-item-text-font-family
accordion-item-fg-text -> accordion-item-text-color
accordion-item-shadow -> accordion-shadow

'accordion-separator' removed.

Calendar
Following theme properties were renamed:
calendar-header-title-font-size -> calendar-header-title-text-font-size
calendar-header-title-font-weight -> calendar-header-title-text-font-weight
calendar-header-sub-title-font-size -> calendar-header-sub-title-text-font-size
calendar-header-sub-title-font-weight -> calendar-header-sub-title-text-font-weight
calendar-selected-item-bg -> calendar-cell-selected-background-color
calendar-hover-item-bg -> calendar-cell-hover-background-color
calendar-today-item-bg -> calendar-cell-today-background-color
calendar-active-item-bg -> calendar-cell-active-background-color
calendar-fg -> calendar-text-color
calendar-selected-fg -> calendar-cell-selected-text-color
calendar-today-fg -> calendar-cell-today-text-color
calendar-weekday-font-size -> calendar-weekday-text-font-size
calendar-weekday-font-weight -> calendar-weekday-text-font-weight
calendar-weekday-fg -> calendar-weekday-text-color
calendar-weekday-holiday-fg -> calendar-weekday-holiday-text-color
calendar-range-bg-in-range -> calendar-in-range-background-color

'calendar-inactive-opacity' and 'calendar-disabled-opacity' removed.

Sidebar
Following theme properties were renamed:
sidebar-fg -> sidebar-text-color
sidebar-bg -> sidebar-background-color

Datepicker
Following theme properties were renamed:
datepicker-fg -> datepicker-text-color
datepicker-bg -> datepicker-background-color
datepicker-border -> datepicker-border-color
datepicker-border-radius -> datepicker-border-radius

Layout
Following theme properties were renamed:

header-font-family -> header-text-font-family
header-font-size -> header-text-font-size
header-line-height -> header-text-line-height
header-fg -> header-text-color
header-bg -> header-background-color

layout-font-family -> layout-text-font-family
layout-font-size -> layout-text-font-size
layout-line-height -> layout-text-line-height
layout-fg -> layout-text-color
layout-bg -> layout-background-color
layout-window-mode-bg -> layout-window-mode-background-color

footer-fg -> footer-text-color
footer-fg-highlight -> footer-text-highlight-color
footer-bg -> footer-background-color
footer-separator -> footer-divider-color

Select
Only 'null' and 'undefined' option values now considered as reset. false and falsy values such as 0, '', NaN don't reset select value anymore.

Menu
Collapsed menu icon changes direction based on current layout direction.

Overlay
Theme property 'overlay-backdrop-bg' renamed to 'overlay-backdrop-background-color'.

Icon
NbIconComponent status static fields removed.
STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER.
'status' field now uses common NbComponentStatus type.

NbIconComponent static class names renamed to 'status-[status-name]'.

Following theme properties were renamed:
icon-primary-fg -> icon-primary-color
icon-info-fg -> icon-info-color
icon-success-fg -> icon-success-color
icon-warning-fg -> icon-warning-color
icon-danger-fg -> icon-danger-color

Actions
NbActionsComponent 'inverseValue' field and 'inverse' setter removed.
NbActionsComponent 'fullWidthValue' field replaced with 'fullWidth'.
NbActionsComponent size class named renamed to 'size-[size-name]'.
NbActionsComponent static fields SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE removed.
NbActionComponent 'disabledValue' field replaced with 'disabled'.

Following theme variables name were renamed:
actions-font-size -> actions-[size]-text-font-size
actions-font-family -> actions-text-font-family
actions-line-height -> actions-text-line-height
actions-fg -> actions-text-color
actions-bg -> actions-background-color
actions-separator -> actions-divider-color
actions-padding -> actions-[size]-padding
actions-size-small -> actions-small-height
actions-size-medium -> actions-medium-height
actions-size-large -> actions-large-height

Stepper
Following theme properties were renamed:
stepper-index-size -> stepper-step-index-width
stepper-label-font-size -> stepper-step-text-font-size
stepper-label-font-weight -> stepper-step-text-font-weight
stepper-completed-fg -> stepper-step-completed-text-color
stepper-fg -> stepper-step-text-color
stepper-step-padding -> stepper-step-content-padding

Following theme properties were removed:
stepper-accent-color
stepper-completed-icon-size
stepper-completed-icon-weight

NbStepperOrientation changed to type.

NbStepperComponent 'disableStepNavigationValue' property removed. Use
'disableStepNavigation' instead.

Alert
NbAlertComponent 'closableValue' replaced with 'closable'.

All NbAlertComponent static fields removed.
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE,
SIZE_XLARGE, SIZE_XXLARGE, STATUS_ACTIVE, STATUS_DISABLED,
STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING,
STATUS_DANGER, ACCENT_ACTIVE, ACCENT_DISABLED, ACCENT_PRIMARY,
ACCENT_INFO, ACCENT_SUCCESS, ACCENT_WARNING, ACCENT_DANGER,
OUTLINE_ACTIVE, OUTLINE_DISABLED, OUTLINE_PRIMARY, OUTLINE_INFO,
OUTLINE_SUCCESS, OUTLINE_WARNING, OUTLINE_DANGE.

Active status removed.
Disabled become input instead of status value. Disabled class renamed to
'disabled'.

NbAlertComponent 'hasAccent', 'hasStatus', 'hasOutline' getters removed.

Status class names changed to 'status-[status-name]'.
Outline class names changed to 'outline-[status-name]'.
Accent class names changed to 'accent-[status-name]'.

Following theme properties were renamed:

alert-font-size -> alert-text-font-size
alert-line-height -> alert-text-line-height
alert-font-weight -> alert-text-font-weight
alert-fg -> alert-text-color
alert-bg -> alert-background-color
alert-disabled-bg -> alert-disabled-background-color
alert-disabled-fg -> alert-disabled-text-color
alert-primary-bg -> alert-primary-background-color
alert-info-bg -> alert-info-background-color
alert-success-bg -> alert-success-background-color
alert-warning-bg -> alert-warning-background-color
alert-danger-bg -> alert-danger-background-color
alert-height-xsmall -> alert-tiny-height
alert-height-small -> alert-small-height
alert-height-medium -> alert-medium-height
alert-height-large -> alert-medium-padding
alert-height-xlarge -> alert-large-height
alert-closable-padding -> alert-closable-start-padding
alert-margin -> alert-bottom-margin

Following theme properties removed:
alert-outline-fg
alert-active-bg
alert-height-xxsmall
alert-height-xxlarge
alert-button-padding

Badge
NbBadgeComponent status static fields removed.
STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING,
STATUS_DANGER.

NbBadgeComponent position static fields replaced with NbBadgePosition type.
Removed properties: TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, BOTTOM_RIGHT,
TOP_START, TOP_END, BOTTOM_START, BOTTOM_END.

Badge status class now set on host element

NbBadgeComponent 'positionClass' getter removed.
Badge position class set on host element.
Position class names prefixed with 'position-'.

Following theme properties were renamed:
badge-fg-text -> badge-[status]-text-color
badge-primary-bg-color -> badge-primary-background-color
badge-success-bg-color -> badge-success-background-color
badge-info-bg-color -> badge-info-background-color
badge-warning-bg-color -> badge-warning-background-color
badge-danger-bg-color -> badge-danger-background-color

Tree-grid
Following theme properties were renamed:
tree-grid-header-bg -> tree-grid-header-background
tree-grid-footer-bg -> tree-grid-footer-background
tree-grid-row-bg -> tree-grid-row-background
tree-grid-row-bg-even -> tree-grid-row-even-background
tree-grid-row-hover-bg -> tree-grid-row-hover-background

Following theme properties were removed:
tree-grid-sort-header-button-font-weight
tree-grid-sort-header-button-color
tree-grid-icon-color

Select
Arrow selector and element changed to svg icon.

NbSelectComponent 'isOpened' getter renamed to 'isOpen'.

NbOptionComponent and NbOptionGroupComponent 'disabledClass' getter
renamed to 'disabledAttribute'.

Following theme properties were renamed:
select-border-width -> select-[appearance]-border-width
select-max-height -> select-options-list-max-height
select-bg -> select-[appearance]-background-color
select-option-disabled-bg -> select-option-[appearance]-disabled-background-color
select-option-padding -> select-option-[appearance]-[size]-padding

Following theme properties removed:
select-checkmark-color
select-checkbox-color
select-option-disabled-opacity

Chat
NbChatComponent 'accent' field removed.

NbChatComponent sizes 'xxsmall' and 'xxlarge' removed.
'xsmall' size changed to 'tiny', 'xlarge' changed to 'giant'.
Size class changed to 'size-[size-name]'.
All size static fields removed (SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL,
SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE).

NbChatComponent 'active' status removed.

Disabled status removed. Use disabled input instead.

Status class names changed to 'status-[status-name]'.

NbChatMessageComponent 'replyValue' changed to 'reply'.

Following theme properties removed:

chat-font-size -> chat-text-font-size
chat-fg -> chat-text-color
chat-bg -> chat-background-color
chat-height-xsmall -> chat-tiny-height
chat-height-small -> chat-small-height
chat-height-medium -> chat-medium-height
chat-height-large -> chat-large-height
chat-height-xlarge -> chat-giant-height
chat-separator -> chat-divider-color
chat-message-fg -> chat-message-text-color
chat-message-bg -> chat-message-background
chat-message-reply-bg -> chat-message-reply-background-color
chat-message-reply-fg -> chat-message-reply-text-color
chat-message-avatar-bg -> chat-message-avatar-background-color
chat-message-sender-fg -> chat-message-sender-text-color
chat-message-quote-fg -> chat-message-quote-background-color
chat-message-quote-bg -> chat-message-quote-text-color
chat-message-file-fg -> chat-message-file-text-color
chat-message-file-bg -> chat-message-file-background-color
chat-primary-bg -> chat-primary-background-color
chat-success-bg -> chat-success-background-color
chat-info-bg -> chat-info-background-color
chat-warning-bg -> chat-warning-background-color
chat-danger-bg -> chat-danger-background-color

Following theme properties removed:

chat-fg-text
chat-height-xxsmall
chat-height-xxlarge
chat-form-bg
chat-form-fg
chat-form-border
chat-form-placeholder-fg
chat-form-active-border
chat-disabled-bg
chat-disabled-fg
chat-active-bg

Toastr
NbToastStatus enum removed. Toastr now uses common NbComponentstatus type.

NbToastComponent status class names changed to 'status-[status-name]'.
'default' class removed.

Following theme properties were renamed:
toastr-bg -> toastr-background
toastr-fg -> toastr-text-color
toastr-border -> toastr-border-style, toastr-border-width

'toastr-icon-radius' removed.

Search
Following theme properties renamed:
search-bg -> search-background-color
search-bg-secondary -> search-extra-background-color
search-text -> search-text-color
search-info -> search-info-text-color
search-dash -> search-divider-color
search-placeholder -> search-placeholder-text-color

Following theme properties removed:
search-btn-open-fg
search-btn-close-fg

Menu
Removed inverse mode.

NbMenuComponent 'autoCollapseValue' property changed to 'autoCollapse'.

Following theme variables were removed:
menu-font-family -> menu-text-font-family
menu-font-size -> menu-text-font-size
menu-font-weight -> menu-text-font-weight
menu-fg -> menu-text-color
menu-bg -> menu-background-color
menu-active-fg -> menu-item-active-text-color
menu-active-bg -> menu-item-active-background-color
menu-submenu-bg -> menu-submenu-background-color
menu-submenu-fg -> menu-submenu-text-color
menu-submenu-active-fg -> menu-submenu-item-active-text-color
menu-submenu-active-bg -> menu-submenu-item-active-background-color
menu-submenu-active-border-color -> menu-submenu-item-active-border-color
menu-submenu-hover-fg -> menu-item-hover-text-color
menu-submenu-hover-bg -> menu-item-hover-background-color
menu-group-fg -> menu-group-text-color
menu-item-separator -> menu-item-divider-color
menu-icon-font-size -> menu-item-icon-width
menu-icon-margin -> menu-item-icon-margin
menu-icon-color -> menu-item-icon-color
menu-icon-active-color -> menu-item-icon-active-color

Following theme properties were removed:
menu-submenu-active-shadow
menu-active-font-weight
menu-submenu-item-container-padding
menu-group-font-weight
menu-group-font-size
menu-group-padding

Context menu
'context-menu-border' split into 'context-menu-border-color',
'context-menu-border-style' and 'context-menu-border-width'.

Following theme properties were removed:
context-menu-fg
context-menu-bg
context-menu-active-fg
context-menu-active-bg
context-menu-arrow-size

Typography
'alert', 'alert-success', 'alert-info', 'alert-warning', 'alert-danger',
'alert-primary', 'alert-hint', 'font-secondary', 'font-main',
'font-w-light', 'font-w-regular', 'font-w-bold', 'text-primary',
'text-warning', 'text-success', 'text-info', 'text-danger',
'text-heading', 'text-body', 'text-hint', 'text-white', 'bg-primary',
'bg-warning', 'bg-success', 'bg-info', 'bg-danger', 'bg-heading',
'bg-body', 'bg-hint', 'bg-white', 'text-indent', 'blockquote',
'blockquote-reverse', 'blockquote-footer', 'small', 'mark'.

nnixaa and others added 30 commits April 17, 2019 20:53
BREAKING CHANGES:
- calendar - use primary button in cosmic theme
- checkbox - `opacity` instead of `lightning`
- context-menu, popover, datepicker - `calc` instead of `round` and scss calculations
- input - `opacity` for placeholder instead of `lightning`
- tabs - remove gradient for tab bottom separator in cosmic theme
- toastr - use `background-color` instead of the gradient in cosmic theme
- text colors are now used from success/primary/warning/etc colors
- add color palette instead of generating colors using scss-functions, an example for `primary`
`color-primary-200`
`color-primary-300`
`color-primary-400`
`color-primary-600`
`color-primary-700`

`create-colors-palette()` scss function that can be used during the theme installation process to generate palette automatically

Closes #1228
Disable e2e on next branch. Will be enabled after updating tests to new colors, etc.
…-icons package (#1319)

BREAKING CHANGE:

Starting from version 4.0, Nebular introduces new `nb-icon` component and `NbIconLibraries` service to host SVG and Font icon packs. As a breaking change, Nebular moves from `nebular-icons` package to much more popular [Eva Icons pack](https://akveo.github.io/eva-icons/) consisting of 480+ beautiful SVG icons. We believe this will bring more quality and variety to interfaces based on Nebular.

Now all Nebular components internally use `<nb-icon></nb-icon>` component utilizing Eva Icons SVG icons. More details on [nb-icon](https://akveo.github.io/nebular/docs/components/icon) component.

There are two ways to upgrade:
**Migrate to Eva Icons** (recommended):
1) install Eva Icons Nebular package `npm i @nebular/eva-icons`
2) register `NbEvaIconsModule` in the `app.module.ts`
```
import { NbEvaIconsModule } form '@nebular/eva-icons';

@NgModule({
  imports: [
  	// ...
    NbEvaIconsModule,
  ],
})
```
3) Search for all usages of `<span icon="nb-*"` or ``<i icon="nb-*"``and replace with `<nb-icon icon="icon-name"></nb-icon>`. Full icons list https://akveo.github.io/eva-icons/.

4) Search for `icon: 'nb-*'` references in properties for such components as Menu, Actions, Tabs, etc. Replace those with `icon: 'icon-name'`. Please note, there is no need to specify any icon prefix (such as `eva-` or `nb-`) since prefix is specified when the icon package is registered in Nebular.

4) Update styles if necessary.

5) if you have `nebular-icons` installed, remove the package and all references.

**Continue using nebular-icons**
This option is also possible, but please note, Nebular Component will still use Eva Icons pack for internal component icons, such as `close`, `arrow-down`, `arrow-up`, etc.

1) Register nebular-icons as a pack for Nebular in your `app.component.ts`
```
  import { NbIconLibraries } from '@nebular/theme';

  constructor(private iconLibraries: NbIconLibraries) {
    this.iconLibraries.registerFontPack('nebular', { iconClassPrefix: 'nb' });
    this.iconLibraries.setDefaultPack('nebular');
  }
```

3) Search for all usages of `<span icon="nb-*"` or ``<i icon="nb-*"`` and replace with `<nb-icon icon="icon-name"></nb-icon>` without the `nb-` prefix  since prefix is specified when the icon package is registered in Nebular.

4) Search for `icon: 'nb-*'` references in properties for such components as Menu, Actions, Tabs, etc. Replace those with `icon: 'icon-name'` without `nb-` prefix since it is unnecessary and covered under the hood.

Please open an issue if you have any questions or having difficulties to migrate.
BREAKING CHANGES:

Following theme variables were renamed:
radio-bg -> radio-border-color, radio-inner-circle-color, radio-[status]-border-color, radio-[status]-inner-circle-color
radio-fg -> radio-text-color
radio-size -> radio-width, radio-height
radio-border-size -> radio-border-width
radio-checkmark -> radio-inner-circle-color
radio-disabled-checkmark -> radio-disabled-inner-circle
radio-indicator -> radio-circle
radio-description -> text

Following theme variables were removed:
radio-checked-bg
radio-checked-size
radio-checked-border-size
radio-checked-border-color
radio-checked-checkmark
radio-disabled-bg
radio-disabled-size
radio-disabled-border-size

'radio-bg', 'radio-checkmark' theme variables were removed.
Use radio-[status]-border-color and radio-[status]-inner-circle-color
instead.

NbRadioGroupComponent setters 'setValue', 'setName', 'setDisabled',
'setStatus' were removed. Use 'value', 'name', 'disabled', 'status'.

NbRadioComponent setter 'setDisabled' removed. Use 'disabled' instead.

BREAKING CHANGES:
Following map keys were removed:
  - border-color
  - color-gray
  - color-neutral
  - color-disabled
Mapping for borders, disabled and similar styles would controlled
by design system and configured for each component individually.

Properties 'checkbox-bg', 'checkbox-checked-bg' and 'checkbox-disabled-bg'
replaced with:
  - checkbox-disabled-background-color
  - checkbox-[status]-background-color
  - checkbox-[status]-checked-background-color
  - checkbox-[status]-indeterminate-background-color
  - checkbox-[status]-focus-background-color
  - checkbox-[status]-hover-background-color
  - checkbox-[status]-active-background-color

Property 'checkbox-size' splited into 'checkbox-height', 'checkbox-width'.

Following properties were removed (along with ability to change appearance of checkbox
based on checked or disabled state):
  - checkbox-checked-size
  - checkbox-checked-border-size
  - checkbox-disabled-size
  - checkbox-disabled-border-size

Property 'checkbox-border-size' replaced with 'checkbox-border-width'.

Properties 'checkbox-border-color', 'checkbox-checked-border-color', 'checkbox-disabled-border-color'
replaced with:
  - checkbox-disabled-border-color
  - checkbox-[status]-border-color
  - checkbox-[status]-checked-border-color
  - checkbox-[status]-indeterminate-border-color
  - checkbox-[status]-hover-border-color
  - checkbox-[status]-active-border-color

Properties 'checkbox-checkmark', 'checkbox-checked-checkmark', 'checkbox-disabled-checkmark'
replaced with:
  - checkbox-disabled-checkmark-color
  - checkbox-[status]-checked-checkmark-color
  - checkbox-[status]-indeterminate-checkmark-color

Check mark pseudo element replaced with nb-icon.

Checkbox classes were changed.
Class 'customised-control' replaced with 'label'.
Class 'customised-control-input' replaced with 'native-input'.
Class 'customised-control-indicator' replaced with 'custom-checkbox'.
Class 'customised-control-description' replaced with 'text'.

NbCheckboxComponent's '_value' property now private. Use 'value' instead.

Following theme properties were renamed:
form-control-border-width -> input-border-width
form-control-border-radius -> input-rectangle-border-radius
form-control-semi-round-border-radius -> input-semi-round-border-radius
form-control-round-border-radius -> input-round-border-radius
form-control-text-primary-color -> input-text-color
form-control-border-color -> input-border-color
form-control-selected-border-color -> input-focus-border-color, input-[status]-focus-color
form-control-bg -> input-background-color
form-control-focus-bg -> input-focus-border-color
form-control-placeholder-color -> input-placeholder-text-color
form-control-placeholder-font-size -> input-placeholder-font-size
form-control-font-size -> input-medium-text-font-size
form-control-font-size-sm -> input-small-text-font-size
form-control-font-size-lg -> input-large-text-font-size
form-control-padding -> input-medium-padding
form-control-padding-sm -> input-small-padding
form-control-padding-lg -> input-large-padding
form-control-info-border-color -> input-info-border-color
form-control-success-border-color -> input-success-border-color
form-control-danger-border-color -> input-danger-border-color
form-control-warning-border-color -> input-warning-border-color
form-control-border-type -> input-border-style

Removed:
form-control-label-font-weight
form-control-feedback-font-size
form-control-feedback-font-weight

Input status classes were renamed from input-[status-name] to status-[status-name].
Input size classes were renamed from input-[size-name] to size-[size-name].
Input shape classes were renamed from input-[shape-name] to shape-[shape-name].

All NbInputDirective static fields removed. Removed fields:
SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS,
STATUS_WARNING, STATUS_DANGER, SHAPE_SEMI_ROUND, SHAPE_RECTANGLE, SHAPE_ROUND.
Use NbComponentStatus, NbComponentShape, NbComponentSize instead.

NbInputDirective 'size' property and 'setSize' getter removed.
Use unified 'fieldSize' property instead.

NbInputDirective 'setFullWidth' replaced with read/write 'fullWidth' property.

Remove bootstrap theme support until it's refactored to use updated
theme properties
BREAKING CHANGE:

Following tooltip theme properties were renamed:
tooltip-bg -> tooltip-background-color
tooltip-fg -> tooltip-text-color
tooltip-font-size -> tooltip-text-font-size
tooltip-status-fg -> tooltip-[status]-text-color
tooltip-primary-bg -> tooltip-primary-background-color
tooltip-info-bg -> tooltip-info-background-color
tooltip-success-bg -> tooltip-success-background-color
tooltip-warning-bg -> tooltip-warning-background-color
tooltip-danger-bg -> tooltip-danger-background-color

Tooltip status class renamed from [status-name]-tooltip to
status-[status-name].
BREAKING CHANGE:

Following properties where renamed:
popover-fg -> popover-text-color
popover-bg -> popover-background-color
popover-border -> popover-border-color
BREAKING CHANGE:

'isMenuShown' property removed from NbUserComponent.
'inverse' input removed from NbUserComponent.
'background' class renamed to 'initials'.
NbUserComponent SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE
size static properties were removed. Use NbComponentSize instead.

Size class names were prefixed with 'size-'.
small -> size-small
medium -> size-medium
large -> size-large
xlarge -> size-giant

Following properties were renamed:
user-font-size -> user-[size]-initials-text-font-size, user-[size]-name-text-font-size, user-[size]-title-text-font-size
user-line-height -> user-[size]-initials-text-line-height, user-[size]-name-text-line-height, user-[size]-title-text-line-height
user-bg -> user-picture-box-background-color
user-fg -> user-initials-text-color
user-fg-highlight -> user-picture-box-border-color
user-font-family-secondary -> user-name-text-font-family
user-size-small -> user-small-height, user-small-width
user-size-medium -> user-medium-height, user-medium-width
user-size-large -> user-large-height, user-large-width
user-size-xlarge -> user-giant-height, user-giant-width

NbUserComponent 'showNameValue', 'showTitleValue', 'showInitialsValue'
properties removed. Use 'showName', 'showTitle', 'showInitials' instead.
BREAKING CHANGE:

NbTabset theme properties prefix changed to 'tabset'.

Following properties were renamed:
tabs-font-family -> tabset-tab-text-font-family
tabs-font-size -> tabset-tab-text-font-size
tabs-content-font-family -> tabset-content-text-font-family
tabs-content-font-size -> tabset-content-text-font-size
tabs-active-bg -> tabset-tab-selected-background-color
tabs-padding -> tabset-tab-padding
tabs-content-padding -> tabset-content-padding
tabs-header-bg -> tabset-tab-background-color
tabs-separator -> tabset-divider-color
tabs-fg -> tabset-tab-text-color
tabs-fg-disabled -> tabset-tab-disabled-text-color
tabs-fg-text -> tabset-content-text-color
tabs-fg-heading -> tabset-tab-selected-text-color, tabset-tab-focus-text-color, tabset-tab-hover-text-color
tabs-bg -> tabset-content-background-color
tabs-selected -> tabset-tab-underline-color
tabs-icon-only-max-width -> tabset-tab-text-hide-breakpoint

Following properties were removed:
tabs-active-font-weight
tabs-selected-second-color
tabs-selected-degrees

NbRouteTabset theme properties prefix changed to 'route-tabset'.

Following properties were renamed:
route-tabs-font-family -> route-tabset-tab-text-font-family
route-tabs-font-size -> route-tabset-tab-text-font-size
route-tabs-active-bg -> route-tabset-tab-selected-background-color
route-tabs-active-font-weight ->
route-tabs-padding -> route-tabset-tab-padding
route-tabs-header-bg -> route-tabset-tab-background-color
route-tabs-separator -> route-tabset-divider-color
route-tabs-fg -> route-tabset-tab-text-color
route-tabs-fg-disabled -> route-tabset-tab-disabled-text-color
route-tabs-fg-heading -> route-tabset-tab-selected-text-color, route-tabset-tab-focus-text-color,
route-tabset-tab-hover-text-color
route-tabs-selected -> route-tabset-tab-underline-color
route-tabs-icon-only-max-width -> route-tabset-tab-text-hide-breakpoint

'route-tabs-bg' property was unused and removed.
BREAKING CHANGE:

Following properties were renamed:
card-font-size -> card-text-font-size
card-font-weight -> card-text-font-weight
card-line-height -> card-text-line-height
card-bg -> card-background-color
card-border-type -> card-border-style
card-separator -> card-divider-color
card-header-fg -> card-header-text-color
card-header-primary-bg -> card-header-primary-background-color
card-header-info-bg -> card-header-info-background-color
card-header-success-bg -> card-header-success-background-color
card-header-warning-bg -> card-header-warning-background-color
card-header-danger-bg -> card-header-danger-background-color
card-header-disabled-bg -> card-header-disabled-background-color
card-margin -> card-margin-bottom
card-height-xxsmall -> card-height-tiny
card-height-small -> card-height-small
card-height-medium -> card-height-medium
card-height-large -> card-height-large
card-height-xlarge -> card-height-giant

Following properties were removed:
card-fg
card-fg-text
card-fg-heading
card-header-fg-heading
card-header-active-bg
card-header-active-fg
card-header-border-width
card-header-border-type
card-header-border-color
card-height-xsmall
card-height-xxlarge

All NbCardComponent static fields were removed. Removed fields:
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER, ACCENT_PRIMARY, ACCENT_INFO, ACCENT_SUCCESS, ACCENT_WARNING, ACCENT_DANGER.
Use NbComponentStatus, NbComponentSize instead.

'disabled' status replaced with disabled input. 'active' status removed.
Card size class renamed from 'card-[size-name]' to 'size-[size-name]'.
Card status classes were renamed from '[status-name]-card' to
'status-[status-name]'.

NbCardComponent 'xsmall' and 'xxlarge' getters along with 'size-xsmall'
and 'size-xxlarge' removed.

NbCardComponent 'xxsmall', 'small', 'medium', 'large', 'xlarge' getters
renamed to 'tiny', 'small', 'medium', 'large', 'giant' accordingly.
BREAKING CHANGE:

Following spinner theme properties were renamed:
spinner-bg -> spinner-background-color
spinner-circle-bg -> spinner-circle-filled-color
spinner-fg -> spinner-text-color
spinner-primary-bg -> spinner-primary-circle-filled-color
spinner-info-bg -> spinner-info-circle-filled-color
spinner-success-bg -> spinner-success-circle-filled-color
spinner-warning-bg -> spinner-warning-circle-filled-color
spinner-danger-bg -> spinner-danger-circle-filled-color
spinner-xsmall -> spinner-height-tiny
spinner-small -> spinner-height-small
spinner-medium -> spinner-height-medium
spinner-large -> spinner-height-large
spinner-xlarge -> spinner-height-giant

Following properties were removed:
spinner-xxsmall
spinner-xxlarge
spinner-disabled-bg
spinner-disabled-fg
spinner-active-bg

'active' and 'disabled' along with NbSpinnerComponent STATUS_ACTIVE, STATUS_DISABLED static properties statuses were removed.

Following NbSpinnerComponent static properties were removed:
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE, STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER.

Classes '[size-name]-spinner' changed to 'size-[size-name]'.
Classes '[status-name]-spinner' changed to 'status-[status-name]'.

NbSpinnerComponent 'xxsmall' and 'xxlarge' getters removed.
BREAKING CHANGE:

'accent' property removed.

Static properties removed. Removed properties:
SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE, STATUS_PRIMARY,
STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING, STATUS_DANGER,
SHAPE_RECTANGLE, SHAPE_ROUND, SHAPE_SEMI_ROUND.
Use NbComponentSize, NbComponentStatus, NbComponentShape.

Size classes were renamed:
btn-xsmall -> size-tiny
btn-small -> size-small
btn-medium -> size-medium
btn-large -> size-large

Size getter 'xsmall' renamed to tiny.

Status classes were renamed:
btn-primary -> status-primary
btn-info -> status-info
btn-success -> status-success
btn-warning -> status-warning
btn-danger -> status-danger

Shape classes were renamed:
btn-rectangle -> shape-rectangle
btn-round -> shape-round
btn-semi-round -> shape-semi-round

'btn-outline' class renamed to 'appearance-outline'.
'btn-hero' class renamed to 'appearance-hero'.

Button theme properties prefix changed to 'button' (was 'btn').

Following theme properties were renamed:
btn-fg -> button-filled-[status]-text-color,
button-outline-[status]-[state?]-text-color,
button-ghost-[status]-[state?]-text-color,
button-hero-[status]-text-color
btn-font-family -> button-text-font-family
btn-line-height -> button-[size]-text-line-height
btn-cursor -> button-cursor
btn-[status]-bg -> button-filled-[status]-background-color
btn-[status]-hover-bg -> button-filled-[status]-hover-background-color
btn-[status]-active-bg -> button-filled-[status]-active-background-color
btn-padding-y-[size], btn-padding-x-[size] -> button-[appearance]-[size]-padding
btn-font-size-[size] -> button-[size]-text-font-size
btn-rectangle-border-radius -> button-rectangle-border-radius
btn-semi-round-border-radius -> button-semi-round-border-radius
btn-round-border-radius -> button-round-border-radius
btn-hero-shadow -> button-hero-shadow
btn-hero-text-shadow -> button-hero-text-shadow
btn-hero-bevel-size -> button-hero-bevel-size
btn-hero-glow-size -> button-hero-glow-size
btn-hero-[status]-bevel-color -> button-hero-[status]-bevel-color
btn-hero-[status]-glow-color -> button-hero-[status]-glow-color
btn-hero-[status]-left-bg -> button-hero-[status]-left-background-color
btn-hero-[status]-right-bg -> button-hero-[status]-right-background-color
btn-hero-[status]-left-hover-bg -> button-hero-[status]-hover-left-background-color
btn-hero-[status]-right-hover-bg -> button-hero-[status]-hover-right-background-color
btn-hero-[status]-left-active-bg -> button-hero-[status]-active-left-background-color
btn-hero-[status]-right-active-bg -> button-hero-[status]-active-right-background-color
btn-outline-fg -> button-outline-[status]-border-color
btn-outline-hover-fg -> button-outline-[status]-hover-border-color
btn-outline-focus-fg -> button-outline-[status]-focus-border-color

Following theme properties were removed:
btn-group-bg
btn-group-fg
btn-group-separator
btn-disabled-opacity
btn-secondary-bg
btn-secondary-hover-bg
btn-secondary-active-bg
btn-secondary-border
btn-secondary-border-width
btn-hero-secondary-bevel-color
btn-hero-secondary-glow-color
btn-hero-border-radius

'btn-pulse' status renamed to 'button-pulse'.

'btn-full-width' renamed to 'full-width'.
BREAKING CHANGE:

Following progress theme variables were renamed:
progress-bar-height-xlg -> progress-bar-giant-height
progress-bar-height-lg -> progress-bar-large-height
progress-bar-height -> progress-bar-medium-height
progress-bar-height-sm -> progress-bar-small-height
progress-bar-height-xs -> progress-bar-tiny-height
progress-bar-font-size-xlg -> progress-bar-giant-text-font-size
progress-bar-font-size-lg -> progress-bar-large-text-font-size
progress-bar-font-size -> progress-bar-medium-text-font-size
progress-bar-font-size-sm -> progress-bar-small-text-font-size
progress-bar-font-size-xs -> progress-bar-tiny-text-font-size
progress-bar-radius -> progress-bar-border-radius
progress-bar-bg -> progress-bar-[status]-background-color
progress-bar-font-color -> progress-bar-[status]-background-color
progress-bar-font-weight -> progress-bar-[size]-text-font-weight
progress-bar-primary-bg -> progress-bar-[status]-background-color
progress-bar-success-bg -> progress-bar-[status]-background-color
progress-bar-info-bg -> progress-bar-[status]-background-color
progress-bar-warning-bg -> progress-bar-[status]-background-color
progress-bar-danger-bg -> progress-bar-[status]-background-color

'progress-bar-default-bg' removed.

Size values changed from 'xs', 'sm', 'lg', 'xlg' changed to 'tiny',
'small', 'medium', 'large', 'giant'.

Size classes now set on nb-progress-bar element. Also class naming
changed to 'size-[size-name]', 'status-[status-name]'.
BREAKING CHANGE:

NbAccordionComponent static properties were unused and removed.
STATUS_ACTIVE, STATUS_DISABLED, STATUS_PRIMARY, STATUS_INFO,
STATUS_SUCCESS, STATUS_WARNING,STATUS_DANGER.

Following theme properties were renamed:
accordion-header-font-family -> accordion-header-text-font-family
accordion-header-font-size -> accordion-header-text-font-size
accordion-header-font-weight -> accordion-header-text-font-weight
accordion-header-fg-heading -> accordion-header-text-color
accordion-header-disabled-fg -> accordion-header-disabled-text-color
accordion-header-border-type -> accordion-header-border-style
accordion-item-bg -> accordion-item-background-color
accordion-item-font-size -> accordion-item-text-font-size
accordion-item-font-weight -> accordion-item-text-font-weight
accordion-item-font-family -> accordion-item-text-font-family
accordion-item-fg-text -> accordion-item-text-color
accordion-item-shadow -> accordion-shadow

'accordion-separator' removed.
BREAKING CHANGE:

Following theme properties were renamed:
calendar-header-title-font-size -> calendar-header-title-text-font-size
calendar-header-title-font-weight -> calendar-header-title-text-font-weight
calendar-header-sub-title-font-size -> calendar-header-sub-title-text-font-size
calendar-header-sub-title-font-weight -> calendar-header-sub-title-text-font-weight
calendar-selected-item-bg -> calendar-cell-selected-background-color
calendar-hover-item-bg -> calendar-cell-hover-background-color
calendar-today-item-bg -> calendar-cell-today-background-color
calendar-active-item-bg -> calendar-cell-active-background-color
calendar-fg -> calendar-text-color
calendar-selected-fg -> calendar-cell-selected-text-color
calendar-today-fg -> calendar-cell-today-text-color
calendar-weekday-font-size -> calendar-weekday-text-font-size
calendar-weekday-font-weight -> calendar-weekday-text-font-weight
calendar-weekday-fg -> calendar-weekday-text-color
calendar-weekday-holiday-fg -> calendar-weekday-holiday-text-color
calendar-range-bg-in-range -> calendar-in-range-background-color

'calendar-inactive-opacity' and 'calendar-disabled-opacity' removed.
BREAKING CHANGE:

Following theme properties were renamed:
sidebar-fg -> sidebar-text-color
sidebar-bg -> sidebar-background-color
BREAKING CHANGE:

Following theme properties were renamed:
datepicker-fg -> datepicker-text-color
datepicker-bg -> datepicker-background-color
datepicker-border -> datepicker-border-color
datepicker-border-radius -> datepicker-border-radius
BREAKING CHANGE:

Following theme properties were renamed:

header-font-family -> header-text-font-family
header-font-size -> header-text-font-size
header-line-height -> header-text-line-height
header-fg -> header-text-color
header-bg -> header-background-color

layout-font-family -> layout-text-font-family
layout-font-size -> layout-text-font-size
layout-line-height -> layout-text-line-height
layout-fg -> layout-text-color
layout-bg -> layout-background-color
layout-window-mode-bg -> layout-window-mode-background-color

footer-fg -> footer-text-color
footer-fg-highlight -> footer-text-highlight-color
footer-bg -> footer-background-color
footer-separator -> footer-divider-color
BREAKING CHANGE:

Only 'null' and 'undefined' option values now considered as reset. false and falsy values such as 0, '', NaN don't reset select value anymore.
BREAKING CHANGE:

Collapsed menu icon changes direction based on current layout direction.
BREAKING CHANGE:

Theme property 'overlay-backdrop-bg' renamed to 'overlay-backdrop-background-color'.
yggg and others added 27 commits April 22, 2019 13:15
BREAKING CHANGE:

NbActionsComponent 'inverseValue' field and 'inverse' setter removed.
NbActionsComponent 'fullWidthValue' field replaced with 'fullWidth'.
NbActionsComponent size class named renamed to 'size-[size-name]'.
NbActionsComponent static fields SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE removed.
NbActionComponent 'disabledValue' field replaced with 'disabled'.

Following theme variables name were renamed:
actions-font-size -> actions-[size]-text-font-size
actions-font-family -> actions-text-font-family
actions-line-height -> actions-text-line-height
actions-fg -> actions-text-color
actions-bg -> actions-background-color
actions-separator -> actions-divider-color
actions-padding -> actions-[size]-padding
actions-size-small -> actions-small-height
actions-size-medium -> actions-medium-height
actions-size-large -> actions-large-height
BREAKING CHANGE:

Following theme properties were renamed:
stepper-index-size -> stepper-step-index-width
stepper-label-font-size -> stepper-step-text-font-size
stepper-label-font-weight -> stepper-step-text-font-weight
stepper-completed-fg -> stepper-step-completed-text-color
stepper-fg -> stepper-step-text-color
stepper-step-padding -> stepper-step-content-padding

Following theme properties were removed:
stepper-accent-color
stepper-completed-icon-size
stepper-completed-icon-weight

NbStepperOrientation changed to type.

NbStepperComponent 'disableStepNavigationValue' property removed. Use
'disableStepNavigation' instead.
BREAKING CHANGE:

NbAlertComponent 'closableValue' replaced with 'closable'.

All NbAlertComponent static fields removed.
SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL, SIZE_MEDIUM, SIZE_LARGE,
SIZE_XLARGE, SIZE_XXLARGE, STATUS_ACTIVE, STATUS_DISABLED,
STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING,
STATUS_DANGER, ACCENT_ACTIVE, ACCENT_DISABLED, ACCENT_PRIMARY,
ACCENT_INFO, ACCENT_SUCCESS, ACCENT_WARNING, ACCENT_DANGER,
OUTLINE_ACTIVE, OUTLINE_DISABLED, OUTLINE_PRIMARY, OUTLINE_INFO,
OUTLINE_SUCCESS, OUTLINE_WARNING, OUTLINE_DANGE.

Active status removed.
Disabled become input instead of status value. Disabled class renamed to
'disabled'.

NbAlertComponent 'hasAccent', 'hasStatus', 'hasOutline' getters removed.

Status class names changed to 'status-[status-name]'.
Outline class names changed to 'outline-[status-name]'.
Accent class names changed to 'accent-[status-name]'.

Following theme properties were renamed:

alert-font-size -> alert-text-font-size
alert-line-height -> alert-text-line-height
alert-font-weight -> alert-text-font-weight
alert-fg -> alert-text-color
alert-bg -> alert-background-color
alert-disabled-bg -> alert-disabled-background-color
alert-disabled-fg -> alert-disabled-text-color
alert-primary-bg -> alert-primary-background-color
alert-info-bg -> alert-info-background-color
alert-success-bg -> alert-success-background-color
alert-warning-bg -> alert-warning-background-color
alert-danger-bg -> alert-danger-background-color
alert-height-xsmall -> alert-tiny-height
alert-height-small -> alert-small-height
alert-height-medium -> alert-medium-height
alert-height-large -> alert-medium-padding
alert-height-xlarge -> alert-large-height
alert-closable-padding -> alert-closable-start-padding
alert-margin -> alert-bottom-margin

Following theme properties removed:
alert-outline-fg
alert-active-bg
alert-height-xxsmall
alert-height-xxlarge
alert-button-padding
BREAKING CHANGE:

NbBadgeComponent status static fields removed.
STATUS_PRIMARY, STATUS_INFO, STATUS_SUCCESS, STATUS_WARNING,
STATUS_DANGER.

NbBadgeComponent position static fields replaced with NbBadgePosition type.
Removed properties: TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, BOTTOM_RIGHT,
TOP_START, TOP_END, BOTTOM_START, BOTTOM_END.

Badge status class now set on host element

NbBadgeComponent 'positionClass' getter removed.
Badge position class set on host element.
Position class names prefixed with 'position-'.

Following theme properties were renamed:
badge-fg-text -> badge-[status]-text-color
badge-primary-bg-color -> badge-primary-background-color
badge-success-bg-color -> badge-success-background-color
badge-info-bg-color -> badge-info-background-color
badge-warning-bg-color -> badge-warning-background-color
badge-danger-bg-color -> badge-danger-background-color
BREAKING CHANGE:

Following theme properties were renamed:
tree-grid-header-bg -> tree-grid-header-background
tree-grid-footer-bg -> tree-grid-footer-background
tree-grid-row-bg -> tree-grid-row-background
tree-grid-row-bg-even -> tree-grid-row-even-background
tree-grid-row-hover-bg -> tree-grid-row-hover-background

Following theme properties were removed:
tree-grid-sort-header-button-font-weight
tree-grid-sort-header-button-color
tree-grid-icon-color
BREAKING CHANGE:

Arrow selector and element changed to svg icon.

NbSelectComponent 'isOpened' getter renamed to 'isOpen'.

NbOptionComponent and NbOptionGroupComponent 'disabledClass' getter
renamed to 'disabledAttribute'.

Following theme properties were renamed:
select-border-width -> select-[appearance]-border-width
select-max-height -> select-options-list-max-height
select-bg -> select-[appearance]-background-color
select-option-disabled-bg -> select-option-[appearance]-disabled-background-color
select-option-padding -> select-option-[appearance]-[size]-padding

Following theme properties removed:
select-checkmark-color
select-checkbox-color
select-option-disabled-opacity
BREAKING CHANGE:

NbChatComponent 'accent' field removed.

NbChatComponent sizes 'xxsmall' and 'xxlarge' removed.
'xsmall' size changed to 'tiny', 'xlarge' changed to 'giant'.
Size class changed to 'size-[size-name]'.
All size static fields removed (SIZE_XXSMALL, SIZE_XSMALL, SIZE_SMALL,
SIZE_MEDIUM, SIZE_LARGE, SIZE_XLARGE, SIZE_XXLARGE).

NbChatComponent 'active' status removed.

Disabled status removed. Use disabled input instead.

Status class names changed to 'status-[status-name]'.

NbChatMessageComponent 'replyValue' changed to 'reply'.

Following theme properties removed:

chat-font-size -> chat-text-font-size
chat-fg -> chat-text-color
chat-bg -> chat-background-color
chat-height-xsmall -> chat-tiny-height
chat-height-small -> chat-small-height
chat-height-medium -> chat-medium-height
chat-height-large -> chat-large-height
chat-height-xlarge -> chat-giant-height
chat-separator -> chat-divider-color
chat-message-fg -> chat-message-text-color
chat-message-bg -> chat-message-background
chat-message-reply-bg -> chat-message-reply-background-color
chat-message-reply-fg -> chat-message-reply-text-color
chat-message-avatar-bg -> chat-message-avatar-background-color
chat-message-sender-fg -> chat-message-sender-text-color
chat-message-quote-fg -> chat-message-quote-background-color
chat-message-quote-bg -> chat-message-quote-text-color
chat-message-file-fg -> chat-message-file-text-color
chat-message-file-bg -> chat-message-file-background-color
chat-primary-bg -> chat-primary-background-color
chat-success-bg -> chat-success-background-color
chat-info-bg -> chat-info-background-color
chat-warning-bg -> chat-warning-background-color
chat-danger-bg -> chat-danger-background-color

Following theme properties removed:

chat-fg-text
chat-height-xxsmall
chat-height-xxlarge
chat-form-bg
chat-form-fg
chat-form-border
chat-form-placeholder-fg
chat-form-active-border
chat-disabled-bg
chat-disabled-fg
chat-active-bg
BREAKING CHANGE:

NbToastStatus enum removed. Toastr now uses common NbComponentstatus type.

NbToastComponent status class names changed to 'status-[status-name]'.
'default' class removed.

Following theme properties were renamed:
toastr-bg -> toastr-background
toastr-fg -> toastr-text-color
toastr-border -> toastr-border-style, toastr-border-width

'toastr-icon-radius' removed.
BREAKING CHANGE:

Following theme properties renamed:
search-bg -> search-background-color
search-bg-secondary -> search-extra-background-color
search-text -> search-text-color
search-info -> search-info-text-color
search-dash -> search-divider-color
search-placeholder -> search-placeholder-text-color

Following theme properties removed:
search-btn-open-fg
search-btn-close-fg
BREAKING CHANGE:

Removed inverse mode.

NbMenuComponent 'autoCollapseValue' property changed to 'autoCollapse'.

Following theme variables were removed:
menu-font-family -> menu-text-font-family
menu-font-size -> menu-text-font-size
menu-font-weight -> menu-text-font-weight
menu-fg -> menu-text-color
menu-bg -> menu-background-color
menu-active-fg -> menu-item-active-text-color
menu-active-bg -> menu-item-active-background-color
menu-submenu-bg -> menu-submenu-background-color
menu-submenu-fg -> menu-submenu-text-color
menu-submenu-active-fg -> menu-submenu-item-active-text-color
menu-submenu-active-bg -> menu-submenu-item-active-background-color
menu-submenu-active-border-color -> menu-submenu-item-active-border-color
menu-submenu-hover-fg -> menu-item-hover-text-color
menu-submenu-hover-bg -> menu-item-hover-background-color
menu-group-fg -> menu-group-text-color
menu-item-separator -> menu-item-divider-color
menu-icon-font-size -> menu-item-icon-width
menu-icon-margin -> menu-item-icon-margin
menu-icon-color -> menu-item-icon-color
menu-icon-active-color -> menu-item-icon-active-color

Following theme properties were removed:
menu-submenu-active-shadow
menu-active-font-weight
menu-submenu-item-container-padding
menu-group-font-weight
menu-group-font-size
menu-group-padding
BREAKING CHANGE:

'context-menu-border' split into 'context-menu-border-color',
'context-menu-border-style' and 'context-menu-border-width'.

Following theme properties were removed:
context-menu-fg
context-menu-bg
context-menu-active-fg
context-menu-active-bg
context-menu-arrow-size
BREAKING CHANGE:

'alert', 'alert-success', 'alert-info', 'alert-warning', 'alert-danger',
'alert-primary', 'alert-hint', 'font-secondary', 'font-main',
'font-w-light', 'font-w-regular', 'font-w-bold', 'text-primary',
'text-warning', 'text-success', 'text-info', 'text-danger',
'text-heading', 'text-body', 'text-hint', 'text-white', 'bg-primary',
'bg-warning', 'bg-success', 'bg-info', 'bg-danger', 'bg-heading',
'bg-body', 'bg-hint', 'bg-white', 'text-indent', 'blockquote',
'blockquote-reverse', 'blockquote-footer', 'small', 'mark'.
@codecov
Copy link

codecov bot commented Apr 29, 2019

Codecov Report

Merging #1437 into master will increase coverage by 0.72%.
The diff coverage is 86.19%.

@@            Coverage Diff             @@
##           master    #1437      +/-   ##
==========================================
+ Coverage   81.84%   82.57%   +0.72%     
==========================================
  Files         232      240       +8     
  Lines        7067     7327     +260     
  Branches      601      656      +55     
==========================================
+ Hits         5784     6050     +266     
+ Misses       1104     1088      -16     
- Partials      179      189      +10
Impacted Files Coverage Δ
...me/components/calendar/calendar-range.component.ts 87.5% <ø> (ø) ⬆️
...work/theme/components/tooltip/tooltip.component.ts 100% <ø> (ø) ⬆️
src/framework/theme/components/toastr/model.ts 100% <ø> (ø) ⬆️
...mework/theme/components/layout/layout.component.ts 75.7% <ø> (ø) ⬆️
.../components/context-menu/context-menu.component.ts 100% <ø> (ø) ⬆️
...e/components/tree-grid/tree-grid-sort.component.ts 55% <ø> (ø) ⬆️
...ork/theme/components/tree-grid/tree-grid.module.ts 100% <ø> (ø) ⬆️
...ramework/theme/components/toastr/toastr.service.ts 72.16% <ø> (-0.29%) ⬇️
.../components/context-menu/context-menu.directive.ts 89.13% <ø> (ø) ⬆️
.../components/route-tabset/route-tabset.component.ts 83.33% <ø> (ø) ⬆️
... and 93 more

@yggg yggg merged commit 7b70e3a into master Apr 29, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Remove scss functions from Nebular Support CSS Variables
4 participants