style: agrega estilo al boton quitar filtros

devchris03 · Sep 8, 2024 · 7b4b203 · 7b4b203
1 parent 8279d89
commit 7b4b203
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 0 deletions.
diff --git a/css/style.css b/css/style.css
@@ -3,6 +3,7 @@
     font-size: 16px;
     --black: #1e1e1e;
     --purple: #dda0dd;
+    --purpleDark: #872b87;
     --white: #fdfdfd;
     --red: #f64545;
     --gray: #646464;
@@ -60,8 +61,36 @@ body {
     border-radius: .5rem;
 }
 
+/* BOTONES */
+
+.btnReset{
+    display: block;
+    inline-size: 200px;
+    margin-inline: auto;
+    background: var(--purpleDark);
+    color: var(--white);
+    padding: .5rem 1.5rem;
+    font-weight: 700;
+    border-radius: 1rem;
+    border: none;
+    font-size: 1rem;
+    margin-block-start: 2rem;
+    box-shadow: inset -1px -1px 3px var(--purple);
+    opacity: 1;
+    cursor: pointer;
+    transition: background .5s;
+}
+
+.btnReset:hover {
+    background: rgb(104, 2, 104);
+}
+
 /* RESULT */
 
+.result {
+    padding-block: 2rem;
+}
+
 .result-title {
     text-align: center;
     margin-block-end: 3rem;

diff --git a/index.html b/index.html
@@ -97,6 +97,7 @@ <h1 class="header-title">SearchBook</h1>
                 </select>
             </div> <!-- select editorial -->
         </search>
+        <button type="reset" class="btnReset" id="btnReset">Quitar filtros</button>
     </form>
     <main class="result">
         <div class="result-content wrapper">