@s_and_a/arrow-ui-design-remix 0.1.8 → 0.1.11
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/dist/covers.generated.d.ts +20 -18
- package/dist/covers.generated.js +20 -18
- package/package.json +2 -2
- package/src/parts/ArAffix.css +6 -0
- package/src/parts/ArAlert.css +3 -0
- package/src/parts/ArAnchor.css +1 -1
- package/src/parts/ArAppHeader.css +3 -2
- package/src/parts/ArApprovalFlow.css +8 -1
- package/src/parts/ArAuthPanel.css +5 -1
- package/src/parts/ArButton.css +14 -1
- package/src/parts/ArCalendar.css +2 -1
- package/src/parts/ArCard.css +24 -11
- package/src/parts/ArChangedValue.css +7 -0
- package/src/parts/ArChoiceCard.css +1 -0
- package/src/parts/ArCollapse.css +3 -0
- package/src/parts/ArDescriptions.css +8 -0
- package/src/parts/ArDocumentBlock.css +2 -0
- package/src/parts/ArDropdown.css +12 -2
- package/src/parts/ArField.css +9 -4
- package/src/parts/ArFlagGroup.css +4 -2
- package/src/parts/ArImage.css +4 -1
- package/src/parts/ArItem.css +9 -0
- package/src/parts/ArKanaInput.css +4 -4
- package/src/parts/ArList.css +2 -2
- package/src/parts/ArMenu.css +3 -1
- package/src/parts/ArModal.css +21 -3
- package/src/parts/ArPageHeading.css +1 -1
- package/src/parts/ArParagraph.css +1 -1
- package/src/parts/ArPayslip.css +10 -2
- package/src/parts/ArProfileCard.css +7 -4
- package/src/parts/ArPunchPanel.css +3 -1
- package/src/parts/ArRichTextEditor.css +1 -1
- package/src/parts/ArSaveBar.css +11 -0
- package/src/parts/ArSectionMenu.css +3 -1
- package/src/parts/ArSegmented.css +7 -0
- package/src/parts/ArStatistic.css +1 -0
- package/src/parts/ArSteps.css +1 -0
- package/src/parts/ArTable.css +21 -18
- package/src/parts/ArTableHeader.css +1 -1
- package/src/parts/ArThumbnail.css +1 -1
- package/src/parts/ArTimeInput.css +1 -1
- package/src/parts/ArTreeSelect.css +1 -1
- package/src/parts/ArUpload.css +2 -4
- package/src/parts/ArWizard.css +13 -1
- package/src/parts/ArZipInput.css +1 -1
- package/src/parts/_choice.css +2 -2
- package/src/parts/_product.css +97 -1
package/src/parts/ArImage.css
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
[data-ar-design="remix"] [data-ar="image"][data-part="root"]>[data-part="mask"]{gap:6px;background:rgba(31,41,51,.45);color:#fff;font:600 12.5px/1.5 var(--ar-font-family)}
|
|
8
8
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="scrim"]{background:rgba(31,41,51,.82);animation:ar-image-fade .2s ease-out}
|
|
9
9
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="stage"]{padding:64px 32px 96px}
|
|
10
|
-
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="stage"]>[data-part="picture"]{border-radius:12px;box-shadow:0 24px 60px rgba(15,23,32,.4);animation:ar-image-fade .2s ease-out}
|
|
10
|
+
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="stage"]>[data-part="picture"]{background:var(--ar-color-surface);border-radius:12px;box-shadow:0 24px 60px rgba(15,23,32,.4);animation:ar-image-fade .2s ease-out}
|
|
11
11
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="close"]{top:20px;right:20px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;transition:background var(--ar-motion-fast)}
|
|
12
12
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="toolbar"]{bottom:28px;gap:2px;padding:4px;border-radius:12px;background:rgba(255,255,255,.14);color:#fff}
|
|
13
13
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="toolbar"]>:is([data-part="tool"],[data-part="scale"]){height:34px;min-width:34px;border:0;border-radius:9px;background:none;color:#fff;font:600 12.5px/1 var(--ar-font-family);font-variant-numeric:tabular-nums;transition:background var(--ar-motion-fast)}
|
|
@@ -15,3 +15,6 @@
|
|
|
15
15
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>:is([data-part="close"],[data-part="toolbar"]>[data-part="tool"],[data-part="toolbar"]>[data-part="scale"]):hover:not(:disabled){background:rgba(255,255,255,.22)}
|
|
16
16
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>[data-part="toolbar"]>[data-part="tool"]:disabled{opacity:.4}
|
|
17
17
|
[data-ar-design="remix"] [data-ar="image"][data-part="viewer"]>:is([data-part="close"],[data-part="toolbar"]>[data-part="tool"],[data-part="toolbar"]>[data-part="scale"]):focus-visible{outline:0;box-shadow:0 0 0 3px rgba(255,255,255,.5)}@keyframes ar-image-fade{from{opacity:0}to{opacity:1}}
|
|
18
|
+
/* Reserve a footer for document previews so the action never covers a field in the image. */
|
|
19
|
+
[data-ar-design="remix"] [data-ar="image"][data-part="root"][data-fit="contain"][data-state~="previewable"]{padding-bottom:36px}
|
|
20
|
+
[data-ar-design="remix"] [data-ar="image"][data-part="root"][data-fit="contain"]>[data-part="mask"]{inset:auto 0 0;height:36px;box-sizing:border-box;padding:5px 8px;border-top:1px solid var(--ar-color-border);background:var(--ar-accent-subtle);color:var(--ar-accent-ink);opacity:1}
|
package/src/parts/ArItem.css
CHANGED
|
@@ -44,3 +44,12 @@
|
|
|
44
44
|
[data-ar-design="remix"] [data-ar="item"][data-variant="row"]>[data-part="content"]>[data-part="info"]>[data-part="detail"]>[data-ar="icon"]{width:15px;height:15px}
|
|
45
45
|
[data-ar-design="remix"] [data-ar="item"]>[data-part="aside"]{gap:4px;padding-top:6px}
|
|
46
46
|
[data-ar-design="remix"] [data-ar="item"]>[data-part="aside"]>[data-part="changed"]{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:11px;background:var(--ar-accent-subtle);color:var(--ar-accent-ink);font-size:12px;font-weight:700;line-height:18px;white-space:nowrap}@media (max-width:768px){[data-ar-design="remix"] [data-ar="item"][data-variant="row"]{gap:8px;padding:14px 4px}[data-ar-design="remix"] [data-ar="item"][data-variant="row"]>[data-part="title"]{padding-top:0}[data-ar-design="remix"] [data-ar="item"]>[data-part="aside"]{padding-top:0}}
|
|
47
|
+
|
|
48
|
+
/* An explicit Stack gap owns spacing between its direct form rows. */
|
|
49
|
+
[data-ar-design="remix"] [data-ar="stack"]:not([data-gap="0"])>[data-ar="item"]{margin-bottom:0}
|
|
50
|
+
|
|
51
|
+
/* Labels follow the first control line, even when the value spans several lines. */
|
|
52
|
+
[data-ar-design="remix"] [data-ar="item"]>[data-part="title"]{align-self:start;height:fit-content;align-content:flex-start}
|
|
53
|
+
[data-ar-design="remix"] [data-ar="item"]>[data-part="content"]>[data-part="info"]{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;white-space:normal}
|
|
54
|
+
[data-ar-design="remix"] [data-ar="item"]>[data-part="content"]>[data-part="info"]>[data-part="info-text"]{white-space:pre-wrap}
|
|
55
|
+
[data-ar-design="remix"] [data-ar="item"]>[data-part="content"]>[data-part="info"]>[data-part="detail"]{display:inline-flex;align-items:center;align-self:baseline;gap:3px;margin:0;line-height:inherit;white-space:nowrap}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/* @covers ArKanaInput 1.0.0, ArKanaText 1.0.0 */
|
|
2
|
-
/*
|
|
3
|
-
[data-ar-design="remix"] [data-ar="kana-input"]{gap:8px}
|
|
4
|
-
[data-ar-design="remix"] [data-ar="kana-input"]>[data-part="row"]{gap:8px}
|
|
5
|
-
[data-ar-design="remix"] [data-ar="kana-input"]>[data-part="row"]>[data-ar="text-input"]{width:
|
|
2
|
+
/* 氏名とフリガナ:姓・名を8空けて並べ、狭い列では均等に縮める。下にセイ・メイ。フリガナの行は少し低く・小さく */
|
|
3
|
+
[data-ar-design="remix"] [data-ar="kana-input"]{gap:8px;width:308px;max-width:100%;min-width:0}
|
|
4
|
+
[data-ar-design="remix"] [data-ar="kana-input"]>[data-part="row"]{gap:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
|
|
5
|
+
[data-ar-design="remix"] [data-ar="kana-input"]>[data-part="row"]>[data-ar="text-input"]{width:100%;min-width:0}
|
|
6
6
|
[data-ar-design="remix"] [data-ar="kana-input"]>[data-part="row"][data-row="kana"]>[data-ar="text-input"]{height:34px;font-size:13px}
|
|
7
7
|
/* フリガナつきの氏名:名前の上に 10.5px の mute */
|
|
8
8
|
[data-ar-design="remix"] [data-ar="kana-text"]>[data-part="stack"]>[data-part="kana"]{font-size:10.5px;font-weight:600;line-height:1.3;letter-spacing:.04em;color:var(--ar-color-text-muted)}
|
package/src/parts/ArList.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArList 1.
|
|
1
|
+
/* @covers ArList 1.1.0 */
|
|
2
2
|
/* ArList(.ad-listy:角丸12・線、行は10/14の余白・12の間・区切りは line-2、名前 13.5 太字、説明 12px 灰色、操作は右。グループの見出しは acc-50 の地に acc-ink の 11.5px 太字) */
|
|
3
3
|
[data-ar-design="remix"] [data-ar="list"]{font-feature-settings:"palt" 1;color:var(--ar-color-text);font-size:13px;line-height:1.5}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="list"][data-bordered]{border-radius:12px;box-shadow:inset 0 0 0 1px var(--ar-color-border);background:var(--ar-color-surface);overflow:hidden}
|
|
@@ -12,6 +12,6 @@
|
|
|
12
12
|
[data-ar-design="remix"] [data-ar="list"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"]>[data-part="meta"]>[data-part="title"]{font-size:13.5px;font-weight:700}
|
|
13
13
|
[data-ar-design="remix"] [data-ar="list"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"]>[data-part="meta"]>[data-part="description"]{font-size:12px;color:var(--ar-color-text-muted)}
|
|
14
14
|
[data-ar-design="remix"] [data-ar="list"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"]>[data-part="actions"]{gap:4px;color:var(--ar-accent-ink);font-size:12.5px;font-weight:600}
|
|
15
|
-
[data-ar-design="remix"] [data-ar="list"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"][data-state~="off"]>[data-part="meta"]{color:var(--ar-color-text-
|
|
15
|
+
[data-ar-design="remix"] [data-ar="list"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"][data-state~="off"]>[data-part="meta"]{color:var(--ar-color-text-muted)}
|
|
16
16
|
[data-ar-design="remix"] [data-ar="list"][data-size="sm"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"]{gap:10px;padding:7px 12px}
|
|
17
17
|
[data-ar-design="remix"] [data-ar="list"][data-size="sm"]>[data-part="viewport"]>[data-part="group"]>[data-part="items"]>[data-part="item"]>[data-part="meta"]>[data-part="title"]{font-size:13px}
|
package/src/parts/ArMenu.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArMenu 1.
|
|
1
|
+
/* @covers ArMenu 1.1.0 */
|
|
2
2
|
/* ArMenu:.ad-menu(inline・vertical)と .ad-hmenu(horizontal)。上の段の選択はテーマ色の塗り、子の選択は淡い面とテーマ色の文字。 */
|
|
3
3
|
[data-ar-design="remix"] [data-ar="menu"]{gap:2px;font-size:13.5px;line-height:1.5;color:var(--ar-color-text);font-feature-settings:"palt" 1}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="menu"][data-bordered]{padding:6px;background:#fff;border-radius:12px;box-shadow:inset 0 0 0 1px var(--ar-color-border)}
|
|
@@ -27,3 +27,5 @@
|
|
|
27
27
|
[data-ar-design="remix"] [data-ar="menu"][data-mode="horizontal"]>[data-part="item"]:is([data-state~="selected"],[data-state~="active"]){color:var(--ar-accent-ink);font-weight:700;border-bottom-color:var(--ar-accent)}
|
|
28
28
|
[data-ar-design="remix"] [data-ar="menu"][data-mode="horizontal"]>[data-part="item"]:is([data-state~="disabled"],[data-state~="locked"]){color:var(--ar-color-text-faint)}
|
|
29
29
|
[data-ar-design="remix"] [data-ar="menu"][data-mode="horizontal"]>[data-part="item"]:focus-visible{box-shadow:inset 0 0 0 2px var(--ar-accent);border-radius:6px 6px 0 0}
|
|
30
|
+
|
|
31
|
+
[data-ar-design="remix"] [data-ar="menu"]>[data-part="item"][data-tone="edit"]{color:#206C49}
|
package/src/parts/ArModal.css
CHANGED
|
@@ -12,9 +12,6 @@
|
|
|
12
12
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="warn"]{color:#E39A2D}
|
|
13
13
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="danger"]{color:var(--ar-color-danger)}
|
|
14
14
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="ok"]{color:var(--ar-color-ok)}
|
|
15
|
-
/* 確かめ(confirm):説明は ink-2 寄りの13px、足は右寄せで左右16px */
|
|
16
|
-
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="heading"]>[data-part="description"]{margin-top:4px;line-height:1.6}
|
|
17
|
-
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="footer"]{padding:12px 16px}
|
|
18
15
|
/* 手順 .stpr(頭の下の行。左に切り替えなどを置ける) */
|
|
19
16
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="nav"]{gap:10px;padding:10px 22px;border-bottom:1px solid var(--ar-color-border)}
|
|
20
17
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="nav"][data-toolbar]{padding:12px 22px}
|
|
@@ -31,6 +28,8 @@
|
|
|
31
28
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="nav"]>[data-part="steps"]>[data-part="step"][data-state="done"]>[data-part="step-label"]>[data-part="step-mark"]{background:var(--ar-color-ok);color:#fff}
|
|
32
29
|
/* 中身 .mb・足 .mf */
|
|
33
30
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="body"]{display:flex;flex-direction:column;gap:16px;padding:18px 22px}
|
|
31
|
+
/* Preserve the natural height of tabs/forms; the body owns vertical scrolling. */
|
|
32
|
+
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="body"]>*{flex-shrink:0}
|
|
34
33
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="footer"]{gap:8px;padding:12px 22px;background:var(--ar-color-surface-alt);border-top:1px solid var(--ar-color-border)}
|
|
35
34
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-start"],[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]{gap:8px}
|
|
36
35
|
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]>[data-ok]{min-width:110px}
|
|
@@ -56,6 +55,9 @@
|
|
|
56
55
|
@media(max-width:640px){
|
|
57
56
|
[data-ar-design="remix"] [data-ar="modal"][data-variant="default"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]{flex:1}
|
|
58
57
|
[data-ar-design="remix"] [data-ar="modal"][data-variant="default"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]>[data-ar="button"]{flex:1}
|
|
58
|
+
/* ArClusterで操作をまとめても、直接置いたボタンと同じ押しやすい幅にする。補足や別の入力を含むclusterには適用しない。 */
|
|
59
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="default"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]>[data-ar="cluster"]:only-child:not(:has(>:not([data-ar="button"]))){flex:1}
|
|
60
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="default"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]>[data-ar="cluster"]:only-child:not(:has(>:not([data-ar="button"])))>[data-ar="button"]{flex:1}
|
|
59
61
|
}
|
|
60
62
|
|
|
61
63
|
/* Supplemental information remains readable on mobile; actions occupy their own row. */
|
|
@@ -64,3 +66,19 @@
|
|
|
64
66
|
[data-ar-design="remix"] [data-ar="modal"][data-mobile="fullscreen"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-start"]:has([data-part="note"]){flex-basis:100%}
|
|
65
67
|
[data-ar-design="remix"] [data-ar="modal"][data-mobile="fullscreen"]>[data-part="panel"]>[data-part="footer"]>[data-part="footer-end"]>[data-part="note"]{flex-basis:100%}
|
|
66
68
|
}
|
|
69
|
+
|
|
70
|
+
/* 確認:共通デザイン原稿の一枚のカード。入力フォームの帯・区切り線を使わない。 */
|
|
71
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]{flex-direction:column;align-items:flex-start;gap:12px;padding:22px 22px 12px;border:0}
|
|
72
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"]{align-items:center;justify-content:center;width:36px;height:36px;margin:0;border-radius:10px;background:var(--ar-accent-subtle)}
|
|
73
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="warn"]{background:color-mix(in srgb,#E39A2D 10%,var(--ar-color-surface))}
|
|
74
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="danger"]{background:color-mix(in srgb,var(--ar-color-danger) 10%,var(--ar-color-surface))}
|
|
75
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="icon"][data-tone="ok"]{background:color-mix(in srgb,var(--ar-color-ok) 10%,var(--ar-color-surface))}
|
|
76
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="heading"]>[data-part="title"]{font-size:16px;line-height:1.5}
|
|
77
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="header"]>[data-part="heading"]>[data-part="description"]{margin-top:8px;line-height:1.6}
|
|
78
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="body"]{padding:0 22px 16px;font-size:13px;line-height:1.6}
|
|
79
|
+
[data-ar-design="remix"] [data-ar="modal"][data-variant="confirm"]>[data-part="panel"]>[data-part="footer"]{padding:4px 22px 20px;background:var(--ar-color-surface);border:0}
|
|
80
|
+
|
|
81
|
+
@media(max-width:640px){
|
|
82
|
+
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="nav"]>[data-part="steps"]{gap:8px}
|
|
83
|
+
[data-ar-design="remix"] [data-ar="modal"]>[data-part="panel"]>[data-part="nav"]>[data-part="steps"]>[data-part="step"]{font-size:11px;line-height:1.4}
|
|
84
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* @covers ArPageHeading 1.0.0 */
|
|
2
2
|
[data-ar-design="remix"] [data-ar="page-heading"]{font-family:var(--ar-font-family);font-size:18px;font-weight:700;line-height:1.5;letter-spacing:.08em}
|
|
3
|
-
[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]{min-height:54px;padding:12px 18px;color:var(--ar-on-accent);background:linear-gradient(120deg,var(--ar-accent-hi),var(--ar-accent) 45%,var(--ar-accent-strong));border-radius:18px 18px 0 0;overflow:hidden;text-shadow:var(--ar-on-accent-shadow)}
|
|
3
|
+
[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]{min-height:54px;padding:12px 18px;justify-content:flex-start;text-align:left;color:var(--ar-on-accent);background:linear-gradient(120deg,var(--ar-accent-hi),var(--ar-accent) 45%,var(--ar-accent-strong));border-radius:18px 18px 0 0;overflow:hidden;text-shadow:var(--ar-on-accent-shadow)}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]::before,[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
|
|
5
5
|
[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]::before{right:-30px;top:-46px;width:150px;height:150px;background:rgba(255,255,255,.1)}
|
|
6
6
|
[data-ar-design="remix"] [data-ar="page-heading"][data-type="bar"]::after{left:-40px;bottom:-70px;width:140px;height:140px;background:rgba(255,255,255,.07)}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArParagraph 1.
|
|
1
|
+
/* @covers ArParagraph 1.1.0 */
|
|
2
2
|
/* ArParagraph:本文 13.5px・行の高さ1.75・ink */
|
|
3
3
|
[data-ar-design="remix"] [data-ar="paragraph"]{margin:0;font-size:13.5px;line-height:1.75;color:var(--ar-color-text);font-feature-settings:"palt" 1}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="paragraph"][data-size="sm"]{font-size:12.5px;line-height:1.6}
|
package/src/parts/ArPayslip.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArPayslip 1.0.0 */
|
|
1
|
+
/* @covers ArPayslip 1.1.0, ArPayslipTable 1.0.0, ArPayslipLine 1.0.0 */
|
|
2
2
|
/* ArPayslip(マイページ・給与賞与報酬の明細書:白い紙・角丸14・線と下の1px・padding 18・間14。見出しは 20px/700・字間.1em、下にテーマ色の2pxの線。
|
|
3
3
|
表(.lst)は角丸12・線、頭は acc-50 の地に acc-ink の 11.5px/700。行は高さ38・名前 12.5px ink-2・値は太字の数字。合計の行は acc-25 の地。下の箱(.stat)は角丸12・線・名前11.5px・値15px(差引支給額は22px と acc-50 の地)) */
|
|
4
4
|
[data-ar-design="remix"] [data-ar="payslip"]{gap:14px;padding:18px;border-radius:14px;background:#FFFFFF;box-shadow:inset 0 0 0 1px var(--ar-color-border),0 1px 0 var(--ar-color-border);color:var(--ar-color-text);font-family:var(--ar-font-family);font-size:13px;line-height:1.5}
|
|
@@ -51,6 +51,14 @@
|
|
|
51
51
|
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]>[data-part="total"]>dd>[data-part="diff"][data-sign="zero"]{color:var(--ar-color-text-muted)}
|
|
52
52
|
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]>[data-part="total"][data-state~="emphasis"]{background:var(--ar-accent-subtle)}
|
|
53
53
|
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]>[data-part="total"][data-state~="emphasis"]>dd{font-size:22px}
|
|
54
|
-
@media (max-width:767px){[data-ar-design="remix"] [data-ar="payslip"]{padding:14px 12px}
|
|
54
|
+
@media (max-width:767px){[data-ar-design="remix"] [data-ar="payslip"]{padding:14px 12px}}
|
|
55
55
|
|
|
56
56
|
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]{grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr))}
|
|
57
|
+
/* 狭い明細は見出し→合計→内訳。画面幅ではなく配置先の幅を基準にする。 */
|
|
58
|
+
@container ar-payslip (max-width:599px){
|
|
59
|
+
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]{order:1;grid-template-columns:repeat(2,minmax(0,1fr))}
|
|
60
|
+
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="columns"]{order:2}
|
|
61
|
+
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]>[data-part="total"]{min-width:0;overflow-wrap:anywhere}
|
|
62
|
+
[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]>[data-part="total"][data-state~="emphasis"]>dd{font-size:18px}
|
|
63
|
+
}
|
|
64
|
+
@container ar-payslip (max-width:259px){[data-ar-design="remix"] [data-ar="payslip"]>[data-part="totals"]{grid-template-columns:minmax(0,1fr)}}
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
height: 40px;
|
|
11
11
|
font-size: 16px;
|
|
12
12
|
}
|
|
13
|
-
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"] > [data-part="list"] {
|
|
13
|
+
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"][data-variant][data-layout] > [data-part="list"] {
|
|
14
14
|
display: flex;
|
|
15
15
|
flex-wrap: wrap;
|
|
16
16
|
gap: 6px 8px;
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
background: transparent;
|
|
20
20
|
overflow: visible;
|
|
21
21
|
}
|
|
22
|
-
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"] > [data-part="list"] > [data-part="item"] {
|
|
22
|
+
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"][data-variant][data-layout] > [data-part="list"] > [data-part="item"] {
|
|
23
23
|
display: flex;
|
|
24
24
|
align-items: baseline;
|
|
25
25
|
gap: 6px;
|
|
@@ -29,12 +29,15 @@
|
|
|
29
29
|
border-radius: 6px;
|
|
30
30
|
background: var(--ar-color-surface-alt);
|
|
31
31
|
}
|
|
32
|
-
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"] > [data-part="list"] > [data-part="item"] > :is([data-part="label"], [data-part="value"]) {
|
|
32
|
+
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"][data-variant][data-layout] > [data-part="list"] > [data-part="item"] > :is([data-part="label"], [data-part="value"]) {
|
|
33
33
|
padding: 0;
|
|
34
34
|
border: 0;
|
|
35
35
|
background: transparent;
|
|
36
36
|
}
|
|
37
|
-
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"] > [data-part="list"] > [data-part="item"] > [data-part="label"] {
|
|
37
|
+
[data-ar-design="remix"] [data-ar="profile-card"] [data-ar="descriptions"][data-variant][data-layout] > [data-part="list"] > [data-part="item"] > [data-part="label"] {
|
|
38
38
|
flex: none;
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
|
+
|
|
42
|
+
[data-ar-design="remix"] [data-ar="profile-card"][data-layout="compact"] [data-part="name"]{font-size:18px}
|
|
43
|
+
[data-ar-design="remix"] [data-ar="profile-card"][data-layout="compact"] [data-ar="descriptions"]>[data-part="list"]>[data-part="item"]{padding:4px 8px;border-radius:6px;background:var(--ar-color-surface-alt)}
|
|
@@ -1,2 +1,4 @@
|
|
|
1
|
-
/* @covers ArPunchPanel 1.
|
|
1
|
+
/* @covers ArPunchPanel 1.1.0 */
|
|
2
2
|
[data-ar-design="remix"] [data-ar="punch-panel"] [data-part="clock"]{font-size:clamp(22px,4vw,42px);font-weight:800;line-height:1.5;color:var(--ar-color-text)}
|
|
3
|
+
[data-ar-design="remix"] [data-ar="punch-panel"][data-date-separated="true"] [data-part="clock"]{font-size:clamp(36px,6vw,52px);line-height:1.1}
|
|
4
|
+
[data-ar-design="remix"] [data-ar="punch-panel"] [data-part="date"]{font-size:13px;font-weight:600;color:var(--ar-color-text)}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArRichTextEditor 1.
|
|
1
|
+
/* @covers ArRichTextEditor 1.1.0 */
|
|
2
2
|
/* ArRichTextEditor:書類集計キャンバスの自作書類の編集(.edw 角丸12・field の内側の線、.tbar #F8FAFC の段 6px 8px と下線、.tb 高さ32 角丸8 700 12.5px・乗せると白、
|
|
3
3
|
.tb.av テーマ色の塗り、.tsep 1×20、.edbody #E9EDF1 の地 18px、.pdfs 白い紙 560px 40px 44px・明朝 11.5px・表の線 #888、.vv 変数の札、.edft 下の段 12px)と、
|
|
4
4
|
通知キャンバスのメールテンプレートの編集(線 #E6EBF0 の枠・30px の「ARROW 差し込み項目」・.v-ib 30px の元に戻す・右端の「194文字」・本文 500 13.5px 行1.9 の 14px 16px)。 */
|
package/src/parts/ArSaveBar.css
CHANGED
|
@@ -8,3 +8,14 @@
|
|
|
8
8
|
[data-ar-design="remix"] [data-ar="save-bar"]>[data-ar="button"][data-tone="danger-subtle"]{background:var(--ar-color-danger-subtle);box-shadow:inset 0 0 0 1px var(--ar-color-border)}
|
|
9
9
|
[data-ar-design="remix"] [data-ar="save-bar"]>[data-ar="button"][data-tone="danger-subtle"]:hover:not(:disabled){background:#F9DEDC}
|
|
10
10
|
[data-ar-design="remix"] [data-ar="save-bar"][data-size="sm"]{padding:10px 10px 10px 12px}
|
|
11
|
+
|
|
12
|
+
/* ARROW page actions clear the fixed mobile navigation (the product shell supplies the dock offset). */
|
|
13
|
+
html[data-ar-design="remix"] .menu_layout [data-ar="save-bar"][data-sticky]{bottom:var(--arrow-floating-bottom,16px)}
|
|
14
|
+
|
|
15
|
+
/* Leave the desktop help dock outside the action hit targets, even at the page end. */
|
|
16
|
+
@media (min-width:960px){html[data-ar-design="remix"] .menu_layout [data-ar="save-bar"][data-sticky]{padding-inline-end:76px}}
|
|
17
|
+
|
|
18
|
+
/* Keep action words together; a narrow container wraps whole buttons instead. */
|
|
19
|
+
@container ar-save-bar (max-width:480px){
|
|
20
|
+
[data-ar-design="remix"] [data-ar="save-bar"]>[data-ar="button"]{flex:1 0 auto;min-height:40px;padding-inline:10px;font-size:12.5px}
|
|
21
|
+
}
|
|
@@ -1,2 +1,4 @@
|
|
|
1
|
-
/* @covers ArSectionMenu 1.
|
|
1
|
+
/* @covers ArSectionMenu 1.1.0 */
|
|
2
2
|
/* Composed from the active design’s public controls. */
|
|
3
|
+
|
|
4
|
+
[data-ar-design="remix"] [data-ar="section-menu"] > [data-part="navigation"] [data-ar="menu"][data-mode="inline"] > [data-part="item"]{height:auto;min-height:38px;line-height:1.5;padding-top:8px;padding-bottom:8px}
|
|
@@ -19,3 +19,10 @@
|
|
|
19
19
|
/* 件数の丸は ArBadge(テーマ色の塗り。warn・danger・neutral は淡い地。18・角丸9・11px 700)。文字との間 5px、押せないときは灰の塗り */
|
|
20
20
|
[data-ar-design="remix"] [data-ar="segmented"]>[data-part="item"]>[data-part="count"]{margin-left:-1px}
|
|
21
21
|
[data-ar-design="remix"] [data-ar="segmented"]>[data-part="item"]:disabled>[data-part="count"]>[data-part="count"]{background:var(--ar-color-text-faint);color:#fff}
|
|
22
|
+
|
|
23
|
+
/* Match size-rule specificity so wrapped labels can increase the row height.
|
|
24
|
+
Compact full-width filters reserve space for short labels and count badges. */
|
|
25
|
+
[data-ar-design="remix"] [data-ar="segmented"][data-block][data-size]>[data-part="item"]{height:auto;min-height:30px;padding-block:4px;white-space:normal;line-height:1.3}
|
|
26
|
+
[data-ar-design="remix"] [data-ar="segmented"][data-block][data-size="sm"]>[data-part="item"]{min-height:24px;padding-inline:6px;gap:4px}
|
|
27
|
+
[data-ar-design="remix"] [data-ar="segmented"][data-block][data-size="lg"]>[data-part="item"]{min-height:36px}
|
|
28
|
+
[data-ar-design="remix"] [data-ar="segmented"][data-block]>[data-part="item"]>[data-part="label"]{min-width:0;overflow-wrap:anywhere}
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
[data-ar-design="remix"] [data-ar="statistic"]>[data-part="content"]>[data-part="trend"]{font-size:14px;line-height:1.5}
|
|
9
9
|
[data-ar-design="remix"] [data-ar="statistic"]>[data-part="content"]>[data-part="trend"][data-trend="up"]{color:var(--ar-color-ok)}
|
|
10
10
|
[data-ar-design="remix"] [data-ar="statistic"]>[data-part="content"]>[data-part="trend"][data-trend="down"]{color:var(--ar-color-danger-ink)}
|
|
11
|
+
[data-ar-design="remix"] [data-ar="statistic"]>[data-part="content"]>[data-part="trend"]:is([data-tone="neutral"],[data-trend="flat"]){color:var(--ar-color-text-secondary)}
|
|
11
12
|
[data-ar-design="remix"] [data-ar="statistic"]>[data-part="content"]>[data-part="trend"]>[data-ar="icon"]{width:15px;height:15px}
|
|
12
13
|
[data-ar-design="remix"] [data-ar="statistic"][data-tone="ok"]>[data-part="content"]{color:var(--ar-color-ok)}
|
|
13
14
|
[data-ar-design="remix"] [data-ar="statistic"][data-tone="warn"]>[data-part="content"]{color:var(--ar-color-warn)}
|
package/src/parts/ArSteps.css
CHANGED
|
@@ -20,6 +20,7 @@
|
|
|
20
20
|
[data-ar-design="remix"] [data-ar="steps"]>[data-part="step"]>[data-part="body"]:focus-visible{outline:0;box-shadow:0 0 0 3px var(--ar-accent-ring);border-radius:8px}
|
|
21
21
|
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"]{gap:8px}
|
|
22
22
|
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"]>[data-part="connector"]{width:18px;height:1px;background:var(--ar-color-border)}
|
|
23
|
+
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"][data-compact] [data-part="title"]{font-size:12px;line-height:1.5}
|
|
23
24
|
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"]>[data-part="step"]>[data-part="body"]{gap:7px;font-size:13px;font-weight:600;color:var(--ar-color-text-muted)}
|
|
24
25
|
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"]>[data-part="step"]>[data-part="body"]>[data-part="icon"]{width:24px;height:24px;border-radius:50%;background:#EEF1F5;color:var(--ar-color-text-secondary);font-size:12px}
|
|
25
26
|
[data-ar-design="remix"] [data-ar="steps"][data-size="mini"]>[data-part="step"]:is([data-status="process"],[data-status="finish"],[data-status="error"])>[data-part="body"]{color:var(--ar-color-text)}
|
package/src/parts/ArTable.css
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
/* @covers ArTable 1.
|
|
1
|
+
/* @covers ArTable 1.6.0 */
|
|
2
2
|
/* ArTable(box=.lst/.lr:外枠 角丸12・線、見出し34・行44。board=シフト画面の .v-tr:外枠なし、角の丸い見出し・行50・合計の帯) */
|
|
3
3
|
[data-ar-design="remix"] [data-ar="table"]{font-feature-settings:"palt" 1;color:var(--ar-color-text);font-size:13px;line-height:1.5}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="table"]>[data-part="viewport"]:focus-visible{outline:2px solid var(--ar-accent);outline-offset:2px}
|
|
5
|
-
[data-ar-design="remix"] [data-ar="table"] [data-part="header-cell"]{padding:0
|
|
5
|
+
[data-ar-design="remix"] [data-ar="table"] [data-part="header-cell"]{padding:0 8px;background:var(--ar-accent-subtle);color:var(--ar-accent-ink);font-size:11.5px;font-weight:700;letter-spacing:.04em;line-height:1.5;white-space:nowrap;border-bottom:1px solid var(--ar-color-border-subtle)}
|
|
6
6
|
[data-ar-design="remix"] [data-ar="table"] thead[data-part="head"]>tr{height:34px}
|
|
7
7
|
[data-ar-design="remix"] [data-ar="table"] :is(tbody[data-part="body"]>tr[data-part="row"],tfoot[data-part="foot"]>tr){height:44px}
|
|
8
|
-
[data-ar-design="remix"] [data-ar="table"] [data-part="cell"]{padding:
|
|
8
|
+
[data-ar-design="remix"] [data-ar="table"] [data-part="cell"]{padding:4px 8px;border-bottom:1px solid var(--ar-color-border-subtle);font-variant-numeric:tabular-nums}
|
|
9
9
|
[data-ar-design="remix"] [data-ar="table"] :is([data-part="header-cell"],[data-part="cell"]):first-child{padding-left:12px}
|
|
10
10
|
[data-ar-design="remix"] [data-ar="table"] :is([data-part="header-cell"],[data-part="cell"]):last-child{padding-right:12px}
|
|
11
11
|
[data-ar-design="remix"] [data-ar="table"] :is([data-part="header-cell"],[data-part="cell"])[data-col="select"]{width:18px;box-sizing:content-box}
|
|
@@ -28,12 +28,12 @@
|
|
|
28
28
|
[data-ar-design="remix"] [data-ar="table"] [data-part="row"][data-state~="off"]>td [data-part="name"]>b{color:var(--ar-color-text-faint)}
|
|
29
29
|
|
|
30
30
|
/* 名前の列:頭文字の丸+名前(+小さな説明) */
|
|
31
|
-
[data-ar-design="remix"] [data-ar="table"] td
|
|
32
|
-
[data-ar-design="remix"] [data-ar="table"] td
|
|
33
|
-
[data-ar-design="remix"] [data-ar="table"] td
|
|
34
|
-
[data-ar-design="remix"] [data-ar="table"] td
|
|
35
|
-
[data-ar-design="remix"] [data-ar="table"] td
|
|
36
|
-
[data-ar-design="remix"] [data-ar="table"] td>[data-part="actions"]{gap:
|
|
31
|
+
[data-ar-design="remix"] [data-ar="table"] td [data-part="person"]{gap:10px}
|
|
32
|
+
[data-ar-design="remix"] [data-ar="table"] td [data-part="person"]>[data-part="name"]>b{font-weight:600;color:var(--ar-color-text)}
|
|
33
|
+
[data-ar-design="remix"] [data-ar="table"] td [data-part="person"]>[data-part="name"]>[data-part="sub"]{font-size:11px;line-height:1.5;color:var(--ar-color-text-muted)}
|
|
34
|
+
[data-ar-design="remix"] [data-ar="table"] td [data-part="person"]>[data-part="name"]>[data-part="sub"]{gap:4px}
|
|
35
|
+
[data-ar-design="remix"] [data-ar="table"] td [data-part="person"]>[data-part="name"]>[data-part="sub"]>[data-part="sub-mark"]{width:7px;height:7px;border-radius:2px}
|
|
36
|
+
[data-ar-design="remix"] [data-ar="table"] td>[data-part="actions"]{gap:8px}
|
|
37
37
|
|
|
38
38
|
/* 並べ替えの印(上下の山。いま並べている向きだけ濃く) */
|
|
39
39
|
[data-ar-design="remix"] [data-ar="table"] th>[data-part="sort"]{gap:2px;color:inherit;font:inherit;letter-spacing:inherit;border-radius:4px}
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="header-cell"]:first-child{border-radius:10px 0 0 10px}
|
|
82
82
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="header-cell"]:last-child{border-radius:0 10px 10px 0}
|
|
83
83
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tbody[data-part="body"]>tr[data-part="row"]{height:50px}
|
|
84
|
-
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="cell"]{padding:
|
|
84
|
+
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="cell"]{padding:4px 8px}
|
|
85
85
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] :is([data-part="header-cell"],[data-part="cell"]):first-child{padding-left:8px}
|
|
86
86
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] :is([data-part="header-cell"],[data-part="cell"]):last-child{padding-right:8px}
|
|
87
87
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="row"]:hover>td{background:#FAFBFD}
|
|
@@ -90,8 +90,8 @@
|
|
|
90
90
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td>[data-part="lines"]{line-height:1.45}
|
|
91
91
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="cell"][data-emphasis="muted"]{font-size:13.5px}
|
|
92
92
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] [data-part="cell"][data-blank]{color:var(--ar-color-text)}
|
|
93
|
-
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td
|
|
94
|
-
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td
|
|
93
|
+
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td [data-part="person"]{gap:10px}
|
|
94
|
+
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td [data-part="person"]>[data-part="name"]>b{font-weight:700}
|
|
95
95
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tfoot[data-part="foot"]::before{content:"";display:table-row;height:6px}
|
|
96
96
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tfoot[data-part="foot"] [data-part="cell"]{background:#F7F9FB;border-top:0}
|
|
97
97
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tfoot[data-part="foot"]>tr{height:54px}
|
|
@@ -102,8 +102,8 @@
|
|
|
102
102
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td[data-part="empty"]{border-bottom:1px solid var(--ar-color-border-subtle)}
|
|
103
103
|
/* board の名前だけの列(勤務可能な人):丸は 28px・12px、間8px、名前はさらに太く。見出しは左に 12px。 */
|
|
104
104
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] th[data-person="single"]:first-child{padding-left:12px}
|
|
105
|
-
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td
|
|
106
|
-
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td
|
|
105
|
+
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td [data-part="person"][data-single]{gap:10px}
|
|
106
|
+
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td [data-part="person"][data-single]>[data-part="name"]>b{font-weight:900}
|
|
107
107
|
/* board の行の右端の操作:上にそろえ、文字のボタン(「シフトに入れる」)とアイコンのボタンの間は 4px */
|
|
108
108
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td>[data-part="actions"]{align-items:flex-start}
|
|
109
109
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] td>[data-part="actions"]>[data-ar="button"]:not([data-icon-only])+[data-ar="button"]{margin-left:2px}
|
|
@@ -159,11 +159,11 @@
|
|
|
159
159
|
[data-ar-design="remix"] [data-ar="table"] td>[data-part="delta"][data-tone="danger"]{color:var(--ar-color-danger-ink)}
|
|
160
160
|
[data-ar-design="remix"] [data-ar="table"] td>[data-part="mark"]{width:12px;height:12px;margin-left:3px;color:var(--ar-accent-ink)}
|
|
161
161
|
/* 上の行のセルがまたいでいる行では、行の最初・最後のセルが表の端の列ではない(端の余白を付けない) */
|
|
162
|
-
[data-ar-design="remix"] [data-ar="table"] tbody td[data-part="cell"]:not([data-col]):first-child:not([data-edge="first"]){padding-left:
|
|
163
|
-
[data-ar-design="remix"] [data-ar="table"] tbody td[data-part="cell"]:not([data-col]):last-child:not([data-edge="last"]){padding-right:
|
|
162
|
+
[data-ar-design="remix"] [data-ar="table"] tbody td[data-part="cell"]:not([data-col]):first-child:not([data-edge="first"]){padding-left:8px}
|
|
163
|
+
[data-ar-design="remix"] [data-ar="table"] tbody td[data-part="cell"]:not([data-col]):last-child:not([data-edge="last"]){padding-right:8px}
|
|
164
164
|
[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tbody td[data-part="cell"]:not([data-col]):first-child:not([data-edge="first"]),[data-ar-design="remix"] [data-ar="table"][data-variant="board"] tbody td[data-part="cell"]:not([data-col]):last-child:not([data-edge="last"]){padding-left:8px;padding-right:8px}
|
|
165
|
-
[data-ar-design="remix"] [data-ar="table"] thead tr[data-tier="2"]>th:first-child{padding-left:
|
|
166
|
-
[data-ar-design="remix"] [data-ar="table"] thead tr[data-tier="2"]>th:last-child{padding-right:
|
|
165
|
+
[data-ar-design="remix"] [data-ar="table"] thead tr[data-tier="2"]>th:first-child{padding-left:8px}
|
|
166
|
+
[data-ar-design="remix"] [data-ar="table"] thead tr[data-tier="2"]>th:last-child{padding-right:8px}
|
|
167
167
|
/* 1.2:段に分けた列(lines)。1つの行を段の数の tr に分け、段のない列は段をまたぐ。段の間に線を引かず、段は高さ38(中の時刻・選ぶの入力 32 が収まる。PopRecruitDays の日ごとの段)、最初と最後の段だけ上下に6の余白 */
|
|
168
168
|
[data-ar-design="remix"] [data-ar="table"] tbody[data-part="body"]>tr[data-part="row"][data-line]:not([data-line="0"][data-line-last]){height:38px}
|
|
169
169
|
[data-ar-design="remix"] [data-ar="table"] tr[data-part="row"][data-line]:not([data-line-last])>td[data-line-cell]{border-bottom:0}
|
|
@@ -194,3 +194,6 @@
|
|
|
194
194
|
[data-ar-design="remix"] [data-ar="table"] [data-part="cell"][data-wrap]{white-space:pre-wrap;overflow-wrap:anywhere;text-overflow:clip;line-height:1.6;padding-block:8px}
|
|
195
195
|
|
|
196
196
|
[data-ar-design="remix"] [data-ar="table"] [data-part="header-cell"][data-wrap]{white-space:normal;overflow-wrap:anywhere;padding-block:6px}
|
|
197
|
+
/* Empty messages stay inside the visible viewport of a horizontally scrollable table. */
|
|
198
|
+
[data-ar-design="remix"] [data-ar="table"]{container:ar-table / inline-size}
|
|
199
|
+
[data-ar-design="remix"] [data-ar="table"] td[data-part="empty"]>[data-ar="empty"]{position:sticky;left:12px;width:calc(100cqw - 24px);max-width:100%;box-sizing:border-box}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/* @covers ArTableHeader 1.0.0 */
|
|
2
|
-
[data-ar-design="remix"] [data-ar="table-header"]{background:var(--ar-accent-subtle);color:var(--ar-accent-ink);font-size:12px;font-weight:700;padding:10px 12px;border-bottom:1px solid var(--ar-color-border)}
|
|
2
|
+
[data-ar-design="remix"] [data-ar="table-header"]{background:var(--ar-accent-subtle);color:var(--ar-accent-ink);font-size:12px;font-weight:700;text-align:start;padding:10px 12px;border-bottom:1px solid var(--ar-color-border)}
|
|
3
3
|
[data-ar-design="remix"] [data-ar="table-header"] [data-part="sort"]{color:var(--ar-color-text-muted);opacity:.5}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="table-header"] [data-part="sort"][data-sort]{color:var(--ar-accent-ink);opacity:1}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArThumbnail 1.
|
|
1
|
+
/* @covers ArThumbnail 1.3.0 */
|
|
2
2
|
/* 顔写真:四角は角丸14・丸、写真がないときは淡い灰の面に人の形。カメラは右下の白い丸(32)にテーマ色の線 */
|
|
3
3
|
[data-ar-design="remix"] [data-ar="thumbnail"]>:is([data-part="image"],[data-part="silhouette"]){border-radius:14px;box-shadow:inset 0 0 0 1px rgba(31,41,51,.06)}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="thumbnail"]>[data-part="image"]{border:1px solid var(--ar-color-border)}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArTimeInput 1.1.0, ArTimeRange 1.
|
|
1
|
+
/* @covers ArTimeInput 1.1.0, ArTimeRange 1.3.0 */
|
|
2
2
|
/* ArTimeInput:.tin(枠 field・600 14px)。[当日]は #F1F4F7 の 700 11px、[前日]は橙。
|
|
3
3
|
大きさの段はほかの入力と同じ sm 30/md 36/lg 42・角丸 9/10/11(デザインシステムの .tin は 32/36/40・角丸9 だが、横に並べてそろえるため段に合わせた)。文字は .tin どおり 13/14/15px。 */
|
|
4
4
|
[data-ar-design="remix"] [data-ar="time-input"]{height:var(--ar-size-control-md);border:1px solid var(--ar-color-field);border-radius:10px;background:#fff;transition:border-color var(--ar-motion-fast),box-shadow var(--ar-motion-fast)}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArTreeSelect 1.
|
|
1
|
+
/* @covers ArTreeSelect 1.2.0 */
|
|
2
2
|
/* ArTreeSelect:押す所は ArSelect と同じ(ArSelect.css)。木(.ad-tree)は行30px・角丸7・間6・字下げ22px、開く印は18px幅の mute。
|
|
3
3
|
チェック(.chk)は18px・角丸5・枠 #AEB9C4、チェック・一部は テーマ色の塗りに白い印。1つ選ぶときの選んだ行は淡いテーマ色の太字。 */
|
|
4
4
|
[data-ar-design="remix"] [data-ar="tree-select-panel"]>[data-part="list"]>[data-part="node"]{gap:6px;height:30px;padding:0 8px 0 calc(var(--ar-tree-level,0) * 22px);border-radius:7px;font-size:13.5px;line-height:20.25px;color:var(--ar-color-text)}
|
package/src/parts/ArUpload.css
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
/* ArUpload:置き場 .ad-up(点線1.5 acc-line・角丸14・acc-25・余白22)、一覧 .ad-file(行34・角丸8・13px、名前は acc-ink)、
|
|
3
3
|
進み具合 .ad-bar(3px・テーマ色)、失敗は赤と理由、写真 .ad-upc(96px・点線 field・角丸12)。 */
|
|
4
4
|
[data-ar-design="remix"] [data-ar="upload"]{gap:12px 22px;font-feature-settings:"palt" 1}
|
|
5
|
-
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]{flex:
|
|
5
|
+
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]{flex:1 1 300px;gap:6px;padding:22px;border:1.5px dashed var(--ar-accent-line);border-radius:14px;background:var(--ar-accent-faint);font-size:13.5px;line-height:1.5;color:var(--ar-color-text-secondary);outline:0;transition:background var(--ar-motion-fast),border-color var(--ar-motion-fast),box-shadow var(--ar-motion-fast)}
|
|
6
6
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]:hover{background:var(--ar-accent-subtle)}
|
|
7
7
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]:focus-visible{box-shadow:0 0 0 3px var(--ar-accent-ring)}
|
|
8
8
|
[data-ar-design="remix"] [data-ar="upload"][data-state~="dragover"]>[data-part="drop"]{border-color:var(--ar-accent);background:var(--ar-accent-subtle)}
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
[data-ar-design="remix"] [data-ar="upload"][data-state~="disabled"]>[data-part="drop"]>[data-part="icon"]{color:var(--ar-color-text-faint)}
|
|
12
12
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]>[data-part="title"]{color:var(--ar-color-text);font-weight:700}
|
|
13
13
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="drop"]>[data-part="hint"]>[data-part="pick"]{color:var(--ar-accent-ink);text-decoration:underline;text-underline-offset:2px}
|
|
14
|
-
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]{flex:
|
|
14
|
+
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]{flex:1 1 280px}
|
|
15
15
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]{gap:8px;height:34px;padding:0 8px;border-radius:8px;font-size:13px;color:var(--ar-color-text)}
|
|
16
16
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]:hover{background:var(--ar-color-hover)}
|
|
17
17
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]>[data-part="name"]{color:var(--ar-accent-ink)}
|
|
@@ -21,8 +21,6 @@
|
|
|
21
21
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]>[data-part="remove"]{width:24px;height:24px;margin-right:-4px;border-radius:6px;color:var(--ar-color-text-secondary)}
|
|
22
22
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]>[data-part="remove"]:hover{background:var(--ar-color-danger-subtle);color:var(--ar-color-danger-ink)}
|
|
23
23
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="row"]>[data-part="remove"]:focus-visible{outline:0;box-shadow:0 0 0 3px var(--ar-accent-ring)}
|
|
24
|
-
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"][data-status="done"]>[data-part="row"]>[data-part="remove"]{display:none}
|
|
25
|
-
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"][data-status="done"]>[data-part="row"]:is(:hover,:focus-within)>[data-part="remove"]{display:inline-flex}
|
|
26
24
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"][data-status="done"]>[data-part="row"]:is(:hover,:focus-within)>[data-part="status"]{display:none}
|
|
27
25
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="bar"]{height:3px;margin:-4px 8px 4px 34px;border-radius:2px;background:var(--ar-color-border-subtle)}
|
|
28
26
|
[data-ar-design="remix"] [data-ar="upload"]>[data-part="files"]>[data-part="file"]>[data-part="bar"]>i{background:var(--ar-accent);transition:width .3s}
|
package/src/parts/ArWizard.css
CHANGED
|
@@ -1,2 +1,14 @@
|
|
|
1
|
-
/* @covers ArWizard 1.
|
|
1
|
+
/* @covers ArWizard 1.2.0 */
|
|
2
2
|
/* Composed from the active design’s public controls. */
|
|
3
|
+
|
|
4
|
+
[data-ar-design="remix"] [data-ar="wizard"][data-layout="form"] {
|
|
5
|
+
inline-size: 100%;
|
|
6
|
+
max-inline-size: 48rem;
|
|
7
|
+
margin-inline: auto;
|
|
8
|
+
}
|
|
9
|
+
[data-ar-design="remix"] [data-ar="wizard"][data-layout="form"] > [data-part="actions"] {
|
|
10
|
+
justify-content: space-between;
|
|
11
|
+
}
|
|
12
|
+
[data-ar-design="remix"] [data-ar="wizard"][data-layout="form"] > [data-part="actions"] > [data-tone="primary"] {
|
|
13
|
+
margin-inline-start: auto;
|
|
14
|
+
}
|
package/src/parts/ArZipInput.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* @covers ArZipInput 1.
|
|
1
|
+
/* @covers ArZipInput 1.3.0 */
|
|
2
2
|
[data-ar-design="remix"] [data-ar="zip-input"]{gap:10px}
|
|
3
3
|
[data-ar-design="remix"] [data-ar="zip-input"]>[data-ar="text-input"]{width:132px;font-variant-numeric:tabular-nums}
|
|
4
4
|
[data-ar-design="remix"] [data-ar="zip-input"]>[data-part="status"]{font-size:12px;font-weight:600;color:var(--ar-color-text-muted)}
|
package/src/parts/_choice.css
CHANGED
|
@@ -38,8 +38,8 @@
|
|
|
38
38
|
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"]:has(>[data-part="control"]>[data-part="input"]:focus-visible){box-shadow:inset 0 0 0 1px var(--ar-accent-line),0 0 0 3px var(--ar-accent-ring)}
|
|
39
39
|
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"]:is([data-state~="checked"],[data-state~="indeterminate"]):has(>[data-part="control"]>[data-part="input"]:focus-visible){box-shadow:inset 0 0 0 2px var(--ar-accent),0 0 0 3px var(--ar-accent-ring)}
|
|
40
40
|
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"]>[data-part="control"]>[data-part="input"]:focus-visible+:is([data-part="mark"],[data-part="box"]){box-shadow:none}
|
|
41
|
-
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"][data-state~="disabled"]{background:var(--ar-color-surface-alt);color:var(--ar-color-text-
|
|
42
|
-
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"][data-state~="disabled"]>[data-part="description"]{color:var(--ar-color-text-
|
|
41
|
+
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"][data-state~="disabled"]{background:var(--ar-color-surface-alt);color:var(--ar-color-text-muted);box-shadow:inset 0 0 0 1px var(--ar-color-border)}
|
|
42
|
+
[data-ar-design="remix"] :is([data-ar="radio"],[data-ar="checkbox"])[data-variant="card"][data-state~="disabled"]>[data-part="description"]{color:var(--ar-color-text-muted)}
|
|
43
43
|
/* カードの名前の横の札(ArChoiceCard の tag:推奨・ご利用中) */
|
|
44
44
|
[data-ar-design="remix"] [data-ar="radio"]>[data-part="label"]>[data-part="tag"]{height:20px;margin-left:8px;padding:0 7px;border-radius:10px;background:var(--ar-accent-subtle);color:var(--ar-accent-ink);font-size:11px;font-weight:700;line-height:1;white-space:nowrap}
|
|
45
45
|
[data-ar-design="remix"] [data-ar="radio"]>[data-part="label"]>[data-part="tag"][data-tone="ok"]{background:var(--ar-color-ok-subtle);color:var(--ar-color-ok)}
|