willba-component-library 0.3.22 → 0.3.24

package/README.md

@@ -107,7 +107,7 @@ ReactDOM.render(<App />, document.querySelector('#app'))
 
 <script src="https://unpkg.com/react@18.3.1/umd/react.production.min.js"></script>
 <script src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.production.min.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/willba-component-library@0.3.22/lib/index.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/willba-component-library@0.3.24/lib/index.umd.js"></script>
 
 <script>
   const renderFilterBar = async () => {

package/lib/index.esm.js

@@ -12078,7 +12078,7 @@ var ImageCard = forwardRef(function (_a, ref) {
 });
 ImageCard.displayName = 'ImageCard';
 
-var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    margin-top: 15px;\n    min-width: 100%;\n  }\n}\n";
+var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    min-width: 100%;\n  }\n}\n";
 styleInject(css_248z$7);
 
 var Locations = forwardRef(function (_a, ref) {
@@ -12143,7 +12143,7 @@ var Categories = function (_a) {
 };
 Categories.displayName = 'Categories';
 
-var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    margin-top: 10px;\n    top: 0;\n    position: relative;\n  }\n}\n";
+var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    top: 60px;\n    width: 100%;\n    z-index: 999;\n  }\n}\n";
 styleInject(css_248z$5);
 
 var FilterPanels = function () {

package/lib/index.js

@@ -12098,7 +12098,7 @@ var ImageCard = React.forwardRef(function (_a, ref) {
 });
 ImageCard.displayName = 'ImageCard';
 
-var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    margin-top: 15px;\n    min-width: 100%;\n  }\n}\n";
+var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    min-width: 100%;\n  }\n}\n";
 styleInject(css_248z$7);
 
 var Locations = React.forwardRef(function (_a, ref) {
@@ -12163,7 +12163,7 @@ var Categories = function (_a) {
 };
 Categories.displayName = 'Categories';
 
-var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    margin-top: 10px;\n    top: 0;\n    position: relative;\n  }\n}\n";
+var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    top: 60px;\n    width: 100%;\n    z-index: 999;\n  }\n}\n";
 styleInject(css_248z$5);
 
 var FilterPanels = function () {

package/lib/index.umd.js

@@ -12100,7 +12100,7 @@
     });
     ImageCard.displayName = 'ImageCard';
 
-    var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    margin-top: 15px;\n    min-width: 100%;\n  }\n}\n";
+    var css_248z$7 = "#will-filter-bar-locations {\n  text-align: initial;\n}\n\n.will-locations-filter-container {\n  display: flex;\n  flex-direction: column;\n  min-width: 400px;\n  padding-bottom: 16px;\n}\n\n@media (max-width: 960px) {\n  .will-locations-filter-container {\n    min-width: 100%;\n  }\n}\n";
     styleInject(css_248z$7);
 
     var Locations = React.forwardRef(function (_a, ref) {
@@ -12165,7 +12165,7 @@
     };
     Categories.displayName = 'Categories';
 
-    var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    margin-top: 10px;\n    top: 0;\n    position: relative;\n  }\n}\n";
+    var css_248z$5 = ".will-filter-bar-panels {\n  background-color: var(--will-white);\n  min-height: 100px;\n  position: absolute;\n  top: 125px;\n  z-index: 111;\n  border-radius: 25px;\n  box-shadow: var(--will-box-shadow);\n}\n\n@media (max-width: 960px) {\n  .will-root {\n    width: 100%;\n    min-width: auto;\n    max-height: 100vh;\n    z-index: 3;\n  }\n\n  .will-filter-bar-panels {\n    top: 60px;\n    width: 100%;\n    z-index: 999;\n  }\n}\n";
     styleInject(css_248z$5);
 
     var FilterPanels = function () {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "willba-component-library",
-  "version": "0.3.22",
+  "version": "0.3.24",
   "description": "A custom UI component library",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",

package/src/components/FilterBar/components/FilterPanels/FilterPanels.css

@@ -17,8 +17,8 @@
   }
 
   .will-filter-bar-panels {
-    margin-top: 10px;
-    top: 0;
-    position: relative;
+    top: 60px;
+    width: 100%;
+    z-index: 999;
   }
 }

package/src/components/FilterBar/components/FilterPanels/Locations/Locations.css

@@ -11,7 +11,6 @@
 
 @media (max-width: 960px) {
   .will-locations-filter-container {
-    margin-top: 15px;
     min-width: 100%;
   }
 }