md2/colorpicker/colorpicker.css.map

Angular2 based Material Design components, directives and services are Accordion, Autocomplete, Chips(Tags), Collapse, Colorpicker, Data Table, Datepicker, Dialog(Modal), Menu, Multiselect, Select, Tabs, Tags(Chips), Toast and Tooltip.

{"version":3,"sources":["colorpicker/colorpicker.scss","colorpicker/colorpicker.css"],"names":[],"mappings":"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","file":"colorpicker.css","sourcesContent":["$black: black;\n$primary: #106cc8 !default;\n$warn: #f44336 !default;\n\n.md2-colorpicker-wrapper {\n  border-radius: 3px;\n  background-color: #fff;\n  z-index: 10;\n  box-shadow: 0 2px 6px rgba($black, 0.4);\n  overflow: hidden;\n}\n\n.md2-colorpicker-panel {\n  outline: 0;\n  box-shadow: 0 5px 5px -3px rgba(black, 0.2), 0 8px 10px 1px rgba(black, 0.14), 0 3px 14px 2px rgba(black, 0.12);\n\n  &[container='dialog'] {\n    box-shadow: 0 11px 15px -7px rgba(black, 0.2), 0 24px 38px 3px rgba(black, 0.14), 0 9px 46px 8px rgba(black, 0.12);\n  }\n}\n\n.md2-colorpicker-disabled {\n  pointer-events: none;\n  cursor: default;\n\n  .color-picker-selector .md2-colorpicker-value {\n    color: rgba(0, 0, 0, 0.38);\n    border-color: transparent;\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.38) 0%, rgba(0, 0, 0, 0.38) 33%, transparent 0%);\n    background-position: bottom -1px left 0;\n    background-size: 4px 1px;\n    background-repeat: repeat-x;\n  }\n}\n\n.md2-colorpicker-input {\n  color: rgba(black, 0.38);\n  border-bottom: 1px solid rgba(black, 0.12);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  height: 30px;\n  min-width: 180px;\n  line-height: 22px;\n  position: relative;\n  box-sizing: border-box;\n\n  [aria-disabled='true'] & {\n    background-image: linear-gradient(to right, rgba(black, 0.26) 0, rgba(black, 0.26) 33%, transparent 0);\n    background-size: 4px 1px;\n    background-repeat: repeat-x;\n    border-color: transparent;\n    background-position: 0 bottom;\n    cursor: default;\n  }\n\n  md2-colorpicker:focus:not(.md2-colorpicker-disabled) & {\n    color: $primary;\n    border-color: $primary;\n  }\n\n  md2-colorpicker.ng-invalid.ng-touched:not(.md2-colorpicker-disabled) & {\n    color: $warn;\n    border-color: $warn;\n  }\n}\n\n.input-focused {\n  color: $primary;\n  border-color: $primary;\n}\n\n.inline-control {\n  width: 150px;\n  margin-right: 16px;\n  padding: 16px 0;\n}\n\n.md2-colorpicker-placeholder {\n  position: absolute;\n  right: 18px;\n  bottom: 100%;\n  left: 0;\n  padding: 0 2px;\n  transform: translate3d(0, 26px, 0) scale(1);\n  transform-origin: left top;\n  white-space: nowrap;\n  overflow-x: hidden;\n  text-overflow: ellipsis;\n  transition: all 150ms cubic-bezier(0.25, 0.8, 0.25, 1);\n\n  [aria-required=true] &::after {\n    content: '*';\n    color: #fd0f0f;\n  }\n}\n\n.md2-colorpicker-input.input-focused .md2-colorpicker-placeholder {\n  color: $primary;\n}\n\n.md2-colorpicker-input.input-focused .md2-colorpicker-placeholder,\nmd2-colorpicker .md2-colorpicker-placeholder.has-value {\n  transform: translate3d(0, 6px, 0) scale(0.75);\n}\n\n.color-error {\n  .md2-colorpicker-input, .md2-colorpicker-placeholder {\n    color: $warn !important;\n    border-color: $warn;\n  }\n\n  .color-fill {\n    background-color: transparent !important;\n  }\n}\n\n.color-picker-selector {\n  display: block;\n  padding: 18px 0 4px 46px;\n  white-space: nowrap;\n\n  .md2-colorpicker-preview {\n    position: absolute;\n    top: 19px;\n    left: 6px;\n    content: '';\n    width: 24px;\n    height: 24px;\n    overflow: hidden;\n    background-color: #fff;\n    background: linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd), linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd);\n    background-size: 8px 8px;\n    background-position: 0 0, 4px 4px;\n    border: 2px solid #fafafa;\n    display: block;\n    fill: #5a5a5a;\n    cursor: pointer;\n    border-radius: 50%;\n    vertical-align: middle;\n    box-shadow: 0 1px 1px 0 rgba($black, 0.2), 0 1px 1px 1px rgba($black, 0.14), 0 1px 1px 1px rgba($black, 0.12);\n\n    .color-fill {\n      width: 100%;\n      height: 100%;\n    }\n  }\n\n  .md2-colorpicker-value {\n    font-size: 15px;\n    background: transparent;\n    border: 0;\n    outline: none;\n    position: relative;\n    display: block;\n    min-width: 160px;\n    height: 30px;\n    padding: 2px 2px 1px;\n    margin: 0;\n    line-height: 26px;\n    color: rgba(0, 0, 0, 0.87);\n    vertical-align: middle;\n    box-sizing: border-box;\n  }\n}\n\nmd2-colorpicker {\n  position: relative;\n  display: block;\n  outline: none;\n}\n\n.md2-color-picker {\n  position: relative;\n  display: block;\n  width: 266px;\n  outline: none;\n\n  * {\n    box-sizing: border-box;\n  }\n\n  .input-color-content {\n    position: relative;\n    padding: 8px;\n  }\n\n  i {\n    cursor: default;\n    position: relative;\n  }\n\n  input {\n    font-size: 16px;\n    height: 50px;\n    outline: none;\n  }\n\n  div.cursor-sv {\n    cursor: default;\n    position: relative;\n    border-radius: 50%;\n    width: 15px;\n    height: 15px;\n    border: #ddd solid 1px;\n  }\n\n  div.cursor {\n    cursor: crosshair;\n    position: relative;\n    border-radius: 50%;\n    width: 13px;\n    height: 13px;\n    box-shadow: 0 0 2px 0 rgba($black, 0.5), inset 0 0 2px 0 rgba($black, 0.5);\n    border: 2px solid #fff;\n  }\n\n  div.color-picker-marker {\n    cursor: crosshair;\n    position: relative;\n    border: 2px solid #fff;\n    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.5);\n    height: 100%;\n    width: 5px;\n    border-bottom: 0;\n    border-top: 0;\n  }\n\n  .saturation-lightness {\n    width: 100%;\n    height: 130px;\n    border-radius: 2px;\n    overflow: hidden;\n    background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0)), linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\n  }\n\n  .saturation-lightness:hover {\n    cursor: crosshair;\n  }\n\n  .hue {\n    position: relative;\n    width: 100%;\n    height: 30px;\n    margin: 8px 0;\n    border-radius: 2px;\n    background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);\n  }\n\n  .alpha {\n    position: relative;\n    width: 100%;\n    height: 30px;\n    border-radius: 2px;\n    background: linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd), linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd);\n    background-size: 8px 8px;\n    background-position: 0 0, 4px 4px;\n\n    .alpha-main {\n      position: absolute;\n      height: 100%;\n      opacity: 1;\n      background-image: linear-gradient(to left, transparent, transparent), linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\n      width: 100%;\n    }\n  }\n\n  .selected-color {\n    position: relative;\n    width: 100%;\n    height: 75px;\n    background-color: #fff;\n    background: linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd), linear-gradient(45deg, #ddd 25%, transparent 0, transparent 75%, #ddd 0, #ddd);\n    background-size: 8px 8px;\n    background-position: 0 0, 4px 4px;\n\n    .selected-color-bg {\n      position: absolute;\n      height: 100%;\n      opacity: 1;\n      width: 100%;\n    }\n\n    .color-bar {\n      position: absolute;\n      width: 100%;\n      bottom: 0;\n    }\n\n    .color-input {\n      position: relative;\n    }\n  }\n}\n\n.color-clear {\n  color: rgba(black, 0.4);\n  cursor: pointer;\n\n  svg {\n    vertical-align: bottom;\n    fill: #686868;\n  }\n}\n\n.clearfix {\n  &::before,\n  &::after {\n    content: ' ';\n    display: table;\n  }\n\n  &::after {\n    clear: both;\n  }\n}\n\n.hex-text {\n  width: 100%;\n\n  input {\n    width: 100%;\n    border: 0;\n    padding: 4px;\n    text-align: center;\n    background: transparent;\n  }\n\n  div {\n    text-align: center;\n    float: left;\n    clear: left;\n    width: 160px;\n    margin-top: 4px;\n  }\n}\n\n.hsla-text,\n.rgba-text {\n  text-align: center;\n}\n\n.hsla-text input,\n.rgba-text input {\n  width: 50px;\n  border: 0;\n  padding: 4px 0;\n  background: transparent;\n  text-align: center;\n}\n\n.hsla-text div,\n.rgba-text div {\n  text-align: center;\n  display: block;\n}\n\n.hsla-text label,\n.rgba-text label {\n  text-align: center;\n  display: inline-block;\n  font-size: 15px;\n}\n\n.md2-color-picker-actions {\n  text-align: right;\n\n  .md2-button {\n    display: inline-block;\n    min-width: 64px;\n    margin: 4px 8px 8px 0;\n    padding: 0 12px;\n    font-size: 14px;\n    color: $primary;\n    line-height: 36px;\n    text-align: center;\n    text-transform: uppercase;\n    border-radius: 2px;\n    cursor: pointer;\n    box-sizing: border-box;\n    transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1);\n\n    &:hover {\n      background: darken(white, 8);\n    }\n  }\n}\n\n.hsla-text div:nth-child(5),\n.rgba-text div:nth-child(5) {\n  clear: left;\n}\n\n.type-policy {\n  width: 33.333333%;\n  text-align: center;\n  font-size: 14px;\n  display: inline-block;\n  float: left;\n  padding: 4px 8px 3px;\n  border-bottom: 2px solid transparent;\n  cursor: pointer;\n  background: rgba(white, 0.25);\n\n  .dark & {\n    background: rgba(black, 0.25);\n  }\n\n  &.active {\n    border-color: rgba(white, 0.5);\n    background: transparent;\n\n    .dark & {\n      border-color: rgba(black, 0.5);\n    }\n  }\n}\n\n\n.cdk-overlay-container, .cdk-global-overlay-wrapper {\n  pointer-events: none;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n\n.cdk-overlay-container {\n  position: fixed;\n  z-index: 999;\n}\n\n.cdk-global-overlay-wrapper {\n  display: flex;\n  position: absolute;\n  z-index: 999;\n}\n\n.cdk-overlay-pane {\n  position: absolute;\n  pointer-events: auto;\n  box-sizing: border-box;\n  z-index: 999;\n}\n\n.cdk-overlay-backdrop {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 999;\n  pointer-events: auto;\n  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n  opacity: 0;\n}\n\n.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n  opacity: 0.48;\n}\n\n.cdk-overlay-dark-backdrop {\n  background: rgba(black, 0.6);\n}\n",null]}