polaris_view_helpers 0.0.3 → 0.0.4

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Scrollable.scss

@@ -0,0 +1,28 @@
+$shadow-color: rgba(color(black), 0.1);
+$shadow-size: rem(20px);
+$shadow-bottom: inset 0 (-1 * $shadow-size) $shadow-size (-1 * $shadow-size) $shadow-color;
+$shadow-top: inset 0 $shadow-size $shadow-size (-1 * $shadow-size) $shadow-color;
+
+.Polaris-Scrollable {
+  -webkit-overflow-scrolling: touch;
+}
+
+.Polaris-Scrollable--horizontal {
+  overflow-x: auto;
+}
+
+.Polaris-Scrollable--vertical {
+  overflow-y: auto;
+}
+
+.Polaris-Scrollable--hasTopShadow {
+  box-shadow: $shadow-top;
+}
+
+.Polaris-Scrollable--hasBottomShadow {
+  box-shadow: $shadow-bottom;
+}
+
+.Polaris-Scrollable--hasTopShadow.Polaris-Scrollable--hasBottomShadow {
+  box-shadow: $shadow-top, $shadow-bottom;
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Select.scss

@@ -0,0 +1,103 @@
+$stacking-order: (
+  backdrop: 10,
+  input: 20,
+  icon: 30
+);
+
+$icon-size: rem(16px);
+$input-horizontal-padding: spacing(tight) * 1.5;
+
+// Without a small amount of vertical adjustment, the text
+// in the Select does not appear vertically centered.
+$input-vertical-adjust: rem(1px);
+
+.Polaris-Select {
+  position: relative;
+
+  // IE 11 fix to remove default dropdown arrow
+  select::-ms-expand {
+    display: none;
+  }
+}
+
+.Polaris-Select--disabled {
+  .Polaris-Select__Backdrop {
+    @include control-backdrop(disabled);
+  }
+
+  .Polaris-Select__Icon {
+    opacity: 0.4;
+  }
+}
+
+.Polaris-Select--error {
+  .Polaris-Select__Backdrop {
+    @include control-backdrop(error);
+  }
+
+  // Need to override the higher specificity of the sibling selector
+  // so that errors still have red borders.
+  // stylelint-disable-next-line selector-max-specificity
+  .Polaris-Select__Input:focus ~ .Polaris-Select__Backdrop {
+    @include control-backdrop(focused-error);
+  }
+}
+
+.Polaris-Select--placeholder {
+  .Polaris-Select__Input {
+    color: color(ink, lightest);
+  }
+
+  &.Polaris-Select--error .Polaris-Select__Input {
+    // This is the only place this color is used.
+    // stylelint-disable-next-line color-no-hex
+    color: #9c9798;
+  }
+}
+
+.Polaris-Select__Backdrop {
+  @include control-backdrop;
+  position: absolute;
+  z-index: z-index(backdrop, $stacking-order);
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.Polaris-Select__Icon {
+  @include recolor-icon(color(ink, lighter));
+  position: absolute;
+  z-index: z-index(icon, $stacking-order);
+  top: 50%;
+  right: $input-horizontal-padding;
+  transform: translateY(-50%);
+  margin-right: (-0.25 * $icon-size);
+  pointer-events: none;
+}
+
+.Polaris-Select__Input {
+  @include text-style-input;
+  position: relative;
+  z-index: z-index(input, $stacking-order);
+  width: 100%;
+  min-height: control-height();
+  margin: 0;
+  padding: control-vertical-padding() ($input-horizontal-padding + $icon-size) control-vertical-padding() $input-horizontal-padding;
+  background: transparent;
+  border: border(transparent);
+  appearance: none;
+  line-height: rem(20px);
+
+  &:focus {
+    outline: none;
+
+    ~ .Polaris-Select__Backdrop {
+      @include control-backdrop(focused);
+    }
+  }
+
+  &:disabled {
+    color: color(ink, lightest);
+  }
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/SettingAction.scss

@@ -0,0 +1,22 @@
+$feature-width: rem(350px);
+
+.Polaris-SettingAction {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  margin-top: -1 * spacing();
+  margin-left: -1 * spacing();
+}
+
+.Polaris-SettingAction__Setting,
+.Polaris-SettingAction__Action {
+  flex: 0 0 auto;
+  margin-top: spacing();
+  margin-left: spacing();
+  max-width: calc(100% - #{spacing()});
+  min-width: 0;
+}
+
+.Polaris-SettingAction__Setting {
+  flex: 1 0 $feature-width;
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Stack.scss

@@ -0,0 +1,98 @@
+/// Adjusts the spacing for the stack and contained items.
+/// @param {String} $spacing - The spacing variant to use.
+
+@mixin stack-spacing($spacing: base) {
+  margin-top: -1 * spacing($spacing);
+  margin-left: -1 * spacing($spacing);
+
+  > .Polaris-Stack__Item {
+    margin-top: spacing($spacing);
+    margin-left: spacing($spacing);
+    max-width: calc(100% - #{spacing($spacing)});
+  }
+}
+
+.Polaris-Stack {
+  @include stack-spacing;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+}
+
+.Polaris-Stack--vertical {
+  flex-direction: column;
+}
+
+.Polaris-Stack--spacingNone {
+  @include stack-spacing(none);
+}
+
+.Polaris-Stack--spacingTight {
+  @include stack-spacing(tight);
+}
+
+.Polaris-Stack--spacingLoose {
+  @include stack-spacing(loose);
+}
+
+.Polaris-Stack--spacingExtraLoose {
+  @include stack-spacing(extra-loose);
+}
+
+.Polaris-Stack--distributionLeading {
+  justify-content: flex-start;
+}
+
+.Polaris-Stack--distributionTrailing {
+  justify-content: flex-end;
+}
+
+.Polaris-Stack--distributionCenter {
+  justify-content: center;
+}
+
+.Polaris-Stack--distributionEqualSpacing {
+  justify-content: space-between;
+}
+
+.Polaris-Stack--distributionFill > .Polaris-Stack__Item {
+  flex: 1 1 auto;
+}
+
+.Polaris-Stack--distributionFillEvenly > .Polaris-Stack__Item {
+  flex: 1 1 auto;
+
+  @supports (min-width: fit-content) {
+    flex: 1 0 0%;
+    min-width: fit-content;
+  }
+}
+
+.Polaris-Stack--alignmentLeading {
+  align-items: flex-start;
+}
+
+.Polaris-Stack--alignmentTrailing {
+  align-items: flex-end;
+}
+
+.Polaris-Stack--alignmentCenter {
+  align-items: center;
+}
+
+.Polaris-Stack--alignmentFill {
+  align-items: stretch;
+}
+
+.Polaris-Stack--alignmentBaseline {
+  align-items: baseline;
+}
+
+.Polaris-Stack__Item {
+  flex: 0 0 auto;
+  min-width: 0;
+}
+
+.Polaris-Stack__Item--fill {
+  flex: 1 1 auto;
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Subheading.scss

@@ -0,0 +1,4 @@
+.Polaris-Subheading {
+  @include text-style-subheading;
+  margin: 0;
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Tabs.scss

@@ -0,0 +1,150 @@
+$border-bottom-height: rem(3px);
+$item-min-height: rem(16px);
+$item-vertical-padding: $item-min-height / 2;
+$focus-state-box-shadow-color: rgba(92, 106, 196, 0.8);
+
+.Polaris-Tabs {
+  display: flex;
+  margin: 0;
+  padding: 0;
+  border-bottom: border();
+  list-style: none;
+}
+
+.Polaris-Tabs--fitted {
+  .Polaris-Tabs__TabContainer {
+    flex: 1 1 auto;
+  }
+
+  .Polaris-Tabs__Tab {
+    padding: 0;
+  }
+
+  .Polaris-Tabs__Title {
+    width: 100%;
+    padding: spacing(tight) spacing();
+  }
+}
+
+.Polaris-Tabs--fillSpace {
+  .Polaris-Tabs__TabContainer {
+    flex: 1 1 auto;
+  }
+}
+
+.Polaris-Tabs__TabContainer {
+  display: flex;
+  margin: 0;
+  padding: 0;
+}
+
+.Polaris-Tabs__Tab {
+  @include unstyled-link;
+  @include unstyled-button;
+  @include text-style-body;
+  @include text-emphasis-subdued;
+  position: relative;
+  justify-content: center;
+  width: 100%;
+  min-width: 100%; // IE11 fix for overflowing flex items from parent container
+  margin-top: 1px;
+  margin-bottom: -1px;
+  padding: 0 spacing();
+  outline: none;
+  text-align: center;
+  white-space: nowrap;
+  text-decoration: none;
+  cursor: pointer;
+
+  &:hover {
+    .Polaris-Tabs__Title {
+      @include text-emphasis-normal;
+      border-bottom: $border-bottom-height solid color(sky);
+    }
+  }
+
+  &:focus {
+    box-shadow: inset 0 0 2px 0 $focus-state-box-shadow-color, 0 0 2px 0 $focus-state-box-shadow-color;
+
+    .Polaris-Tabs__Title {
+      @include text-emphasis-normal;
+      border-bottom: $border-bottom-height solid color(indigo, light);
+    }
+  }
+
+  &:visited {
+    color: color(ink, lighter);
+  }
+
+  &.Polaris-Tabs__Tab--selected {
+    .Polaris-Tabs__Title {
+      border-bottom: $border-bottom-height solid color(indigo);
+    }
+  }
+}
+
+.Polaris-Tabs__Tab--selected {
+  @include text-emphasis-normal;
+}
+
+.Polaris-Tabs__Title {
+  display: block;
+  padding: spacing(tight) 0 (spacing(tight) - $border-bottom-height) 0;
+  border-bottom: $border-bottom-height solid transparent;
+}
+
+.Polaris-Tabs__Panel {
+  display: block;
+}
+
+.Polaris-Tabs__List {
+  list-style: none;
+  margin: 0;
+  padding: spacing(tight) 0;
+}
+
+.Polaris-Tabs__Item {
+  @include unstyled-link;
+  @include unstyled-button;
+  display: block;
+  width: 100%;
+  min-height: $item-min-height;
+  padding: $item-vertical-padding spacing();
+  cursor: pointer;
+
+  &:hover,
+  &:focus,
+  &:active {
+    background: color(indigo);
+    outline: none;
+    color: color(white);
+  }
+}
+
+.Polaris-Tabs__DisclosureTab {
+  display: none;
+  padding-top: (0.625 * spacing());
+}
+
+.Polaris-Tabs__DisclosureTab--visible {
+  display: block;
+}
+
+.Polaris-Tabs__DisclosureActivator {
+  @include recolor-icon(color(ink, lighter));
+  position: relative;
+  justify-content: center;
+  height: 100%;
+  padding: 0 spacing();
+  background-color: transparent;
+  cursor: pointer;
+  border: none;
+  outline: none;
+  text-align: center;
+}
+
+.Polaris-Tabs__TabMeasurer {
+  display: flex;
+  visibility: hidden;
+  height: 0;
+}

data/vendor/assets/stylesheets/shopify-polaris-1.0.3/styles/components/Tag.scss

@@ -0,0 +1,37 @@
+$height: rem(28px);
+$icon-size: rem(16px);
+
+.Polaris-Tag {
+  display: inline-flex;
+  overflow: hidden;
+  align-items: center;
+  min-height: $height;
+  padding-left: spacing(tight);
+  background-color: color(sky);
+  border-radius: border-radius();
+  color: color(ink);
+}
+
+.Polaris-Tag__Button {
+  @include recolor-icon(color(ink, lighter));
+  @include unstyled-button;
+  display: block;
+  height: $height;
+  width: $height;
+  margin-left: spacing(extra-tight);
+  will-change: background, fill;
+  transition-property: background, fill;
+  transition-duration: duration();
+  transition-timing-function: easing();
+
+  &:hover,
+  &:focus,
+  &:active {
+    @include recolor-icon(color(ink));
+    background: color(sky, dark);
+  }
+
+  &:active {
+    background: rgba(color(ink, lightest), 0.6);
+  }
+}