codeclimate-styles 0.5.0 → 0.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 04f9cf752bab5c008607196aa542295289fd6ecb
-  data.tar.gz: fbf2bae840a66fab649c99cca972905959869c58
+  metadata.gz: 26355d70d8919d153223d2ee707184672ea50174
+  data.tar.gz: aa4c8e012df09882e52f5961fec97818f5ab0f4a
 SHA512:
-  metadata.gz: eafab41382f4c1a7aec3652e746ca2ef6dd47c098bcbbdea98f74647004b53e8bcb9babf9b5e7e6d0b53aa00b64a3a7fc83c8e7292c357583c1d4e2b0a6a5109
-  data.tar.gz: 69a90ecd88f3b2473e35cf96c4bd2b26723f045f380acd08d4b0160c004352a1f68469b4961ea92bf57eec874abd10f3f4d13ff22a4f86f344543e8f11d2dbb9
+  metadata.gz: e62104213a90e67016ee526d280adef22466768a25fd97c908423996da873b93497e2ee0a7155371055c1fbde3fa7fbd15370f8fa45d1a57a44d83ab3421c3fd
+  data.tar.gz: 66d33611e3d9bb55e8d2afeccac68fb90526726807eb57e45674380e27faff411587f88a87098b4fb5762cd0c53ac87684b3df0a70f8703f620bad7dd1f32f1a

data/assets/stylesheets/cc/styles/modules/_forms.scss

@@ -66,41 +66,7 @@ form.form
     line-height: 20px;
   }
 }
-// scss-lint:enable SelectorFormat, QualifyingElement
 
-.form--search {
-  &::before {
-    @include ff-mask-image(image-url("cc/styles/icons/search_solid.svg"));
-    background: $grayscale-slate;
-    content: " ";
-    height: 39px;
-    left: 11px;
-    mask-position: center;
-    mask-repeat: no-repeat;
-    mask-size: 100% auto;
-    position: absolute;
-    width: 15px;
-
-    // Afer 01-05-2017 this can be removed & replaced with simply `mask-image`.
-    @-moz-document url-prefix() {
-      background-position: center 11px;
-    }
-  }
-
-  // scss-lint:disable QualifyingElement
-  input[type=search] {
-    padding-left: 30px;
-    width: 230px;
-
-    &:focus,
-    &:not(:placeholder-shown) {
-      width: 320px;
-    }
-  }
-  // scss-lint:enable QualifyingElement
-}
-
-// scss-lint:disable SelectorFormat, QualifyingElement
 // simple_form applies these classes to wrapper elements
 /*doc
 ---
@@ -110,7 +76,7 @@ category: forms
 ---
 
 ```slim_example
-input.input type="text" placeholder="Search for a repo..."
+input.input type="text" placeholder="Placeholder text"
 ```
 */
 
@@ -142,6 +108,51 @@ textarea.input {
   }
 }
 
+/*doc
+---
+title: Search
+name: search
+category: forms
+---
+
+```slim_example
+form.form--search
+  input.input type="search" id="search-field" placeholder="Search for a repo..."
+```
+*/
+
+.form--search {
+  position: relative;
+
+  &::before {
+    @include ff-mask-image(image-url("cc/styles/icons/search_solid.svg"));
+    background: $grayscale-slate;
+    content: " ";
+    height: 39px;
+    left: 11px;
+    mask-position: center;
+    mask-repeat: no-repeat;
+    mask-size: 100% auto;
+    position: absolute;
+    width: 15px;
+
+    // Afer 01-05-2017 this can be removed & replaced with simply `mask-image`.
+    @-moz-document url-prefix() {
+      background-position: center 11px;
+    }
+  }
+
+  input[type=search] {
+    padding-left: 30px;
+    width: 230px;
+
+    &:focus,
+    &:not(:placeholder-shown) {
+      width: 320px;
+    }
+  }
+}
+
 /*doc
 ---
 title: Checkbox
@@ -171,20 +182,10 @@ $checkbox-border-size: 2px;
   input:checked + label::before {
     background-color: $green;
     border-color: $green;
-
-    // Afer 01-05-2017 this can be removed
-    @-moz-document url-prefix() {
-      background-color: $grayscale-aluminium;
-    }
   }
 
   input:checked + label::after {
     background-color: $white;
-
-    // Afer 01-05-2017 this can be removed
-    @-moz-document url-prefix() {
-      background: image-url("cc/styles/icons/checkmark.svg") 1px 3px no-repeat transparent;
-    }
   }
 
   label {
@@ -242,6 +243,7 @@ $select-box-shadow-color: rgba(0, 0, 0, .06);
 
 select.select {
   -webkit-appearance: none;
+  -moz-appearance: none;
   background: $white;
   background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTBweCIgaGVpZ2h0PSI2cHgiIHZpZXdCb3g9IjAgMCAxMCA2IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA0MC4yICgzMzgyNikgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+R3JvdXAgMjwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSItIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0icm91bmQiPgogICAgICAgIDxnIGlkPSJJc3N1ZXMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMjQxLjAwMDAwMCwgLTQzNi4wMDAwMDApIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZT0iIzlCOUI5QiI+CiAgICAgICAgICAgIDxnIGlkPSJHcm91cC0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjQyLjAwMDAwMCwgNDM3LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPGcgaWQ9Ikdyb3VwIj4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMy41MzU1MzM5MSwzLjUzNTUzMzkxIEwwLDAiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNNCwzLjUzNTUzMzkxIEw3LjUzNTUzMzkxLDAiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
   background-position: right 10px center;
@@ -257,5 +259,104 @@ select.select {
   outline: none;
   padding: 10px 12px;
   width: 100%;
+
+  &::-moz-focus-inner {
+    border: 0;
+  }
+
+  &::-moz-focus-outer {
+    border: 0;
+  }
 }
+
+/*doc
+---
+title: Range Slider
+name: slider
+category: forms
+---
+
+```slim_example
+input type="range" min="0" max="100" value="80" step="1"
+```
+*/
+
+input[type=range] {
+  height: 20px;
+  width: 100%;
+  -webkit-appearance: none;
+
+  &:focus {
+    outline: none;
+  }
+
+  &::-moz-focus-outer {
+    border: 0;
+  }
+
+  &::-webkit-slider-thumb {
+    background-color: $green;
+    border-radius: 3px;
+    cursor: pointer;
+    height: 20px;
+    margin-top: -8px;
+    width: 20px;
+    -webkit-appearance: none;
+  }
+
+  &::-moz-range-thumb {
+    background-color: $green;
+    border: none;
+    border-radius: 3px;
+    cursor: pointer;
+    height: 20px;
+    width: 20px;
+  }
+
+  &::-ms-thumb {
+    background-color: $green;
+    border-radius: 3px;
+    cursor: pointer;
+    height: 20px;
+    width: 20px;
+  }
+
+  &::-webkit-slider-thumb {
+    margin-top: -8px;
+    -webkit-appearance: none;
+  }
+
+  &::-webkit-slider-runnable-track {
+    background-color: $box-border-color;
+    border-radius: 2px;
+    cursor: pointer;
+    height: 4px;
+  }
+
+  &::-moz-range-track {
+    background-color: $box-border-color;
+    border-radius: 2px;
+    cursor: pointer;
+    height: 4px;
+  }
+
+  &::-ms-track {
+    background: transparent;
+    border-color: transparent;
+    color: transparent;
+    cursor: pointer;
+    width: 100%;
+  }
+
+  &::-ms-fill-upper {
+    background-color: $box-border-color;
+    cursor: pointer;
+  }
+
+  &::-ms-fill-lower {
+    background-color: $box-border-color;
+    cursor: pointer;
+  }
+}
+
 // scss-lint:enable SelectorFormat, QualifyingElement

data/lib/cc/styles/version.rb

@@ -1,5 +1,5 @@
 module CC
   module Styles
-    VERSION = "0.5.0".freeze
+    VERSION = "0.6.0".freeze
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: codeclimate-styles
 version: !ruby/object:Gem::Version
-  version: 0.5.0
+  version: 0.6.0
 platform: ruby
 authors:
 - Code Climate
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2017-05-17 00:00:00.000000000 Z
+date: 2017-08-08 00:00:00.000000000 Z
 dependencies: []
 description: Foundational stylesheets for Code Climate properties
 email: