From 71835734fdbfc79b6355c0c67e7fd2d068ac526b Mon Sep 17 00:00:00 2001
From: bbe <benjamin.bernard-bouissieres@ipexia.com>
Date: Mon, 17 Aug 2020 12:28:11 +0200
Subject: [PATCH] Remove range input border

---
 docs/content/docs/components/forms.md | 9 +++------
 src/components/_forms.scss            | 5 +----
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/docs/content/docs/components/forms.md b/docs/content/docs/components/forms.md
index cb113b3..e063205 100644
--- a/docs/content/docs/components/forms.md
+++ b/docs/content/docs/components/forms.md
@@ -164,10 +164,9 @@ description: PaperCSS Forms
   </label>
 </fieldset>
 <fieldset class="form-group">
+  <legend>Sliders</legend>
   <label for="input-range">Note /10 :</label>
   <input type="range" name="note" id="input-range" min="0" max="10">
-</fieldset>
-<fieldset class="form-group">
   <label for="percentage">Percentage (<code>.input-block</code>) :</label>
   <input class="input-block" type="range" name="percentage" id="percentage" min="0" max="100" oninput="output.value = this.value + '%';">
   <output id="output" for="percentage">50%</output>
@@ -332,13 +331,11 @@ description: PaperCSS Forms
   </label>
 </fieldset>
 <fieldset class="form-group">
+  <legend>Sliders</legend>
   <label for="input-range">Note /10 :</label>
   <input type="range" name="note" id="input-range" min="0" max="10">
-</fieldset>
-<fieldset class="form-group">
   <label for="percentage">Percentage (<code>.input-block</code>) :</label>
-  <input class="input-block" type="range" name="percentage" id="percentage"
-         min="0" max="100" oninput="output.value = this.value + '%';">
+  <input class="input-block" type="range" name="percentage" id="percentage" min="0" max="100" oninput="output.value = this.value + '%';">
   <output id="output" for="percentage">50%</output>
 </fieldset>
 ```
diff --git a/src/components/_forms.scss b/src/components/_forms.scss
index 59d85fb..2f987e5 100644
--- a/src/components/_forms.scss
+++ b/src/components/_forms.scss
@@ -320,10 +320,7 @@ select {
 
   input[type='range'] {
     appearance: none;
-
-    &:focus {
-      border-color: $secondary;
-    }
+    border-width: 0;
 
     /* For Chromium */
     &::-webkit-slider-runnable-track {