flipper-ui 0.2.0.beta2 → 0.2.0.beta3

data/lib/flipper/ui/assets/stylesheets/primer/.scss-lint.yml

@@ -0,0 +1,446 @@
+# This is the lint file for .scss files. It uses https://github.com/causes/scss-lint
+# to search through .scss files and point out errors.
+# You can view these errors in your editor.
+#
+# Here's a link to all the default configurations
+# https://github.com/causes/scss-lint/blob/master/config/default.yml
+# below is our settings.
+
+linters:
+  BangFormat:
+    enabled: true
+    space_before_bang: true
+    space_after_bang: false
+
+  BorderZero:
+    enabled: true
+    convention: zero # or `none`
+
+  ColorKeyword:
+    enabled: true
+
+  ColorVariable:
+    enabled: false
+
+  Comment:
+    enabled: false
+
+  DebugStatement:
+    enabled: true
+
+  DeclarationOrder:
+    enabled: true
+
+  DuplicateProperty:
+    enabled: true
+
+  ElsePlacement:
+    enabled: true
+    style: same_line # or 'new_line'
+
+  EmptyLineBetweenBlocks:
+    enabled: true
+    ignore_single_line_blocks: true
+
+  EmptyRule:
+    enabled: false
+
+  FinalNewline:
+    enabled: true
+    present: true
+
+  HexLength:
+    enabled: true
+    style: short # or 'long'
+
+  HexNotation:
+    enabled: true
+    style: lowercase # or 'uppercase'
+
+  HexValidation:
+    enabled: true
+
+  IdSelector:
+    enabled: true
+
+  ImportantRule:
+    enabled: true
+
+  ImportPath:
+    enabled: true
+    leading_underscore: false
+    filename_extension: false
+
+  Indentation:
+    enabled: true
+    allow_non_nested_indentation: false
+    character: space # or 'tab'
+    width: 2
+
+  LeadingZero:
+    enabled: true
+    style: include_zero
+
+  MergeableSelector:
+    enabled: true
+    force_nesting: true
+
+  NameFormat:
+    enabled: false
+    convention: hyphenated_lowercase # or 'BEM', or a regex pattern
+
+  NestingDepth:
+    enabled: false
+    max_depth: 3
+
+  PlaceholderInExtend:
+    enabled: false
+
+  PropertySortOrder:
+    enabled: false
+    ignore_unspecified: true
+    severity: warning
+    order: [
+      "position",
+      "top",
+      "right",
+      "bottom",
+      "left",
+      "z-index",
+      "display",
+      "float",
+      "width",
+      "min-width",
+      "max-width",
+      "height",
+      "min-height",
+      "max-height",
+      "-webkit-box-sizing",
+      "box-sizing",
+      "-webkit-appearance",
+      "padding",
+      "padding-top",
+      "padding-right",
+      "padding-bottom",
+      "padding-left",
+      "margin",
+      "margin-top",
+      "margin-right",
+      "margin-bottom",
+      "margin-left",
+      "overflow",
+      "overflow-x",
+      "overflow-y",
+      "-webkit-overflow-scrolling",
+      "-ms-overflow-x",
+      "-ms-overflow-y",
+      "-ms-overflow-style",
+      "clip",
+      "clear",
+      "font",
+      "font-family",
+      "font-size",
+      "font-style",
+      "font-weight",
+      "font-variant",
+      "font-size-adjust",
+      "font-stretch",
+      "font-effect",
+      "font-emphasize",
+      "font-emphasize-position",
+      "font-emphasize-style",
+      "font-smooth",
+      "-webkit-hyphens",
+      "-moz-hyphens",
+      "hyphens",
+      "line-height",
+      "color",
+      "text-align",
+      "-webkit-text-align-last",
+      "-moz-text-align-last",
+      "-ms-text-align-last",
+      "text-align-last",
+      "text-emphasis",
+      "text-emphasis-color",
+      "text-emphasis-style",
+      "text-emphasis-position",
+      "text-decoration",
+      "text-indent",
+      "text-justify",
+      "text-outline",
+      "-ms-text-overflow",
+      "text-overflow",
+      "text-overflow-ellipsis",
+      "text-overflow-mode",
+      "text-shadow",
+      "text-transform",
+      "text-wrap",
+      "-webkit-text-size-adjust",
+      "-ms-text-size-adjust",
+      "letter-spacing",
+      "-ms-word-break",
+      "word-break",
+      "word-spacing",
+      "-ms-word-wrap",
+      "word-wrap",
+      "-moz-tab-size",
+      "-o-tab-size",
+      "tab-size",
+      "white-space",
+      "vertical-align",
+      "list-style",
+      "list-style-position",
+      "list-style-type",
+      "list-style-image",
+      "pointer-events",
+      "fill",
+      "fill-opacity",
+      "stroke",
+      "stroke-opacity",
+      "stroke-width",
+      "shape-rendering",
+      "cursor",
+      "visibility",
+      "zoom",
+      "flex-direction",
+      "flex-order",
+      "flex-pack",
+      "flex-align",
+      "table-layout",
+      "empty-cells",
+      "caption-side",
+      "border-spacing",
+      "border-collapse",
+      "content",
+      "quotes",
+      "counter-reset",
+      "counter-increment",
+      "resize",
+      "-webkit-touch-callout",
+      "-webkit-user-select",
+      "-moz-user-select",
+      "-ms-user-select",
+      "-o-user-select",
+      "user-select",
+      "nav-index",
+      "nav-up",
+      "nav-right",
+      "nav-down",
+      "nav-left",
+      "background",
+      "background-color",
+      "background-image",
+      "-ms-filter:\\'progid:DXImageTransform.Microsoft.gradient",
+      "filter:progid:DXImageTransform.Microsoft.gradient",
+      "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader",
+      "filter",
+      "background-repeat",
+      "background-attachment",
+      "background-position",
+      "background-position-x",
+      "background-position-y",
+      "-webkit-background-clip",
+      "-moz-background-clip",
+      "background-clip",
+      "background-origin",
+      "-webkit-background-size",
+      "-moz-background-size",
+      "-o-background-size",
+      "background-size",
+      "border",
+      "border-color",
+      "border-style",
+      "border-width",
+      "border-top",
+      "border-top-color",
+      "border-top-style",
+      "border-top-width",
+      "border-right",
+      "border-right-color",
+      "border-right-style",
+      "border-right-width",
+      "border-bottom",
+      "border-bottom-color",
+      "border-bottom-style",
+      "border-bottom-width",
+      "border-left",
+      "border-left-color",
+      "border-left-style",
+      "border-left-width",
+      "border-radius",
+      "border-top-left-radius",
+      "border-top-right-radius",
+      "border-bottom-right-radius",
+      "border-bottom-left-radius",
+      "-webkit-border-image",
+      "-moz-border-image",
+      "-o-border-image",
+      "border-image",
+      "-webkit-border-image-source",
+      "-moz-border-image-source",
+      "-o-border-image-source",
+      "border-image-source",
+      "-webkit-border-image-slice",
+      "-moz-border-image-slice",
+      "-o-border-image-slice",
+      "border-image-slice",
+      "-webkit-border-image-width",
+      "-moz-border-image-width",
+      "-o-border-image-width",
+      "border-image-width",
+      "-webkit-border-image-outset",
+      "-moz-border-image-outset",
+      "-o-border-image-outset",
+      "border-image-outset",
+      "-webkit-border-image-repeat",
+      "-moz-border-image-repeat",
+      "-o-border-image-repeat",
+      "border-image-repeat",
+      "outline",
+      "outline-width",
+      "outline-style",
+      "outline-color",
+      "outline-offset",
+      "-webkit-box-shadow",
+      "-moz-box-shadow",
+      "box-shadow",
+      "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity",
+      "-ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha",
+      "opacity",
+      "-ms-interpolation-mode",
+      "-moz-transition",
+      "-ms-transition",
+      "-o-transition",
+      "transition",
+      "-moz-transition-delay",
+      "-ms-transition-delay",
+      "-o-transition-delay",
+      "transition-delay",
+      "-moz-transition-timing-function",
+      "-ms-transition-timing-function",
+      "-o-transition-timing-function",
+      "transition-timing-function",
+      "-moz-transition-duration",
+      "-ms-transition-duration",
+      "-o-transition-duration",
+      "transition-duration",
+      "-moz-transition-property",
+      "-ms-transition-property",
+      "-o-transition-property",
+      "transition-property",
+      "-webkit-transform",
+      "-o-transform",
+      "transform",
+      "-webkit-transform-origin",
+      "-o-transform-origin",
+      "transform-origin",
+      "-ms-animation",
+      "-o-animation",
+      "animation",
+      "-ms-animation-name",
+      "-o-animation-name",
+      "animation-name",
+      "-ms-animation-duration",
+      "-o-animation-duration",
+      "animation-duration",
+      "-ms-animation-fill-mode",
+      "-o-animation-fill-mode",
+      "animation-fill-mode",
+      "-ms-animation-play-state",
+      "-o-animation-play-state",
+      "animation-play-state",
+      "-ms-animation-timing-function",
+      "-o-animation-timing-function",
+      "animation-timing-function",
+      "-ms-animation-delay",
+      "-o-animation-delay",
+      "animation-delay",
+      "-ms-animation-iteration-count",
+      "-o-animation-iteration-count",
+      "animation-iteration-count",
+      "-ms-animation-direction",
+      "-o-animation-direction",
+      "animation-direction"
+    ]
+
+  PropertySpelling:
+    enabled: true
+    extra_properties: []
+
+  QualifyingElement:
+    enabled: true
+    allow_element_with_attribute: false
+    allow_element_with_class: false
+    allow_element_with_id: false
+
+  SelectorDepth:
+    enabled: true
+    max_depth: 4
+
+  SelectorFormat:
+    enabled: false
+    convention: hyphenated_lowercase # or 'BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern
+
+  Shorthand:
+    enabled: true
+
+  SingleLinePerProperty:
+    enabled: true
+    allow_single_line_rule_sets: true
+
+  SingleLinePerSelector:
+    enabled: true
+
+  SpaceAfterComma:
+    enabled: true
+
+  SpaceAfterPropertyColon:
+    enabled: true
+    style: one_space # or 'no_space', or 'at_least_one_space', or 'aligned'
+
+  SpaceAfterPropertyName:
+    enabled: true
+
+  SpaceBeforeBrace:
+    enabled: true
+    style: space # or 'new_line'
+    allow_single_line_padding: true
+
+  SpaceBetweenParens:
+    enabled: true
+    spaces: 0
+
+  StringQuotes:
+    enabled: true
+    style: double_quotes
+
+  TrailingSemicolon:
+    enabled: true
+
+  TrailingZero:
+    enabled: false
+
+  UnnecessaryMantissa:
+    enabled: true
+
+  UnnecessaryParentReference:
+    enabled: true
+
+  UrlFormat:
+    enabled: true
+
+  UrlQuotes:
+    enabled: true
+
+  VariableForProperty:
+    enabled: false
+    properties: []
+
+  VendorPrefix:
+    enabled: true
+    identifier_list: base
+    additional_identifiers: []
+    excluded_identifiers: []
+
+  ZeroUnit:
+    enabled: true

data/lib/flipper/ui/assets/stylesheets/primer/_alerts.scss

@@ -0,0 +1,106 @@
+.flash-messages {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.flash,
+.flash-global {
+  position: relative;
+  font-size: 14px;
+  line-height: 1.6;
+  color: #246;
+  background-color: #e2eef9;
+  border: solid 1px #bac6d3;
+
+  &.flash-warn {
+    color: #4c4a42;
+    background-color: #fff9ea;
+    border-color: #dfd8c2;
+  }
+
+  &.flash-error {
+    color: #911;
+    background-color: #fcdede;
+    border-color: #d2b2b2;
+  }
+
+  .flash-close {
+    float: right;
+    padding: 17px;     // bigger hit area
+    margin-top: -15px; // negative margins to account for bigger padding
+    margin-right: -15px;
+    margin-left: 20px;
+    color: inherit;
+    text-decoration: none;
+    cursor: pointer;
+    opacity: 0.6;
+
+    &:hover {
+      opacity: 1;
+    }
+  }
+
+  p:last-child {
+    margin-bottom: 0;
+  }
+
+  // Flashes can have an action button instead of the cross.
+  .flash-action {
+    float: right;
+    margin-top: -4px;
+    margin-left: 20px;
+  }
+
+  // Make links stand out
+  a {
+    font-weight: bold;
+  }
+}
+
+.flash {
+  padding: 15px;
+  border-radius: 3px;
+
+  + .flash { margin-top: 5px; }
+}
+
+// Add an icon
+.flash-with-icon {
+  padding-left: 40px;
+
+  > .octicon {
+    float: left;
+    margin-top: 3px;
+    margin-left: -25px;
+  }
+}
+
+
+// Global notices
+//
+// Useful for site-wide banners and global notifications.
+
+.flash-global {
+  padding: 10px;
+  margin-top: -1px;
+  border-width: 1px 0;
+
+  h2,
+  p {
+    margin-top: 0;
+    margin-bottom: 0;
+    font-size: 14px;
+    line-height: 1.4;
+  }
+
+  // Global flashes can have an action buttons too.
+  .flash-action {
+    margin-top: 5px;
+  }
+}
+
+// Content within flash messages.
+.flash-title {
+  margin-top: 0;
+  margin-bottom: 5px;
+}