lism-css 0.7.1 → 0.7.2

package/config/defaults/props.js

@@ -253,7 +253,7 @@ export default {
 		presets: ['subgrid', 'liquid'],
 		exUtility: {
 			// repeat: { '--cols': '1', '--gtc': 'repeat(var(--cols), 1fr)' },
-			liquid: { '--cols': 'var(--sz--min)', '--gtc': 'repeat(auto-fill, minmax(min(var(--cols), 100%), 1fr))' },
+			liquid: { '--cols': 'var(--sz--min)', '--gtc': 'repeat(auto-fit, minmax(min(var(--cols), 100%), 1fr))' },
 		},
 		bp: 1,
 	},

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "lism-css",
-	"version": "0.7.1",
+	"version": "0.7.2",
 	"description": "A layout-first CSS framework for websites.",
 	"author": {
 		"name": "ddryo",

package/packages/astro/HTML/button.astro

@@ -2,4 +2,4 @@
 import Lism from '../Lism/Lism.astro';
 ---
 
-<Lism tag='button' {...Astro.props}><slot /></Lism>
+<Lism tag='button' setPlain {...Astro.props}><slot /></Lism>

package/src/scss/_prop-config.scss

@@ -197,8 +197,7 @@ $props: (
 			'l': 'var(--sz--l)',
 			'xl': 'var(--sz--xl)',
 		),
-		exUtility: (
-		),
+		exUtility: (),
 	),
 	'bg': (
 		prop: 'background',
@@ -657,8 +656,7 @@ $props: (
 	),
 	'gt': (
 		prop: 'grid-template',
-		utilities: (
-		),
+		utilities: (),
 		exUtility: (
 			'repeat': (
 				'grid-template': 'repeat(var(--rows,1), 1fr) / repeat(var(--cols,1), 1fr)',
@@ -678,7 +676,7 @@ $props: (
 		exUtility: (
 			'liquid': (
 				'--cols': 'var(--sz--min)',
-				'--gtc': 'repeat(auto-fill, minmax(min(var(--cols), 100%), 1fr))',
+				'--gtc': 'repeat(auto-fit, minmax(min(var(--cols), 100%), 1fr))',
 			),
 		),
 		bp: 1,
@@ -856,5 +854,4 @@ $props: (
 			'isolate': 'isolate',
 		),
 	),
-
 );

package/src/scss/base/_dom.scss

@@ -75,7 +75,7 @@ h6 {
  ---------------------------------------- */
 // link
 @include mixin.maybe_where('a') {
-	color: var(--c--link);
+	color: var(--link-c, var(--c--link));
 	text-decoration: var(--link-td, underline);
 	// text-underline-offset: var(--underline-offset, auto);
 	// text-decoration-thickness: var(--underline-thickness, 1px);

package/src/scss/modules/dynamic/_modal.scss

@@ -28,6 +28,7 @@
 	--translate: 0 0; // アニメーション用
 	background-color: var(--c--base);
 	transition: translate var(--duration);
+	max-height: 100%;
 }
 
 // .d--modal_body {

package/src/scss/modules/state/_linkbox.scss

@@ -10,9 +10,12 @@
 	isolation: isolate; // 内部のz-index順位と外部のz-indexを混同させない。
 }
 
-// リンクを全てクリック可能にしておく
-@include mixin.switch_selector('.is--linkBox > a', 'is--linkBox > :where(a)') {
-	pointer-events: auto; // カードメディア内のタグラベルをクリックできるようにする場合などに必要
-	position: relative; // isolation: isolate;
-	z-index: 1;
+// リンクをクリック可能にするためにz-indexあげる
+.is--linkBox a {
+	z-index: 2; // .u-linkExpand::before + 1
 }
+
+/* これをしてしまうと z-index 関係がややこしくなる。リンク以外のz-indexはデフォのままにする。 */
+// .is--linkBox > * {
+// 	z-index: 0;
+// }

package/src/scss/utility/_cbox.scss

@@ -5,7 +5,7 @@
 	--c: color-mix(in srgb, var(--c--text), var(--keycolor) var(--cbox-cPct, 40%));
 	--bgc: color-mix(in srgb, var(--c--base), var(--keycolor) var(--cbox-bgPct, 5%));
 	--bdc: var(--keycolor);
-	--c--link: var(--keycolor);
+	--link-c: var(--keycolor); // --c--link を上書きすると、keycolorに --c--link が使えなくなる
 	// --link-td: underline;
 	color: var(--c);
 	background-color: var(--bgc);

package/src/scss/utility/_linkExpand.scss

@@ -4,7 +4,7 @@
 	&::before {
 		position: absolute;
 		inset: 0;
-		z-index: 0;
+		z-index: 1;
 		content: '';
 	}
 }