biings-ds - npm Package Compare versions

Comparing version 1.6.3 to 1.7.0

docs/color.md

@@ -11,5 +11,5 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Guidelines</h6><h1 class="title is-1 has-text-weight-bold">Color</h1>
 <div class="columns is-multiline">
-    <div class="column is-3"><div class="notification has-background-primary"><br></div><span>**primary** / Violet</span><br><span class="has-text-grey-dark is-monospace">#715EB8</span></div>
-    <div class="column is-3"><div class="notification has-background-light"><br></div><span>**light**</span><br><span class="has-text-grey-dark is-monospace">#F9F8FC</span></div>
-    <div class="column is-3"><div class="notification has-background-dark"><br></div><span>**dark**</span><br><span class="has-text-grey-dark is-monospace">#403D4B</span></div>
+    <div class="column is-3"><div class="has-background-primary"><br><br></div><span>**primary** / Violet</span><br><span class="has-text-grey-dark is-monospace">#715EB8</span></div>
+    <div class="column is-3"><div class="has-background-light"><br><br></div><span>**light**</span><br><span class="has-text-grey-dark is-monospace">#F9F8FC</span></div>
+    <div class="column is-3"><div class="has-background-dark"><br><br></div><span>**dark**</span><br><span class="has-text-grey-dark is-monospace">#403D4B</span></div>
 </div>
@@ -24,15 +24,15 @@
 <div class="columns is-multiline">
-    <div class="column is-3"><div class="notification has-background-white-ter"><br></div><span>**white-ter**</span><br><span class="has-text-grey-dark is-monospace">#F6F5FA</span></div>
-    <div class="column is-3"><div class="notification has-background-white-bis"><br></div><span>**white-bis**</span><br><span class="has-text-grey-dark is-monospace">#F9F8FC</span></div>
-    <div class="column is-3"><div class="notification has-background-white"><br></div><span>**white**</span><br><span class="has-text-grey-dark is-monospace">#FFFFFF</span></div>
+    <div class="column is-3"><div class="has-background-white-ter"><br><br></div><span>**white-ter**</span><br><span class="has-text-grey-dark is-monospace">#F6F5FA</span></div>
+    <div class="column is-3"><div class="has-background-white-bis"><br><br></div><span>**white-bis**</span><br><span class="has-text-grey-dark is-monospace">#F9F8FC</span></div>
+    <div class="column is-3"><div class="has-background-white"><br><br></div><span>**white**</span><br><span class="has-text-grey-dark is-monospace">#FFFFFF</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-grey-dark"><br></div><span>**grey-dark**</span><br><span class="has-text-grey-dark is-monospace">#8B85A0</span></div>
-    <div class="column is-3"><div class="notification has-background-grey"><br></div><span>**grey**</span><br><span class="has-text-grey-dark is-monospace">#B4B0C2</span></div>
-    <div class="column is-3"><div class="notification has-background-grey-light"><br></div><span>**grey-light**</span><br><span class="has-text-grey-dark is-monospace">#D3D1DB</span></div>
-    <div class="column is-3"><div class="notification has-background-grey-lighter"><br></div><span>**grey-lighter**</span><br><span class="has-text-grey-dark is-monospace">#EDECF0</span></div> 
+    <div class="column is-3"><div class="has-background-grey-dark"><br><br></div><span>**grey-dark**</span><br><span class="has-text-grey-dark is-monospace">#8B85A0</span></div>
+    <div class="column is-3"><div class="has-background-grey"><br><br></div><span>**grey**</span><br><span class="has-text-grey-dark is-monospace">#B4B0C2</span></div>
+    <div class="column is-3"><div class="has-background-grey-light"><br><br></div><span>**grey-light**</span><br><span class="has-text-grey-dark is-monospace">#D3D1DB</span></div>
+    <div class="column is-3"><div class="has-background-grey-lighter"><br><br></div><span>**grey-lighter**</span><br><span class="has-text-grey-dark is-monospace">#EDECF0</span></div> 
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-black"><br></div><span>**black**</span><br><span class="has-text-grey-dark is-monospace">#15141B</span></div>
-    <div class="column is-3"><div class="notification has-background-black-bis"><br></div><span>**black-bis**</span><br><span class="has-text-grey-dark is-monospace">#302D3D</span></div>
-    <div class="column is-3"><div class="notification has-background-black-ter"><br></div><span>**black-ter**</span><br><span class="has-text-grey-dark is-monospace">#403D4B</span></div>
-    <div class="column is-3"><div class="notification has-background-grey-darker"><br></div><span>**grey-darker**</span><br><span class="has-text-grey-dark is-monospace">#6D6881</span></div>
+    <div class="column is-3"><div class="has-background-black"><br><br></div><span>**black**</span><br><span class="has-text-grey-dark is-monospace">#15141B</span></div>
+    <div class="column is-3"><div class="has-background-black-bis"><br><br></div><span>**black-bis**</span><br><span class="has-text-grey-dark is-monospace">#302D3D</span></div>
+    <div class="column is-3"><div class="has-background-black-ter"><br><br></div><span>**black-ter**</span><br><span class="has-text-grey-dark is-monospace">#403D4B</span></div>
+    <div class="column is-3"><div class="has-background-grey-darker"><br><br></div><span>**grey-darker**</span><br><span class="has-text-grey-dark is-monospace">#6D6881</span></div>
 </div>
@@ -47,46 +47,46 @@
 <div class="columns is-multiline">
-    <div class="column is-3"><div class="notification has-background-cyan-dark"><br></div><span>**cyan-dark**</span><br><span class="has-text-grey-dark is-monospace">#5A90A8</span></div>
-    <div class="column is-3"><div class="notification has-background-cyan"><br></div><span>**cyan** / Viking</span><br><span class="has-text-grey-dark is-monospace">#78C0E0</span></div>
-    <div class="column is-3"><div class="notification has-background-cyan-light"><br></div><span>**cyan-light**</span><br><span class="has-text-grey-dark is-monospace">#A1D3E9</span></div>
-    <div class="column is-3"><div class="notification has-background-cyan-lighter"><br></div><span>**cyan-lighter**</span><br><span class="has-text-grey-dark is-monospace">#C9E6F3</span></div>
+    <div class="column is-3"><div class="has-background-cyan-dark"><br><br></div><span>**cyan-dark**</span><br><span class="has-text-grey-dark is-monospace">#5A90A8</span></div>
+    <div class="column is-3"><div class="has-background-cyan"><br><br></div><span>**cyan** / Viking</span><br><span class="has-text-grey-dark is-monospace">#78C0E0</span></div>
+    <div class="column is-3"><div class="has-background-cyan-light"><br><br></div><span>**cyan-light**</span><br><span class="has-text-grey-dark is-monospace">#A1D3E9</span></div>
+    <div class="column is-3"><div class="has-background-cyan-lighter"><br><br></div><span>**cyan-lighter**</span><br><span class="has-text-grey-dark is-monospace">#C9E6F3</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-blue-dark"><br></div><span>**blue-dark**</span><br><span class="has-text-grey-dark is-monospace">#445C97</span></div>
-    <div class="column is-3"><div class="notification has-background-blue"><br></div><span>**blue** / Indigo</span><br><span class="has-text-grey-dark is-monospace">#5A7BC9</span></div>
-    <div class="column is-3"><div class="notification has-background-blue-light"><br></div><span>**blue-light**</span><br><span class="has-text-grey-dark is-monospace">#8CA3D9</span></div>
-    <div class="column is-3"><div class="notification has-background-blue-lighter"><br></div><span>**blue-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BDCAE9</span></div>
+    <div class="column is-3"><div class="has-background-blue-dark"><br><br></div><span>**blue-dark**</span><br><span class="has-text-grey-dark is-monospace">#445C97</span></div>
+    <div class="column is-3"><div class="has-background-blue"><br><br></div><span>**blue** / Indigo</span><br><span class="has-text-grey-dark is-monospace">#5A7BC9</span></div>
+    <div class="column is-3"><div class="has-background-blue-light"><br><br></div><span>**blue-light**</span><br><span class="has-text-grey-dark is-monospace">#8CA3D9</span></div>
+    <div class="column is-3"><div class="has-background-blue-lighter"><br><br></div><span>**blue-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BDCAE9</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-purple-dark"><br></div><span>**purple-dark**</span><br><span class="has-text-grey-dark is-monospace">#564499</span></div>
-    <div class="column is-3"><div class="notification has-background-purple"><br></div><span>**purple** / Marguerite</span><br><span class="has-text-grey-dark is-monospace">#735BCC</span></div>
-    <div class="column is-3"><div class="notification has-background-purple-light"><br></div><span>**purple-light**</span><br><span class="has-text-grey-dark is-monospace">#9D8CDB</span></div>
-    <div class="column is-3"><div class="notification has-background-purple-lighter"><br></div><span>**purple-lighter**</span><br><span class="has-text-grey-dark is-monospace">#C7BDEB</span></div>
+    <div class="column is-3"><div class="has-background-purple-dark"><br><br></div><span>**purple-dark**</span><br><span class="has-text-grey-dark is-monospace">#564499</span></div>
+    <div class="column is-3"><div class="has-background-purple"><br><br></div><span>**purple** / Marguerite</span><br><span class="has-text-grey-dark is-monospace">#735BCC</span></div>
+    <div class="column is-3"><div class="has-background-purple-light"><br><br></div><span>**purple-light**</span><br><span class="has-text-grey-dark is-monospace">#9D8CDB</span></div>
+    <div class="column is-3"><div class="has-background-purple-lighter"><br><br></div><span>**purple-lighter**</span><br><span class="has-text-grey-dark is-monospace">#C7BDEB</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-pink-dark"><br></div><span>**pink-dark**</span><br><span class="has-text-grey-dark is-monospace">#9D468B</span></div>
-    <div class="column is-3"><div class="notification has-background-pink"><br></div><span>**pink** / Fuchsia</span><br><span class="has-text-grey-dark is-monospace">#CC5BB5</span></div>
-    <div class="column is-3"><div class="notification has-background-pink-light"><br></div><span>**pink-light**</span><br><span class="has-text-grey-dark is-monospace">#DB8CCB</span></div>
-    <div class="column is-3"><div class="notification has-background-pink-lighter"><br></div><span>**pink-lighter**</span><br><span class="has-text-grey-dark is-monospace">#EBBDE1</span></div>
+    <div class="column is-3"><div class="has-background-pink-dark"><br><br></div><span>**pink-dark**</span><br><span class="has-text-grey-dark is-monospace">#9D468B</span></div>
+    <div class="column is-3"><div class="has-background-pink"><br><br></div><span>**pink** / Fuchsia</span><br><span class="has-text-grey-dark is-monospace">#CC5BB5</span></div>
+    <div class="column is-3"><div class="has-background-pink-light"><br><br></div><span>**pink-light**</span><br><span class="has-text-grey-dark is-monospace">#DB8CCB</span></div>
+    <div class="column is-3"><div class="has-background-pink-lighter"><br><br></div><span>**pink-lighter**</span><br><span class="has-text-grey-dark is-monospace">#EBBDE1</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-red-dark"><br></div><span>**red-dark**</span><br><span class="has-text-grey-dark is-monospace">#BF4E56</span></div>
-    <div class="column is-3"><div class="notification has-background-red"><br></div><span>**red** / Froly</span><br><span class="has-text-grey-dark is-monospace">#EF626C</span></div>
-    <div class="column is-3"><div class="notification has-background-red-light"><br></div><span>**red-light**</span><br><span class="has-text-grey-dark is-monospace">#F49198</span></div>
-    <div class="column is-3"><div class="notification has-background-red-lighter"><br></div><span>**red-lighter**</span><br><span class="has-text-grey-dark is-monospace">#F9C0C4</span></div>
+    <div class="column is-3"><div class="has-background-red-dark"><br><br></div><span>**red-dark**</span><br><span class="has-text-grey-dark is-monospace">#BF4E56</span></div>
+    <div class="column is-3"><div class="has-background-red"><br><br></div><span>**red** / Froly</span><br><span class="has-text-grey-dark is-monospace">#EF626C</span></div>
+    <div class="column is-3"><div class="has-background-red-light"><br><br></div><span>**red-light**</span><br><span class="has-text-grey-dark is-monospace">#F49198</span></div>
+    <div class="column is-3"><div class="has-background-red-lighter"><br><br></div><span>**red-lighter**</span><br><span class="has-text-grey-dark is-monospace">#F9C0C4</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-orange-dark"><br></div><span>**orange-dark**</span><br><span class="has-text-grey-dark is-monospace">#D97F04</span></div>
-    <div class="column is-3"><div class="notification has-background-orange"><br></div><span>**orange** / Carrot</span><br><span class="has-text-grey-dark is-monospace">#FF9505</span></div>
-    <div class="column is-3"><div class="notification has-background-orange-light"><br></div><span>**orange-light**</span><br><span class="has-text-grey-dark is-monospace">#FFB550</span></div>
-    <div class="column is-3"><div class="notification has-background-orange-lighter"><br></div><span>**orange-lighter**</span><br><span class="has-text-grey-dark is-monospace">#FFD59B</span></div>
+    <div class="column is-3"><div class="has-background-orange-dark"><br><br></div><span>**orange-dark**</span><br><span class="has-text-grey-dark is-monospace">#D97F04</span></div>
+    <div class="column is-3"><div class="has-background-orange"><br><br></div><span>**orange** / Carrot</span><br><span class="has-text-grey-dark is-monospace">#FF9505</span></div>
+    <div class="column is-3"><div class="has-background-orange-light"><br><br></div><span>**orange-light**</span><br><span class="has-text-grey-dark is-monospace">#FFB550</span></div>
+    <div class="column is-3"><div class="has-background-orange-lighter"><br><br></div><span>**orange-lighter**</span><br><span class="has-text-grey-dark is-monospace">#FFD59B</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-yellow-dark"><br></div><span>**yellow-dark**</span><br><span class="has-text-grey-dark is-monospace">#DEA244</span></div>
-    <div class="column is-3"><div class="notification has-background-yellow"><br></div><span>**yellow** / Casablanca</span><br><span class="has-text-grey-dark is-monospace">#FFC15E</span></div>
-    <div class="column is-3"><div class="notification has-background-yellow-light"><br></div><span>**yellow-light**</span><br><span class="has-text-grey-dark is-monospace">#FFD48E</span></div>
-    <div class="column is-3"><div class="notification has-background-yellow-lighter"><br></div><span>**yellow-lighter**</span><br><span class="has-text-grey-dark is-monospace">#FFE6BF</span></div>
+    <div class="column is-3"><div class="has-background-yellow-dark"><br><br></div><span>**yellow-dark**</span><br><span class="has-text-grey-dark is-monospace">#DEA244</span></div>
+    <div class="column is-3"><div class="has-background-yellow"><br><br></div><span>**yellow** / Casablanca</span><br><span class="has-text-grey-dark is-monospace">#FFC15E</span></div>
+    <div class="column is-3"><div class="has-background-yellow-light"><br><br></div><span>**yellow-light**</span><br><span class="has-text-grey-dark is-monospace">#FFD48E</span></div>
+    <div class="column is-3"><div class="has-background-yellow-lighter"><br><br></div><span>**yellow-lighter**</span><br><span class="has-text-grey-dark is-monospace">#FFE6BF</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-turquoise-dark"><br></div><span>**turquoise-dark**</span><br><span class="has-text-grey-dark is-monospace">#46A391</span></div>
-    <div class="column is-3"><div class="notification has-background-turquoise"><br></div><span>**turquoise** / Bermuda</span><br><span class="has-text-grey-dark is-monospace">#5DD9C1</span></div>
-    <div class="column is-3"><div class="notification has-background-turquoise-light"><br></div><span>**turquoise-light**</span><br><span class="has-text-grey-dark is-monospace">#8EE4D4</span></div>
-    <div class="column is-3"><div class="notification has-background-turquoise-lighter"><br></div><span>**turquoise-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BEF0E6</span></div>
+    <div class="column is-3"><div class="has-background-turquoise-dark"><br><br></div><span>**turquoise-dark**</span><br><span class="has-text-grey-dark is-monospace">#46A391</span></div>
+    <div class="column is-3"><div class="has-background-turquoise"><br><br></div><span>**turquoise** / Bermuda</span><br><span class="has-text-grey-dark is-monospace">#5DD9C1</span></div>
+    <div class="column is-3"><div class="has-background-turquoise-light"><br><br></div><span>**turquoise-light**</span><br><span class="has-text-grey-dark is-monospace">#8EE4D4</span></div>
+    <div class="column is-3"><div class="has-background-turquoise-lighter"><br><br></div><span>**turquoise-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BEF0E6</span></div>
     <div class="column is-12"></div>
-    <div class="column is-3"><div class="notification has-background-green-dark"><br></div><span>**green-dark**</span><br><span class="has-text-grey-dark is-monospace">#449956</span></div>
-    <div class="column is-3"><div class="notification has-background-green"><br></div><span>**green** / Emerald</span><br><span class="has-text-grey-dark is-monospace">#5BCC72</span></div>
-    <div class="column is-3"><div class="notification has-background-green-light"><br></div><span>**green-light**</span><br><span class="has-text-grey-dark is-monospace">#8CDB9C</span></div>
-    <div class="column is-3"><div class="notification has-background-green-lighter"><br></div><span>**green-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BDEBC7</span></div>
+    <div class="column is-3"><div class="has-background-green-dark"><br><br></div><span>**green-dark**</span><br><span class="has-text-grey-dark is-monospace">#449956</span></div>
+    <div class="column is-3"><div class="has-background-green"><br><br></div><span>**green** / Emerald</span><br><span class="has-text-grey-dark is-monospace">#5BCC72</span></div>
+    <div class="column is-3"><div class="has-background-green-light"><br><br></div><span>**green-light**</span><br><span class="has-text-grey-dark is-monospace">#8CDB9C</span></div>
+    <div class="column is-3"><div class="has-background-green-lighter"><br><br></div><span>**green-lighter**</span><br><span class="has-text-grey-dark is-monospace">#BDEBC7</span></div>
 </div>
@@ -100,10 +100,10 @@
 
-<div class="columns is-multiline">
-    <div class="column is-12"><div class="notification has-background-gradient-1"><br></div></div>
+<div class="columns is-multiline is-gapless">
+    <div class="column is-12"><div class="has-background-gradient-1"><br><br></div></div>
     <div class="column is-12">**gradient–1**<span class="is-pulled-right has-text-grey-dark is-size-7"><span class="is-monospace">Primary</span> &nbsp;→&nbsp; <span class="is-monospace">Pink</span></span></div>
-    <div class="column is-12"></div>
-    <div class="column is-12"><div class="notification has-background-gradient-2"><br></div></div>
+    <div class="column is-12"><br></div>
+    <div class="column is-12"><div class="has-background-gradient-2"><br><br></div></div>
     <div class="column is-12">**gradient–2** <span class="is-pulled-right has-text-grey-dark is-size-7"><span class="is-monospace">Cyan</span> &nbsp;→&nbsp; <span class="is-monospace">Turquoise</span></span></div>
-    <div class="column is-12"></div>
-    <div class="column is-12"><div class="notification has-background-gradient-3"><br></div></div>
+    <div class="column is-12"><br></div>
+    <div class="column is-12"><div class="has-background-gradient-3"><br><br></div></div>
     <div class="column is-12">**gradient–3** <span class="is-pulled-right has-text-grey-dark is-size-7"><span class="is-monospace">Red</span> &nbsp;→&nbsp; <span class="is-monospace">Yellow</span></span></div>
@@ -110,0 +110,0 @@ </div>

docs/column.md

@@ -9,14 +9,14 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1 has-text-weight-bold">Column</h1>
 <div class="box has-background-light is-marginless is-relaxed">
-<div class="columns">
+<div class="columns has-text-white has-text-centered">
     <div class="column">
-      <div class="notification has-text-weight-semibold is-primary">First</div>
+      <div class="message has-background-red-light has-text-weight-semibold"><br>First<br><br></div>
     </div>
     <div class="column">
-      <div class="notification has-text-weight-semibold is-danger">Second</div>
+      <div class="message has-background-pink-light has-text-weight-semibold"><br>Second<br><br></div>
     </div>
     <div class="column">
-      <div class="notification has-text-weight-semibold is-warning">Third</div>
+      <div class="message has-background-turquoise has-text-weight-semibold"><br>Third<br><br></div>
     </div>
     <div class="column">
-      <div class="notification has-text-weight-semibold is-success">Fourth</div>
+      <div class="message has-background-cyan has-text-weight-semibold"><br>Fourth<br><br></div>
     </div>
@@ -33,3 +33,3 @@ </div>
 
-<hr class="is-large">
+<hr>
 
@@ -36,0 +36,0 @@ <div class="box is-bordered">

docs/dropdown.md

@@ -64,3 +64,3 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1">Dropdown</h1>
                 <span>With custom icon &nbsp;</span>
-                <svg class="icon has-fill-green"><use xlink:href="media/bds-icons.min.svg#circle-plus"></use></svg>&nbsp;
+                <svg class="icon has-fill-green"><use xlink:href="media/bds-icons.min.svg#help"></use></svg>&nbsp;
             </div>
@@ -122,3 +122,3 @@ </div>
                 <div class="dropdown-item ">
-                    <input class="input is-small is-paddingless has-background-white" type="text" placeholder="Search the list">
+                    <input class="input is-small is-paddingless is-borderless is-shadowless" type="text" placeholder="Search the list">
                 </div>
@@ -153,6 +153,56 @@ <div class="dropdown-divider"></div>
 
-<hr class="is-large">
+<a id="selectlist"></a>
+<hr class="is-visible is-large">
 
+<h2 class="title is-4">Select list</h2>
+
+Create a system default select list just by wrapping it with a `.select` div.
+
+<hr class="is-small">
+
+<div class="box has-background-light is-large is-marginless">
+    <div class="select is-small">
+        <select>
+            <option value="">Small</option>
+            <option value="">System</option>
+            <option value="">Select</option>
+            <option value="">List</option>
+        </select>
+    </div> &nbsp; &nbsp;
+    <div class="select">
+        <select>
+            <option value="">Default</option>
+            <option value="">System</option>
+            <option value="">Select</option>
+            <option value="">List</option>
+        </select>
+    </div>
+    &nbsp; &nbsp;
+    <div class="select is-medium">
+            <select>
+                <option value="">Medium</option>
+                <option value="">System</option>
+                <option value="">Select</option>
+                <option value="">List</option>
+            </select>
+        </div>
+</div>
+
+    <div class="select is-medium">
+        <select>
+            <option value="1">Default</option>
+            <option value="2">System</option>
+            <option value="3">Select</option>
+            <option value="4">List</option>
+        </select>
+    </div>
+
+<br>
+
+?> Size modifiers `is-small`, `is-medium` are also supported.
+
+<hr>
+
 <div class="box is-bordered">
-    More possibilities on &nbsp;→&nbsp; <a href="https://bulma.io/documentation/components/dropdown/" target="blank">Bulma / <strong>Dropdown</strong></a>
+    More possibilities on &nbsp;→&nbsp; <a href="https://bulma.io/documentation/components/dropdown/" target="blank">Bulma / <strong>Dropdown</strong></a> &nbsp;and&nbsp; <a href="https://bulma.io/documentation/form/select/" target="blank">Bulma / <strong>Select</strong></a>
 </div>

docs/icons.md

@@ -41,2 +41,3 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Guidelines</h6><h1 class="title is-1 has-text-weight-bold">Iconography</h1>
     <div class="column is-one-third-mobile is-2 hover-to-black"><div class="box is-small"><svg class="icon is-medium has-fill-grey-darker"><use xlink:href="media/bds-icons.min.svg#prefs"></use></svg></div>prefs</div>
+    <div class="column is-one-third-mobile is-2 hover-to-black"><div class="box is-small"><svg class="icon is-medium has-fill-grey-darker"><use xlink:href="media/bds-icons.min.svg#profile"></use></svg></div>profile</div>
     <div class="column is-one-third-mobile is-2 hover-to-black"><div class="box is-small"><svg class="icon is-medium has-fill-grey-darker"><use xlink:href="media/bds-icons.min.svg#search"></use></svg></div>search</div>
@@ -43,0 +44,0 @@ <div class="column is-one-third-mobile is-2 hover-to-black"><div class="box is-small"><svg class="icon is-medium has-fill-grey-darker"><use xlink:href="media/bds-icons.min.svg#search-list"></use></svg></div>search-list</div>

docs/illustration.md

@@ -32,3 +32,3 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1 has-text-weight-bold">Illustration</h1>
 
-<hr class="is-large">
+<hr>
 
@@ -35,0 +35,0 @@ <div class="box is-bordered">

docs/input.md

@@ -45,6 +45,8 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1 has-text-weight-bold">Input</h1>
 
-<hr class="is-large">
+<hr>
 
 <div class="box is-bordered">
     More options on &nbsp;→&nbsp; <a href="https://bulma.io/documentation/form/input/" target="blank">Bulma / <strong>Input</strong></a>
+    <br>
+    Looking for <strong>Select lists</strong>? Check here &nbsp;→&nbsp; <a href="#/dropdown#selectlist" target="blank"><strong>Dropdown</strong></a>
 </div>

docs/layout.md

@@ -72,3 +72,3 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1 has-text-weight-bold">Layout</h1>
         </div>
-        <div class="page page--with-side-menu">
+        <div class="page">
           ...
@@ -79,5 +79,4 @@ </div>
 
-<hr class="is-large">
-<div class="box is-bordered">
-    💡 Combine it with <a href="#/columns">**Columns**</a> to virtually build any kind of page.
-</div>
+<hr>
+
+?> Build any kind of page by combining <strong>Layout</strong> with → <a href="#/columns">**Columns**</a>

docs/menu.md

@@ -28,3 +28,6 @@ <h6 class="subtitle is-5 has-text-grey has-text-weight-semibold">Component</h6><h1 class="title is-1 has-text-weight-bold">Menu</h1>
 
+<br>
 
+?> Modifiers like `is-small` are supported.
+
 <hr>
@@ -31,0 +34,0 @@

package.json

 {
   "name": "biings-ds",
-  "version": "1.6.3",
+  "version": "1.7.0",
   "description": "Biings Design System",
@@ -5,0 +5,0 @@ "main": "build/bds.css",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10760331

increased by0.15%

Number of package files

164

increased by1.23%

Lines of code

6022

increased by1.3%

No dependency changes