update to 1.6.0 :)

alphardex · Nov 28, 2020 · 6be35b6 · 6be35b6
1 parent 71a252e
commit 6be35b6
Show file tree

Hide file tree

Showing 50 changed files with 20,236 additions and 788 deletions.
diff --git a/README.md b/README.md
@@ -1,6 +1,6 @@
 <h1 align="center">aqua.css</h1>
 <p>
-  <img alt="Version" src="https://img.shields.io/badge/version-1.5.6-blue.svg?cacheSeconds=2592000" />
+  <img alt="Version" src="https://img.shields.io/badge/version-1.6.0-blue.svg?cacheSeconds=2592000" />
   <a href="https://aquacss.netlify.com/">
     <img alt="Documentation" src="https://img.shields.io/badge/documentation-yes-brightgreen.svg" target="_blank" />
   </a>
@@ -28,7 +28,11 @@
 在页面的`<head>`标签里添加以下行即可
 
 ```html
-<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@alphardex/[email protected]/dist/aqua.min.css" />
+<link
+  rel="stylesheet"
+  type="text/css"
+  href="https://cdn.jsdelivr.net/npm/@alphardex/[email protected]/dist/aqua.min.css"
+/>
 ```
 
 ### 通过 npm 安装

diff --git a/demo/button.html b/demo/button.html
@@ -37,7 +37,7 @@
       Round
     </button>
     <button class="btn btn-primary btn-circle">
-      <i class="search-icon"></i>
+      C
     </button>
     <button class="btn btn-primary disabled">
       Disabled

diff --git a/demo/card.html b/demo/card.html
@@ -11,7 +11,7 @@
 </head>
 
 <body>
-    <div class="card">
+    <div class="card p-9 shadow-xl">
         <ul class="progress-list">
             <li class="progress-list__item">
                 <div class="weekday-abbr">

diff --git a/demo/dialog.html b/demo/dialog.html
@@ -25,6 +25,7 @@
         Cancel
       </button>
     </div>
+    <div class="close-icon"></div>
   </div>
   <div class="backdrop"></div>
   <form action="javascript:void(0);">

diff --git a/demo/icon.html b/demo/icon.html
@@ -4,35 +4,33 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Close Icon</title>
+  <title>Icon</title>
   <link rel="stylesheet" href="../dist/aqua.css" />
   <link rel="stylesheet" href="./styles/demo.css" />
 </head>
 
 <body>
-  <div class="space-y-4">
-    <div>
-      <a class="close-icon"></a>
-    </div>
-    <div class="flex items-center space-x-2">
-      <a class="chevron-icon up"></a>
-      <a class="chevron-icon right"></a>
-      <a class="chevron-icon down"></a>
-      <a class="chevron-icon left"></a>
-      <a class="chevron-icon up circle"></a>
-      <a class="chevron-icon left circle"></a>
-      <a class="chevron-icon down circle"></a>
-      <a class="chevron-icon right circle"></a>
-    </div>
-    <div>
-      <a class="search-icon"></a>
-    </div>
-    <div class="flex items-center space-x-2">
-      <a class="plus-icon"></a>
-      <a class="minus-icon"></a>
-      <a class="plus-icon circle"></a>
-      <a class="minus-icon circle"></a>
-    </div>
+  <a class="close-icon"></a>
+  </div>
+  <div class="flex items-center space-x-2">
+    <a class="chevron-icon up"></a>
+    <a class="chevron-icon right"></a>
+    <a class="chevron-icon down"></a>
+    <a class="chevron-icon left"></a>
+    <a class="chevron-icon up circle"></a>
+    <a class="chevron-icon right circle"></a>
+    <a class="chevron-icon down circle"></a>
+    <a class="chevron-icon left circle"></a>
+  </div>
+  <div>
+    <a class="search-icon"></a>
+  </div>
+  <div class="flex items-center space-x-2">
+    <a class="plus-icon"></a>
+    <a class="minus-icon"></a>
+    <a class="plus-icon circle"></a>
+    <a class="minus-icon circle"></a>
+  </div>
   </div>
 </body>
 

diff --git a/demo/search-bar.html b/demo/search-bar.html
@@ -14,7 +14,7 @@
   <div class="search-bar">
     <div class="input-group">
       <button class="btn">
-        <i class="search-icon"></i>
+        <i class="search-icon scale-75"></i>
       </button>
       <input type="search" class="form-control" name="search" placeholder="Search" />
     </div>

diff --git a/demo/styles/search-bar.css b/demo/styles/search-bar.css
@@ -1,11 +1,11 @@
 .search-bar .form-control {
-  --input-color: var(--secondary-color-lighter);
+  --input-bg: var(--secondary-color-lighter);
   border-color: transparent;
   border-radius: 15px;
 }
 
 .search-bar .btn {
-  --btn-color: var(--secondary-color-lighter);
+  --btn-bg: var(--secondary-color-lighter);
   --search-color: var(--secondary-color-darker);
   display: flex;
   justify-content: center;