@refrakt-md/skeleton 0.24.0 → 0.24.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/styles/runes/hero.css +21 -0
- package/styles/runes/sandbox.css +7 -0
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@refrakt-md/skeleton",
|
|
3
3
|
"description": "The structural cascade layer + layer-order contract every refrakt theme builds on — ships `@layer skeleton` and the `@layer skeleton, skin;` order declaration, plus the token-name contract",
|
|
4
|
-
"version": "0.24.
|
|
4
|
+
"version": "0.24.1",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"styles"
|
|
30
30
|
],
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@refrakt-md/types": "0.24.
|
|
32
|
+
"@refrakt-md/types": "0.24.1"
|
|
33
33
|
},
|
|
34
34
|
"scripts": {
|
|
35
35
|
"build": "tsc"
|
package/styles/runes/hero.css
CHANGED
|
@@ -8,6 +8,27 @@
|
|
|
8
8
|
|
|
9
9
|
.rf-hero { position: relative; }
|
|
10
10
|
|
|
11
|
+
/* Hero media zone bleeds: a hero is a section header, not a clip-host like
|
|
12
|
+
* card / bento-cell, so a displaced guest in its media zone should spill past
|
|
13
|
+
* the zone boundary instead of being cropped into a peek. Mirrors the existing
|
|
14
|
+
* `[data-rune="preview"]` / `[data-rune="juxtapose"]` / showcase-displace
|
|
15
|
+
* opt-outs in layouts/split.css — same intent, host-aware scope.
|
|
16
|
+
*
|
|
17
|
+
* Covers both routing paths of `frame-displace`:
|
|
18
|
+
* 1. host-on-media — `frame-displace` on the hero lands `data-displace` on
|
|
19
|
+
* the media-zone wrapper itself (the host's frame target is its media).
|
|
20
|
+
* 2. self on a child — a media-zone child rune carrying its own
|
|
21
|
+
* `frame-displace` ends up with `data-displace` on its root, so we still
|
|
22
|
+
* need `:has(> [data-displace])` for that case. */
|
|
23
|
+
.rf-hero > [data-section="media"]:is([data-displace], :has(> [data-displace])) {
|
|
24
|
+
overflow: visible;
|
|
25
|
+
container-type: normal;
|
|
26
|
+
}
|
|
27
|
+
/* Note: unlike the showcase/preview/juxtapose opt-outs in layouts/split.css,
|
|
28
|
+
* we deliberately keep the default `width: 100%` / `max-height: 100%` on the
|
|
29
|
+
* guest — a codegroup or sandbox in a hero should still fill the hero's
|
|
30
|
+
* width; the unclip is only about letting it overflow vertically. */
|
|
31
|
+
|
|
11
32
|
.rf-hero__preamble {
|
|
12
33
|
flex-direction: column;
|
|
13
34
|
align-items: center;
|
package/styles/runes/sandbox.css
CHANGED
|
@@ -3,6 +3,13 @@
|
|
|
3
3
|
* glyph stay skin (Lumina's styles/runes/sandbox.css). */
|
|
4
4
|
|
|
5
5
|
.rf-sandbox { overflow: hidden; }
|
|
6
|
+
/* `height="fill"` pins the iframe to 100% of its host (SPEC-101) — so the host
|
|
7
|
+
* itself needs to claim 100% of its container's height for the iframe's 100%
|
|
8
|
+
* to mean anything. Without this the iframe collapses to the 150px fallback
|
|
9
|
+
* because the auto-height host has no definite height to fill against. */
|
|
10
|
+
.rf-sandbox[data-height="fill"] {
|
|
11
|
+
height: 100%;
|
|
12
|
+
}
|
|
6
13
|
.rf-sandbox iframe {
|
|
7
14
|
display: block;
|
|
8
15
|
width: 100%;
|