Merge branch 'release/v0.21.2'

holtwick · Jun 14, 2024 · 159e6d2 · 159e6d2
2 parents de50d75 + b2b30c0
commit 159e6d2
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 20 deletions.
diff --git a/lib/float/oui-float.demo.vue b/lib/float/oui-float.demo.vue
@@ -127,7 +127,7 @@ Yeah!"
     <p>
       TRIGGER
 
-      <OuiFloat placement="right" :offset="10" close hover>
+      <OuiFloat placement="right" :offset="10" close hover class="oui-float _dropdown">
         <template #trigger="{ active }">
           <OuiButton>OuiFloat #click {{ active }}</OuiButton>
         </template>
@@ -179,5 +179,26 @@ Yeah!"
     <OuiFloat v-model="show4" :reference="button">
       This is the popover
     </OuiFloat>
+
+    <br>
+
+    <OuiFloat
+      placement="bottom"
+      :offset="10"
+      close
+      hover
+      arrow
+      class="oui-float _dropdown"
+      transition="oui-float-transition"
+    >
+      <template #trigger>
+        <OuiButton>APPS</OuiButton>
+      </template>
+
+      <ol>
+        <li>App1</li>
+        <li>App2</li>
+      </ol>
+    </OuiFloat>
   </OuiText>
 </template>
diff --git a/lib/float/oui-float.styl b/lib/float/oui-float.styl
@@ -13,10 +13,14 @@
 
   $oui-float-arrow-size = px(12);
   $oui-float-arrow-indent-factor = 0.7;
-  --float-color: inherit;
-  --float-background: transparent;
-  --float-border: none;
-  --float-shadow: none;
+
+  :where(&) {
+    --float-color: inherit;
+    --float-background: transparent;
+    --float-border: none;
+    --float-shadow: none;
+  }
+
   z-index: -z-index-popover;
 
   &._tooltip {
@@ -39,12 +43,13 @@
     min-width: 24;
   }
 
-  &._dropdown {
+  :where(&._dropdown) {
     // for selecting input values
     --float-color: var(--fg);
-    --float-background: white;
-    --float-border: 1px solid $border-color; // 0px 0px 0px 1px #000000;
-    --float-shadow: rgba(15, 15, 15, 0.05) 0 0 0 1px, rgba(15, 15, 15, 0.1) 0 3px 6px, rgba(15, 15, 15, 0.2) 0 9px 24px;
+    --float-background: var(--bg);
+    --float-border: 1px solid var(--t3-bg); // 0px 0px 0px 1px #000000;
+    --float-shadow: rgba(15, 15, 15, 0.2) 0 9px 24px;
+    // --float-shadow: rgba(15, 15, 15, 0.05) 0 0 0 1px, rgba(15, 15, 15, 0.1) 0 3px 6px, rgba(15, 15, 15, 0.2) 0 9px 24px;
     min-width: px(200);
     border-radius: px(4);
   }

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "oui-kit",
   "type": "module",
-  "version": "0.21.1",
+  "version": "0.21.2",
   "author": {
     "email": "[email protected]",
     "name": "Dirk Holtwick",
@@ -74,31 +74,31 @@
   },
   "dependencies": {
     "@floating-ui/vue": "^1.0.6",
-    "@vueuse/core": "^10.10.0",
+    "@vueuse/core": "^10.11.0",
     "vue": "^3.4.27",
     "zeed": "^0.20.7"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^2.19.1",
+    "@antfu/eslint-config": "^2.21.1",
     "@antfu/ni": "^0.21.12",
-    "@shikijs/markdown-it": "^1.6.1",
+    "@shikijs/markdown-it": "^1.6.4",
     "@tsconfig/node18": "^18.2.4",
     "@types/jest": "^29.5.12",
-    "@types/node": "^20.12.13",
+    "@types/node": "^20.14.2",
     "@vite-pwa/assets-generator": "^0.2.4",
     "@vitejs/plugin-vue": "^5.0.5",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.5.1",
     "eslint": "<9",
     "only-allow": "^1.2.1",
     "stylus": "^0.63.0",
-    "tsup": "^8.0.2",
+    "tsup": "^8.1.0",
     "typescript": "^5.4.5",
     "unplugin-vue-markdown": "^0.26.2",
-    "vite": "^5.2.12",
+    "vite": "^5.3.0",
     "vite-plugin-dts": "^3.9.1",
     "vite-plugin-qrcode": "^0.2.3",
     "vitest": "^1.6.0",
-    "vue-tsc": "^2.0.19"
+    "vue-tsc": "^2.0.21"
   }
 }
diff --git a/src/css-utopia-grid.styl b/src/css-utopia-grid.styl
@@ -36,7 +36,7 @@
     }
   }
 
-  .grid_1to3up {
+  ._grid_1to3up {
     @media all and (min-width: 50rem) {
       grid-template-columns: 1fr 1fr 1fr;
     }

diff --git a/stylus/preset/utopia.styl b/stylus/preset/utopia.styl
@@ -1,3 +1,4 @@
+// utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 *//* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 *//* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.333,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
 :root {
   --step--2: unquote("clamp(0.6944rem, 0.6913rem + 0.0157vw, 0.7035rem)");
   --step--1: unquote("clamp(0.8333rem, 0.797rem + 0.1816vw, 0.9377rem)");
@@ -90,7 +91,7 @@ oui-utopia() {
     text-decoration-skip: ink edges;
   }
 
-  a {
+  a[class=""], a:not([class]) {
     color: var(--link-fg);
 
     &:hover {
@@ -267,4 +268,4 @@ oui-utopia() {
       }
     }
   }
-} // utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 *//* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 *//* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1240,20,1.333,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
+}