diff options
author | lwatson <lwatson@wikimedia.org> | 2024-12-10 17:06:59 -0500 |
---|---|---|
committer | LWatson <lwatson@wikimedia.org> | 2024-12-10 23:33:00 +0000 |
commit | baa066e7bba8b103a957d8aaa4af377503f2c24c (patch) | |
tree | af3f61044a7dc6eb9852a26f1e13d7d1f617d0c7 /resources/lib/codex/modules | |
parent | da54624f84bcaff5ad261985c0df1278014530c9 (diff) | |
download | mediawikicore-baa066e7bba8b103a957d8aaa4af377503f2c24c.tar.gz mediawikicore-baa066e7bba8b103a957d8aaa4af377503f2c24c.zip |
Update Codex from v1.17.0 to v1.18.0
Bug: T303384
Bug: T314514
Bug: T341978
Bug: T342126
Bug: T370889
Bug: T380452
Bug: T381787
Depends-On: I58401027164c50a7eab694789597678e13392561
Change-Id: I2b1a13084d2d4369f7af8d17595d0b2f4def511b
Diffstat (limited to 'resources/lib/codex/modules')
47 files changed, 47 insertions, 47 deletions
diff --git a/resources/lib/codex/modules/CdxAccordion-bidi.css b/resources/lib/codex/modules/CdxAccordion-bidi.css index cfdc2bafd632..02824e62dd10 100644 --- a/resources/lib/codex/modules/CdxAccordion-bidi.css +++ b/resources/lib/codex/modules/CdxAccordion-bidi.css @@ -1 +1 @@ -.cdx-accordion{position:relative}[dir] .cdx-accordion{border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{list-style:none;display:flex;gap:8px;word-break:break-word;white-space:normal}[dir] .cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}[dir] .cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);cursor:pointer}[dir] .cdx-accordion>summary:active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-accordion>summary:focus-visible{outline:1px solid transparent}[dir] .cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c)}[dir] .cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;font-size:1rem}[dir] .cdx-accordion .cdx-accordion__header{margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;height:calc(1.375em + 26px);font-size:1rem}[dir] .cdx-accordion__action.cdx-button{padding-right:12px;padding-left:12px}[dir=ltr] .cdx-accordion__action.cdx-button{right:0}[dir=rtl] .cdx-accordion__action.cdx-button{left:0}[dir] .cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{font-size:1rem}[dir] .cdx-accordion__content{padding:8px 12px 12px}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em}[dir] .cdx-accordion>summary:before{transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}[dir] .cdx-accordion>summary:before{background-color:var(--color-base, #202122)}}[dir=ltr] .cdx-accordion[open]>summary:before{transform:rotate(-180deg)}[dir=rtl] .cdx-accordion[open]>summary:before{transform:rotate(180deg)} +.cdx-accordion{position:relative}[dir] .cdx-accordion{border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{list-style:none;display:flex;gap:8px;word-break:break-word;white-space:normal}[dir] .cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}[dir] .cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}[dir] .cdx-accordion>summary:active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-accordion>summary:focus-visible{outline:1px solid transparent}[dir] .cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1)}[dir] .cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;font-size:1rem}[dir] .cdx-accordion .cdx-accordion__header{margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;height:calc(1.375em + 26px);font-size:1rem}[dir] .cdx-accordion__action.cdx-button{padding-right:12px;padding-left:12px}[dir=ltr] .cdx-accordion__action.cdx-button{right:0}[dir=rtl] .cdx-accordion__action.cdx-button{left:0}[dir] .cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{font-size:1rem}[dir] .cdx-accordion__content{padding:8px 12px 12px}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em}[dir] .cdx-accordion>summary:before{transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}[dir] .cdx-accordion>summary:before{background-color:var(--color-base, #202122)}}[dir=ltr] .cdx-accordion[open]>summary:before{transform:rotate(-180deg)}[dir=rtl] .cdx-accordion[open]>summary:before{transform:rotate(180deg)} diff --git a/resources/lib/codex/modules/CdxAccordion-rtl.css b/resources/lib/codex/modules/CdxAccordion-rtl.css index c435e92c090f..766eea438006 100644 --- a/resources/lib/codex/modules/CdxAccordion-rtl.css +++ b/resources/lib/codex/modules/CdxAccordion-rtl.css @@ -1 +1 @@ -.cdx-accordion{position:relative;border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);list-style:none;display:flex;gap:8px;border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;word-break:break-word;white-space:normal;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}.cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);cursor:pointer}.cdx-accordion>summary:active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c);outline:1px solid transparent}.cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0;font-size:1rem}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;left:0;height:calc(1.375em + 26px);padding-left:12px;padding-right:12px;font-size:1rem}.cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{padding:8px 12px 12px;font-size:1rem}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em;transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-accordion[open]>summary:before{transform:rotate(180deg)} +.cdx-accordion{position:relative;border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);list-style:none;display:flex;gap:8px;border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;word-break:break-word;white-space:normal;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}.cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-accordion>summary:active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1);outline:1px solid transparent}.cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0;font-size:1rem}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;left:0;height:calc(1.375em + 26px);padding-left:12px;padding-right:12px;font-size:1rem}.cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{padding:8px 12px 12px;font-size:1rem}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em;transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-accordion[open]>summary:before{transform:rotate(180deg)} diff --git a/resources/lib/codex/modules/CdxAccordion.css b/resources/lib/codex/modules/CdxAccordion.css index e2009776fc5c..7d06677b2b11 100644 --- a/resources/lib/codex/modules/CdxAccordion.css +++ b/resources/lib/codex/modules/CdxAccordion.css @@ -1 +1 @@ -.cdx-accordion{position:relative;border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);list-style:none;display:flex;gap:8px;border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;word-break:break-word;white-space:normal;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}.cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);cursor:pointer}.cdx-accordion>summary:active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c);outline:1px solid transparent}.cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0;font-size:1rem}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;right:0;height:calc(1.375em + 26px);padding-right:12px;padding-left:12px;font-size:1rem}.cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{padding:8px 12px 12px;font-size:1rem}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em;transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-accordion[open]>summary:before{transform:rotate(-180deg)} +.cdx-accordion{position:relative;border-bottom:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-accordion>summary{background-color:var(--background-color-transparent, transparent);list-style:none;display:flex;gap:8px;border-width:1px;border-style:solid;border-color:var(--border-color-transparent, transparent);border-radius:0;padding:12px;word-break:break-word;white-space:normal;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s;transition-timing-function:ease}.cdx-accordion>summary:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-accordion>summary:active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-accordion>summary:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1);outline:1px solid transparent}.cdx-accordion>summary:focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-accordion>summary::-webkit-details-marker{display:none}.cdx-accordion .cdx-accordion__header{position:relative;margin-top:0;margin-bottom:0;border-top:0;padding-top:0;padding-bottom:0;font-size:1rem}.cdx-accordion .cdx-accordion__header__title{display:flex;gap:8px;line-height:1.375}.cdx-accordion .cdx-accordion__header__description{color:var(--color-subtle, #54595d);display:flex;font-weight:400;line-height:1.375;pointer-events:none}.cdx-accordion__action.cdx-button{display:flex;align-items:center;position:absolute;top:0;right:0;height:calc(1.375em + 26px);padding-right:12px;padding-left:12px;font-size:1rem}.cdx-accordion__action.cdx-button:hover{background-color:unset}.cdx-accordion__content{padding:8px 12px 12px;font-size:1rem}.cdx-accordion>summary:before{content:"";min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom;height:1.375em;transition-property:background-color,border-color,transform;transition-duration:.25s;transition-timing-function:ease}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-accordion>summary:before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-accordion>summary:before,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-accordion>summary:before{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-accordion>summary:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-accordion[open]>summary:before{transform:rotate(-180deg)} diff --git a/resources/lib/codex/modules/CdxButton-bidi.css b/resources/lib/codex/modules/CdxButton-bidi.css index 1c3336f2385f..2af2ce87af4f 100644 --- a/resources/lib/codex/modules/CdxButton-bidi.css +++ b/resources/lib/codex/modules/CdxButton-bidi.css @@ -1 +1 @@ -.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none}[dir] .cdx-button{margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px}[dir] .cdx-button--size-large{padding-right:15px;padding-left:15px}.cdx-button--icon-only{min-width:32px}[dir] .cdx-button--icon-only{padding-right:5px;padding-left:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px}[dir] .cdx-button--icon-only.cdx-button--size-large{padding-right:11px;padding-left:11px}[dir] .cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{color:var(--color-base, #202122)}[dir] .cdx-button:enabled,[dir] .cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}.cdx-button:enabled:hover,.cdx-button.cdx-button--fake-button--enabled:hover{color:var(--color-base--hover, #404244)}[dir] .cdx-button:enabled:hover,[dir] .cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-base, #fff);cursor:pointer}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled:hover .cdx-button__icon{background-color:var(--color-base--hover, #404244)}}.cdx-button:enabled:active,.cdx-button.cdx-button--fake-button--enabled:active,.cdx-button:enabled.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{color:var(--color-emphasized, #101418)}[dir] .cdx-button:enabled:active,[dir] .cdx-button.cdx-button--fake-button--enabled:active,[dir] .cdx-button:enabled.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive, #eaecf0);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}[dir] .cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-button:enabled.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{color:var(--color-progressive--active, #233566)}[dir] .cdx-button:enabled.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle, #f1f4fd);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-button:enabled.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{color:var(--color-destructive--active, #612419)}[dir] .cdx-button:enabled.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle, #ffe9e5);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}[dir] .cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);border-color:var(--border-color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-quiet,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-button:enabled.cdx-button--weight-quiet:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-button-quiet--hover, rgba(0, 24, 73, .027))}.cdx-button:enabled.cdx-button--weight-quiet:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{color:var(--color-emphasized, #101418)}[dir] .cdx-button:enabled.cdx-button--weight-quiet:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-button-quiet--active, rgba(0, 24, 73, .082));border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle, #f1f4fd)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle, #ffe9e5)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-button:disabled,[dir] .cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:disabled .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-button:disabled.cdx-button--weight-quiet,[dir] .cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} +.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none}[dir] .cdx-button{margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px}[dir] .cdx-button--size-large{padding-right:15px;padding-left:15px}.cdx-button--icon-only{min-width:32px}[dir] .cdx-button--icon-only{padding-right:5px;padding-left:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px}[dir] .cdx-button--icon-only.cdx-button--size-large{padding-right:11px;padding-left:11px}[dir] .cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{color:var(--color-base, #202122)}[dir] .cdx-button:enabled,[dir] .cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}[dir] .cdx-button:enabled:hover,[dir] .cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}[dir] .cdx-button:enabled:active,[dir] .cdx-button.cdx-button--fake-button--enabled:active,[dir] .cdx-button:enabled.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}[dir] .cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{color:var(--color-progressive, #36c)}[dir] .cdx-button:enabled.cdx-button--action-progressive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{background-color:var(--background-color-progressive-subtle, #f1f4fd);border-color:var(--border-color-progressive, #6485d1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-button:enabled.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{color:var(--color-progressive--active, #233566)}[dir] .cdx-button:enabled.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}[dir] .cdx-button:enabled.cdx-button--action-destructive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{background-color:var(--background-color-destructive-subtle, #ffe9e5);border-color:var(--border-color-destructive, #f54739)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-button:enabled.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{color:var(--color-destructive--active, #612419)}[dir] .cdx-button:enabled.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}[dir] .cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419)}[dir] .cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}[dir] .cdx-button:enabled.cdx-button--weight-quiet,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-quiet:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{mix-blend-mode:var(--mix-blend-mode-blend, multiply)}[dir] .cdx-button:enabled.cdx-button--weight-quiet:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0)}[dir] .cdx-button:enabled.cdx-button--weight-quiet:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{color:var(--color-progressive--active, #233566)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{color:var(--color-destructive--active, #612419)}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}[dir] .cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),[dir] .cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-button:disabled,[dir] .cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:disabled .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-button:disabled.cdx-button--weight-quiet,[dir] .cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){[dir] .cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,[dir] .cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} diff --git a/resources/lib/codex/modules/CdxButton-rtl.css b/resources/lib/codex/modules/CdxButton-rtl.css index bbc58e1df303..3f40b6843174 100644 --- a/resources/lib/codex/modules/CdxButton-rtl.css +++ b/resources/lib/codex/modules/CdxButton-rtl.css @@ -1 +1 @@ -.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-left:11px;padding-right:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px;padding-left:15px;padding-right:15px}.cdx-button--icon-only{min-width:32px;padding-left:5px;padding-right:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px;padding-left:11px;padding-right:11px}.cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}.cdx-button:enabled:hover,.cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);cursor:pointer}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled:hover .cdx-button__icon{background-color:var(--color-base--hover, #404244)}}.cdx-button:enabled:active,.cdx-button.cdx-button--fake-button--enabled:active,.cdx-button:enabled.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled:active .cdx-button__icon,.cdx-button:enabled.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}.cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-quiet:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-button-quiet--hover, rgba(0, 24, 73, .027))}.cdx-button:enabled.cdx-button--weight-quiet:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-button-quiet--active, rgba(0, 24, 73, .082));color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);color:var(--color-disabled, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} +.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-left:11px;padding-right:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px;padding-left:15px;padding-right:15px}.cdx-button--icon-only{min-width:32px;padding-left:5px;padding-right:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px;padding-left:11px;padding-right:11px}.cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}.cdx-button:enabled:hover,.cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-button:enabled:active,.cdx-button.cdx-button--fake-button--enabled:active,.cdx-button:enabled.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}.cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive, #36c);border-color:var(--border-color-progressive, #6485d1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);color:var(--color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive, #bf3c2c);border-color:var(--border-color-destructive, #f54739)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);color:var(--color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-quiet:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);mix-blend-mode:var(--mix-blend-mode-blend, multiply)}.cdx-button:enabled.cdx-button--weight-quiet:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);color:var(--color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);color:var(--color-destructive--active, #612419);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);color:var(--color-disabled, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} diff --git a/resources/lib/codex/modules/CdxButton.css b/resources/lib/codex/modules/CdxButton.css index 16dae372175e..92b2fe375458 100644 --- a/resources/lib/codex/modules/CdxButton.css +++ b/resources/lib/codex/modules/CdxButton.css @@ -1 +1 @@ -.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px;padding-right:15px;padding-left:15px}.cdx-button--icon-only{min-width:32px;padding-right:5px;padding-left:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px;padding-right:11px;padding-left:11px}.cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}.cdx-button:enabled:hover,.cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);cursor:pointer}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled:hover .cdx-button__icon{background-color:var(--color-base--hover, #404244)}}.cdx-button:enabled:active,.cdx-button.cdx-button--fake-button--enabled:active,.cdx-button:enabled.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled:active .cdx-button__icon,.cdx-button:enabled.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}.cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-quiet:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-button-quiet--hover, rgba(0, 24, 73, .027))}.cdx-button:enabled.cdx-button--weight-quiet:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-button-quiet--active, rgba(0, 24, 73, .082));color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active .cdx-button__icon{background-color:var(--color-emphasized, #101418)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);color:var(--color-disabled, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} +.cdx-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-button--size-large{min-height:44px;padding-right:15px;padding-left:15px}.cdx-button--icon-only{min-width:32px;padding-right:5px;padding-left:5px}.cdx-button--icon-only.cdx-button--size-large{min-width:44px;padding-right:11px;padding-left:11px}.cdx-button::-moz-focus-inner{border:0;padding:0}.cdx-button .cdx-button__icon,.cdx-button .cdx-icon{vertical-align:middle}.cdx-button .cdx-icon{color:inherit}.cdx-button--fake-button,.cdx-button--fake-button:hover,.cdx-button--fake-button:focus{text-decoration:none}.cdx-button:enabled,.cdx-button.cdx-button--fake-button--enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled .cdx-button__icon{background-color:var(--color-base, #202122)}}.cdx-button:enabled:hover,.cdx-button.cdx-button--fake-button--enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-button:enabled:active,.cdx-button.cdx-button--fake-button--enabled:active,.cdx-button:enabled.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-button:enabled:focus,.cdx-button.cdx-button--fake-button--enabled:focus{outline:1px solid transparent}.cdx-button:enabled:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive, #36c);border-color:var(--border-color-progressive, #6485d1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);color:var(--color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive, #bf3c2c);border-color:var(--border-color-destructive, #f54739)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-destructive--hover, #9f3526)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);color:var(--color-destructive--active, #612419);border-color:var(--border-color-destructive--active, #612419)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive--hover, #3056a9)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive--active, #233566)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive{background-color:var(--background-color-destructive, #bf3c2c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-inverted-fixed, #fff)}}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive--hover, #9f3526)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive--active, #612419)}.cdx-button:enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-primary.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-button:enabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-button:enabled.cdx-button--weight-quiet:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);mix-blend-mode:var(--mix-blend-mode-blend, multiply)}.cdx-button:enabled.cdx-button--weight-quiet:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive{color:var(--color-progressive, #36c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive .cdx-button__icon{background-color:var(--color-progressive, #36c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover{background-color:var(--background-color-progressive-subtle--hover, #dce3f9);color:var(--color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:hover .cdx-button__icon{background-color:var(--color-progressive--hover, #3056a9)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6);color:var(--color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-progressive--active, #233566)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-progressive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive{color:var(--color-destructive, #bf3c2c)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive .cdx-button__icon{background-color:var(--color-destructive, #bf3c2c)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover{background-color:var(--background-color-destructive-subtle--hover, #ffdad3);color:var(--color-destructive--hover, #9f3526);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:hover .cdx-button__icon{background-color:var(--color-destructive--hover, #9f3526)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd);color:var(--color-destructive--active, #612419);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:active .cdx-button__icon,.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon,.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive.cdx-button--is-active .cdx-button__icon{background-color:var(--color-destructive--active, #612419)}}.cdx-button:enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active),.cdx-button.cdx-button--fake-button--enabled.cdx-button--weight-quiet.cdx-button--action-destructive:focus:not(:active):not(.cdx-button--is-active){border-color:var(--border-color-destructive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-destructive--focus, #36c)}.cdx-button:disabled,.cdx-button.cdx-button--fake-button--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled .cdx-button__icon{background-color:var(--color-inverted, #fff)}}.cdx-button:disabled.cdx-button--weight-quiet,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet{background-color:var(--background-color-transparent, transparent);color:var(--color-disabled, #a2a9b1)}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-button:disabled.cdx-button--weight-quiet .cdx-button__icon,.cdx-button.cdx-button--fake-button--disabled.cdx-button--weight-quiet .cdx-button__icon{background-color:var(--color-disabled, #a2a9b1)}} diff --git a/resources/lib/codex/modules/CdxCard-bidi.css b/resources/lib/codex/modules/CdxCard-bidi.css index b7b19a8eef85..13d207b9e651 100644 --- a/resources/lib/codex/modules/CdxCard-bidi.css +++ b/resources/lib/codex/modules/CdxCard-bidi.css @@ -1 +1 @@ -.cdx-card{display:flex;align-items:flex-start;position:relative}[dir] .cdx-card{background-color:var(--background-color-base, #fff);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}[dir] .cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}[dir] .cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{outline:1px solid transparent}[dir] .cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}[dir] .cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{font-size:.875rem}[dir] .cdx-card__text__supporting-text{margin-top:8px}[dir=ltr] .cdx-card__thumbnail.cdx-thumbnail{margin-right:12px}[dir=rtl] .cdx-card__thumbnail.cdx-thumbnail{margin-left:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:inherit}[dir=ltr] .cdx-card .cdx-card__icon{margin-right:12px}[dir=rtl] .cdx-card .cdx-card__icon{margin-left:12px} +.cdx-card{display:flex;align-items:flex-start;position:relative}[dir] .cdx-card{background-color:var(--background-color-base, #fff);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}[dir] .cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}[dir] .cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{outline:1px solid transparent}[dir] .cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}[dir] .cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{font-size:.875rem}[dir] .cdx-card__text__supporting-text{margin-top:8px}[dir=ltr] .cdx-card__thumbnail.cdx-thumbnail{margin-right:12px}[dir=rtl] .cdx-card__thumbnail.cdx-thumbnail{margin-left:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:var(--color-subtle, #54595d)}[dir=ltr] .cdx-card .cdx-card__icon{margin-right:12px}[dir=rtl] .cdx-card .cdx-card__icon{margin-left:12px} diff --git a/resources/lib/codex/modules/CdxCard-rtl.css b/resources/lib/codex/modules/CdxCard-rtl.css index a1b0b2f350d7..9f495cb4a6c6 100644 --- a/resources/lib/codex/modules/CdxCard-rtl.css +++ b/resources/lib/codex/modules/CdxCard-rtl.css @@ -1 +1 @@ -.cdx-card{background-color:var(--background-color-base, #fff);display:flex;align-items:flex-start;position:relative;border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}.cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}.cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff);outline:1px solid transparent}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}.cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{margin-top:8px;font-size:.875rem}.cdx-card__thumbnail.cdx-thumbnail{margin-left:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:inherit;margin-left:12px} +.cdx-card{background-color:var(--background-color-base, #fff);display:flex;align-items:flex-start;position:relative;border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}.cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}.cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff);outline:1px solid transparent}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}.cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{margin-top:8px;font-size:.875rem}.cdx-card__thumbnail.cdx-thumbnail{margin-left:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:var(--color-subtle, #54595d);margin-left:12px} diff --git a/resources/lib/codex/modules/CdxCard.css b/resources/lib/codex/modules/CdxCard.css index 11acc3b72982..cb3801a4ebba 100644 --- a/resources/lib/codex/modules/CdxCard.css +++ b/resources/lib/codex/modules/CdxCard.css @@ -1 +1 @@ -.cdx-card{background-color:var(--background-color-base, #fff);display:flex;align-items:flex-start;position:relative;border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}.cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}.cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff);outline:1px solid transparent}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}.cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{margin-top:8px;font-size:.875rem}.cdx-card__thumbnail.cdx-thumbnail{margin-right:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:inherit;margin-right:12px} +.cdx-card{background-color:var(--background-color-base, #fff);display:flex;align-items:flex-start;position:relative;border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;padding:12px}.cdx-card--is-link{transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-card--is-link,.cdx-card--is-link:hover,.cdx-card--is-link:focus{text-decoration:none}.cdx-card--is-link:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-card--is-link:active{border-color:var(--border-color-interactive--active, #202122)}.cdx-card--is-link:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff);outline:1px solid transparent}.cdx-card--title-only{align-items:center}.cdx-card__text{display:flex;flex-direction:column;line-height:1.5714285;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-card__text__title{color:var(--color-base, #202122);font-weight:700;line-height:1.4285714}.cdx-card__text__description,.cdx-card__text__supporting-text,.cdx-card__text__description .cdx-icon,.cdx-card__text__supporting-text .cdx-icon{color:var(--color-subtle, #54595d)}.cdx-card__text__description{margin-top:4px}.cdx-card__text__supporting-text{margin-top:8px;font-size:.875rem}.cdx-card__thumbnail.cdx-thumbnail{margin-right:12px}.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__placeholder,.cdx-card__thumbnail.cdx-thumbnail .cdx-thumbnail__image{width:3rem;height:3rem}.cdx-card .cdx-card__icon{color:var(--color-subtle, #54595d);margin-right:12px} diff --git a/resources/lib/codex/modules/CdxChipInput-bidi.css b/resources/lib/codex/modules/CdxChipInput-bidi.css index ebc470b8a42b..0047d889ea01 100644 --- a/resources/lib/codex/modules/CdxChipInput-bidi.css +++ b/resources/lib/codex/modules/CdxChipInput-bidi.css @@ -1 +1 @@ -.cdx-input-chip{color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;font-size:.875rem;line-height:1.5714285}[dir] .cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px}[dir=ltr] .cdx-input-chip{padding:0 0 0 8px}[dir=rtl] .cdx-input-chip{padding:0 8px 0 0}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):focus{outline:1px solid transparent}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-input-chip--disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;font-size:.75rem}[dir] .cdx-input-chip__button.cdx-button{border-radius:9999px;padding-right:2px;padding-left:2px}[dir=ltr] .cdx-input-chip__button.cdx-button{margin-right:1px}[dir=rtl] .cdx-input-chip__button.cdx-button{margin-left:1px}.cdx-chip-input{overflow:hidden}[dir] .cdx-chip-input{border-radius:2px}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;line-height:1.4285714}[dir] .cdx-chip-input__chips,[dir] .cdx-chip-input__separate-input{border-width:1px;border-style:solid;padding:3px 8px}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{color:var(--color-base, #202122);flex-grow:inherit;font-family:inherit;font-size:inherit;line-height:1}[dir] .cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);border:0}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}[dir] .cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-chip-input__aria-status{margin:-1px;border:0;padding:0}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{outline:1px solid transparent}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-chip-input--disabled .cdx-chip-input__chips,[dir] .cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} +.cdx-input-chip{color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;font-size:.875rem;line-height:1.5714285}[dir] .cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px}[dir=ltr] .cdx-input-chip{padding:0 0 0 8px}[dir=rtl] .cdx-input-chip{padding:0 8px 0 0}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus{outline:1px solid transparent}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-input-chip--readonly{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}[dir] .cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:hover{background-color:var(--background-color-transparent, transparent);cursor:default}[dir] .cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:active{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:focus:not(:active){border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-input-chip--disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;font-size:.75rem}[dir] .cdx-input-chip__button.cdx-button{border-radius:9999px;padding-right:2px;padding-left:2px}[dir=ltr] .cdx-input-chip__button.cdx-button{margin-right:1px}[dir=rtl] .cdx-input-chip__button.cdx-button{margin-left:1px}.cdx-chip-input{overflow:hidden}[dir] .cdx-chip-input{border-radius:2px}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;line-height:1.4285714}[dir] .cdx-chip-input__chips,[dir] .cdx-chip-input__separate-input{border-width:1px;border-style:solid;padding:3px 8px}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{color:var(--color-base, #202122);flex-grow:inherit;font-family:inherit;font-size:inherit;line-height:1}[dir] .cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);border:0}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}[dir] .cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-chip-input__aria-status{margin:-1px;border:0;padding:0}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{outline:1px solid transparent}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,[dir] .cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-chip-input--readonly .cdx-chip-input__chips,[dir] .cdx-chip-input--readonly .cdx-chip-input__separate-input{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-chip-input--readonly.cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input--readonly.cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{outline:1px solid transparent}[dir] .cdx-chip-input--readonly.cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,[dir] .cdx-chip-input--readonly.cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-chip-input--disabled .cdx-chip-input__chips,[dir] .cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxChipInput-rtl.css b/resources/lib/codex/modules/CdxChipInput-rtl.css index 269631a1459f..31b151706173 100644 --- a/resources/lib/codex/modules/CdxChipInput-rtl.css +++ b/resources/lib/codex/modules/CdxChipInput-rtl.css @@ -1 +1 @@ -.cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px;padding:0 8px 0 0;font-size:.875rem;line-height:1.5714285}.cdx-input-chip:not(.cdx-input-chip--disabled){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-input-chip:not(.cdx-input-chip--disabled):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):focus{outline:1px solid transparent}.cdx-input-chip:not(.cdx-input-chip--disabled):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-input-chip:not(.cdx-input-chip--disabled):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;margin-left:1px;border-radius:9999px;padding-left:2px;padding-right:2px;font-size:.75rem}.cdx-chip-input{border-radius:2px;overflow:hidden}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;padding:3px 8px;line-height:1.4285714}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);color:var(--color-base, #202122);flex-grow:inherit;border:0;font-family:inherit;font-size:inherit;line-height:1}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}.cdx-chip-input--disabled .cdx-chip-input__chips,.cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} +.cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px;padding:0 8px 0 0;font-size:.875rem;line-height:1.5714285}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus{outline:1px solid transparent}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-input-chip--readonly{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:hover{background-color:var(--background-color-transparent, transparent);cursor:default}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:active{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:focus:not(:active){border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;margin-left:1px;border-radius:9999px;padding-left:2px;padding-right:2px;font-size:.75rem}.cdx-chip-input{border-radius:2px;overflow:hidden}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;padding:3px 8px;line-height:1.4285714}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);color:var(--color-base, #202122);flex-grow:inherit;border:0;font-family:inherit;font-size:inherit;line-height:1}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}.cdx-chip-input--readonly .cdx-chip-input__chips,.cdx-chip-input--readonly .cdx-chip-input__separate-input{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-chip-input--readonly.cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input--readonly.cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input--disabled .cdx-chip-input__chips,.cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxChipInput.cjs b/resources/lib/codex/modules/CdxChipInput.cjs index 6111a470bbf3..62eadc498866 100644 --- a/resources/lib/codex/modules/CdxChipInput.cjs +++ b/resources/lib/codex/modules/CdxChipInput.cjs @@ -1 +1 @@ -"use strict";var V=(e,o,p)=>new Promise((f,v)=>{var h=s=>{try{n(p.next(s))}catch(a){v(a)}},u=s=>{try{n(p.throw(s))}catch(a){v(a)}},n=s=>s.done?f(s.value):Promise.resolve(s.value).then(h,u);n((p=p.apply(e,o)).next())});const t=require("vue"),G=require("./CdxButton.cjs"),$=require("./Icon.js"),k=require("./useI18n.cjs"),E=require("./_plugin-vue_export-helper.js"),y=require("./constants.js"),J=require("./useSplitAttributes.cjs"),Q=require("./useFieldData.cjs"),X=require("./useComputedDirection.cjs"),Y=require("./useOptionalModelWrapper.js"),Z=t.defineComponent({name:"CdxInputChip",components:{CdxButton:G,CdxIcon:$.CdxIcon},props:{icon:{type:[String,Object],default:null},disabled:{type:Boolean,default:!1}},expose:["focus"],emits:["remove-chip","click-chip","arrow-left","arrow-right"],setup(e,{emit:o}){const p=t.ref(),f=t.computed(()=>({"cdx-input-chip--disabled":e.disabled})),v=k("cdx-input-chip-aria-description","Press Enter to edit or Delete to remove");function h(u){var n;switch(u.key){case"Enter":o("click-chip"),u.preventDefault(),u.stopPropagation();break;case"Escape":(n=p.value)==null||n.blur(),u.preventDefault(),u.stopPropagation();break;case"Backspace":case"Delete":o("remove-chip",u.key),u.preventDefault(),u.stopPropagation();break;case"ArrowLeft":o("arrow-left"),u.preventDefault(),u.stopPropagation();break;case"ArrowRight":o("arrow-right"),u.preventDefault(),u.stopPropagation();break}}return{rootElement:p,rootClasses:f,ariaDescription:v,onKeydown:h,cdxIconClose:$._3}},methods:{focus(){this.$refs.rootElement.focus()}}}),_=["aria-description"],ee={class:"cdx-input-chip__text"};function te(e,o,p,f,v,h){const u=t.resolveComponent("cdx-icon"),n=t.resolveComponent("cdx-button");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-input-chip",e.rootClasses]),tabindex:"0",role:"option","aria-description":e.ariaDescription,onKeydown:o[1]||(o[1]=(...s)=>e.onKeydown&&e.onKeydown(...s)),onClick:o[2]||(o[2]=s=>e.$emit("click-chip"))},[e.icon?(t.openBlock(),t.createBlock(u,{key:0,icon:e.icon,size:"small"},null,8,["icon"])):t.createCommentVNode("v-if",!0),t.createElementVNode("span",ee,[t.renderSlot(e.$slots,"default")]),t.createVNode(n,{class:"cdx-input-chip__button",weight:"quiet",tabindex:"-1","aria-hidden":"true",disabled:e.disabled,onClick:o[0]||(o[0]=t.withModifiers(s=>e.$emit("remove-chip","button"),["stop"]))},{default:t.withCtx(()=>[t.createVNode(u,{icon:e.cdxIconClose,size:"x-small"},null,8,["icon"])]),_:1},8,["disabled"])],42,_)}const ne=E._export_sfc(Z,[["render",te]]),oe=y.makeStringTypeValidator(y.ValidationStatusTypes),ie=t.defineComponent({name:"CdxChipInput",components:{CdxInputChip:ne},inheritAttrs:!1,props:{inputChips:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},separateInput:{type:Boolean,default:!1},status:{type:String,default:"default",validator:oe},chipValidator:{type:Function,default:e=>!0},disabled:{type:Boolean,default:!1}},emits:["update:input-chips","update:input-value"],setup(e,{emit:o,attrs:p}){const f=t.ref(),v=t.ref(),h=t.ref(),u=t.ref(""),n=X(f),s=t.ref(),a=t.inject(y.AllowArbitraryKey,t.ref(!0)),A=t.ref(""),c=Y.useOptionalModelWrapper(A,t.toRef(e,"inputValue"),o,"update:input-value"),C=t.ref("default"),F=t.computed(()=>C.value==="error"||e.status==="error"?"error":"default"),{computedDisabled:B,computedStatus:S}=Q(t.toRef(e,"disabled"),F),b=t.ref(!1),R=t.computed(()=>({"cdx-chip-input--has-separate-input":e.separateInput,["cdx-chip-input--status-".concat(S.value)]:!0,"cdx-chip-input--focused":b.value,"cdx-chip-input--disabled":B.value})),{rootClasses:q,rootStyle:K,otherAttrs:N}=J(p,R),g=[],I=t.ref(null),P=t.computed(()=>I.value?I.value.value:""),M=k("cdx-chip-input-chip-added",i=>"Chip ".concat(i," was added."),[c]),T=k("cdx-chip-input-chip-removed",i=>"Chip ".concat(i," was removed."),[P]);function z(i,r){i!==null&&(g[r]=i)}const m=()=>{s.value.focus()};function w(){e.inputChips.find(i=>i.value===c.value)||!e.chipValidator(c.value)?C.value="error":c.value.toString().length>0&&(u.value=M.value,o("update:input-chips",e.inputChips.concat({value:c.value})),c.value="")}function D(i){o("update:input-chips",e.inputChips.filter(r=>r.value!==i.value))}function O(i,r){const d=n.value==="ltr"&&i==="left"||n.value==="rtl"&&i==="right"?-1:1,l=r+d;if(!(l<0)){if(l>=e.inputChips.length){m();return}g[l].focus()}}function L(i){return V(this,null,function*(){var r;w(),yield t.nextTick(),D(i),c.value=(r=i.label)!=null?r:i.value,m()})}function W(i,r,d){if(I.value=i,u.value=T.value,d==="button")m();else if(d==="Backspace"){const l=r===0?1:r-1;l<e.inputChips.length?g[l].focus():m()}else if(d==="Delete"){const l=r+1;l<e.inputChips.length?g[l].focus():m()}D(i)}function j(i){var d,l;const r=n.value==="rtl"?"ArrowRight":"ArrowLeft";switch(i.key){case"Enter":if(c.value.toString().length>0&&a.value){w(),i.preventDefault(),i.stopPropagation();return}break;case"Escape":(d=s.value)==null||d.blur(),i.preventDefault(),i.stopPropagation();return;case"Backspace":case r:if(((l=s.value)==null?void 0:l.selectionStart)===0&&s.value.selectionEnd===0&&e.inputChips.length>0){g[e.inputChips.length-1].focus(),i.preventDefault(),i.stopPropagation();return}break}}function U(){b.value=!0}function x(){b.value=!1}function H(i){var r;!((r=f.value)!=null&&r.contains(i.relatedTarget))&&a.value&&w()}return t.watch(t.toRef(e,"inputChips"),i=>{const r=i.find(d=>d.value===c.value);C.value=r?"error":"default"}),t.watch(c,()=>{C.value==="error"&&(C.value="default")}),{rootElement:f,chipsContainer:v,separateInputWrapper:h,input:s,computedInputValue:c,rootClasses:q,rootStyle:K,otherAttrs:N,assignChipTemplateRef:z,handleChipClick:L,handleChipRemove:W,moveChipFocus:O,onInputKeydown:j,focusInput:m,onInputFocus:U,onInputBlur:x,onFocusOut:H,computedDisabled:B,statusMessageContent:u}}}),ue={ref:"chipsContainer",class:"cdx-chip-input__chips",role:"listbox","aria-orientation":"horizontal"},se=["disabled"],re={key:0,ref:"separateInputWrapper",class:"cdx-chip-input__separate-input"},ae=["disabled"],le={class:"cdx-chip-input__aria-status",role:"status","aria-live":"polite"};function pe(e,o,p,f,v,h){const u=t.resolveComponent("cdx-input-chip");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-chip-input",e.rootClasses]),style:t.normalizeStyle(e.rootStyle),onClick:o[8]||(o[8]=(...n)=>e.focusInput&&e.focusInput(...n)),onFocusout:o[9]||(o[9]=(...n)=>e.onFocusOut&&e.onFocusOut(...n))},[t.createElementVNode("div",ue,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.inputChips,(n,s)=>(t.openBlock(),t.createBlock(u,{key:n.value,ref_for:!0,ref:a=>e.assignChipTemplateRef(a,s),class:"cdx-chip-input__item",icon:n.icon,disabled:e.computedDisabled,onClickChip:a=>e.handleChipClick(n),onRemoveChip:a=>e.handleChipRemove(n,s,a),onArrowLeft:a=>e.moveChipFocus("left",s),onArrowRight:a=>e.moveChipFocus("right",s)},{default:t.withCtx(()=>{var a;return[t.createTextVNode(t.toDisplayString((a=n.label)!=null?a:n.value),1)]}),_:2},1032,["icon","disabled","onClickChip","onRemoveChip","onArrowLeft","onArrowRight"]))),128)),e.separateInput?t.createCommentVNode("v-if",!0):t.withDirectives((t.openBlock(),t.createElementBlock("input",t.mergeProps({key:0,ref:"input","onUpdate:modelValue":o[0]||(o[0]=n=>e.computedInputValue=n),class:"cdx-chip-input__input",disabled:e.computedDisabled},e.otherAttrs,{onBlur:o[1]||(o[1]=(...n)=>e.onInputBlur&&e.onInputBlur(...n)),onFocus:o[2]||(o[2]=(...n)=>e.onInputFocus&&e.onInputFocus(...n)),onKeydown:o[3]||(o[3]=(...n)=>e.onInputKeydown&&e.onInputKeydown(...n))}),null,16,se)),[[t.vModelDynamic,e.computedInputValue]])],512),e.separateInput?(t.openBlock(),t.createElementBlock("div",re,[t.withDirectives(t.createElementVNode("input",t.mergeProps({ref:"input","onUpdate:modelValue":o[4]||(o[4]=n=>e.computedInputValue=n),class:"cdx-chip-input__input",disabled:e.computedDisabled},e.otherAttrs,{onBlur:o[5]||(o[5]=(...n)=>e.onInputBlur&&e.onInputBlur(...n)),onFocus:o[6]||(o[6]=(...n)=>e.onInputFocus&&e.onInputFocus(...n)),onKeydown:o[7]||(o[7]=(...n)=>e.onInputKeydown&&e.onInputKeydown(...n))}),null,16,ae),[[t.vModelDynamic,e.computedInputValue]])],512)):t.createCommentVNode("v-if",!0),t.createElementVNode("div",le,t.toDisplayString(e.statusMessageContent),1)],38)}const ce=E._export_sfc(ie,[["render",pe]]);module.exports=ce; +"use strict";var V=(e,o,d)=>new Promise((c,v)=>{var h=a=>{try{n(d.next(a))}catch(r){v(r)}},l=a=>{try{n(d.throw(a))}catch(r){v(r)}},n=a=>a.done?c(a.value):Promise.resolve(a.value).then(h,l);n((d=d.apply(e,o)).next())});const t=require("vue"),G=require("./CdxButton.cjs"),$=require("./Icon.js"),k=require("./useI18n.cjs"),E=require("./_plugin-vue_export-helper.js"),B=require("./constants.js"),J=require("./useSplitAttributes.cjs"),Q=require("./useFieldData.cjs"),X=require("./useComputedDirection.cjs"),Y=require("./useOptionalModelWrapper.js"),Z=t.defineComponent({name:"CdxInputChip",components:{CdxButton:G,CdxIcon:$.CdxIcon},props:{icon:{type:[String,Object],default:null},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},expose:["focus"],emits:["remove-chip","click-chip","arrow-left","arrow-right"],setup(e,{emit:o}){const d=t.computed(()=>e.disabled?-1:0),c=t.ref(),v=t.computed(()=>({"cdx-input-chip--disabled":e.disabled,"cdx-input-chip--readonly":e.readonly})),h=k("cdx-input-chip-aria-description","Press Enter to edit or Delete to remove");function l(n){var a;switch(n.key){case"Enter":o("click-chip"),n.preventDefault(),n.stopPropagation();break;case"Escape":(a=c.value)==null||a.blur(),n.preventDefault(),n.stopPropagation();break;case"Backspace":case"Delete":o("remove-chip",n.key),n.preventDefault(),n.stopPropagation();break;case"ArrowLeft":o("arrow-left"),n.preventDefault(),n.stopPropagation();break;case"ArrowRight":o("arrow-right"),n.preventDefault(),n.stopPropagation();break}}return{rootElement:c,rootClasses:v,ariaDescription:h,onKeydown:l,cdxIconClose:$._3,tabIndex:d}},methods:{focus(){this.$refs.rootElement.focus()}}}),_=["tabindex","aria-description"],ee={class:"cdx-input-chip__text"};function te(e,o,d,c,v,h){const l=t.resolveComponent("cdx-icon"),n=t.resolveComponent("cdx-button");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-input-chip",e.rootClasses]),tabindex:e.tabIndex,role:"option","aria-description":e.ariaDescription,onKeydown:o[1]||(o[1]=(...a)=>e.onKeydown&&e.onKeydown(...a)),onClick:o[2]||(o[2]=a=>e.$emit("click-chip"))},[e.icon?(t.openBlock(),t.createBlock(l,{key:0,icon:e.icon,size:"small"},null,8,["icon"])):t.createCommentVNode("v-if",!0),t.createElementVNode("span",ee,[t.renderSlot(e.$slots,"default")]),t.createVNode(n,{class:"cdx-input-chip__button",weight:"quiet",tabindex:"-1","aria-hidden":"true",disabled:e.disabled,onClick:o[0]||(o[0]=t.withModifiers(a=>e.$emit("remove-chip","button"),["stop"]))},{default:t.withCtx(()=>[t.createVNode(l,{icon:e.cdxIconClose,size:"x-small"},null,8,["icon"])]),_:1},8,["disabled"])],42,_)}const ne=E._export_sfc(Z,[["render",te]]),oe=B.makeStringTypeValidator(B.ValidationStatusTypes),ie=t.defineComponent({name:"CdxChipInput",components:{CdxInputChip:ne},inheritAttrs:!1,props:{inputChips:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},separateInput:{type:Boolean,default:!1},status:{type:String,default:"default",validator:oe},chipValidator:{type:Function,default:e=>!0},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1}},emits:["update:input-chips","update:input-value"],setup(e,{emit:o,attrs:d}){const c=t.ref(),v=t.ref(),h=t.ref(),l=t.ref(""),n=X(c),a=t.ref(),r=t.inject(B.AllowArbitraryKey,t.ref(!0)),A=t.ref(""),p=Y.useOptionalModelWrapper(A,t.toRef(e,"inputValue"),o,"update:input-value"),C=t.ref("default"),F=t.computed(()=>C.value==="error"||e.status==="error"?"error":"default"),{computedDisabled:b,computedStatus:S}=Q(t.toRef(e,"disabled"),F),g=t.ref(!1),R=t.computed(()=>({"cdx-chip-input--has-separate-input":e.separateInput,["cdx-chip-input--status-".concat(S.value)]:!0,"cdx-chip-input--focused":g.value,"cdx-chip-input--disabled":b.value,"cdx-chip-input--readonly":e.readonly})),{rootClasses:q,rootStyle:K,otherAttrs:N}=J(d,R),y=[],I=t.ref(null),P=t.computed(()=>I.value?I.value.value:""),M=k("cdx-chip-input-chip-added",i=>"Chip ".concat(i," was added."),[p]),T=k("cdx-chip-input-chip-removed",i=>"Chip ".concat(i," was removed."),[P]);function z(i,u){i!==null&&(y[u]=i)}const m=()=>{a.value.focus()};function w(){e.inputChips.find(i=>i.value===p.value)||!e.chipValidator(p.value)?C.value="error":p.value.toString().length>0&&(l.value=M.value,o("update:input-chips",e.inputChips.concat({value:p.value})),p.value="")}function D(i){e.readonly||b.value||o("update:input-chips",e.inputChips.filter(u=>u.value!==i.value))}function O(i,u){const f=n.value==="ltr"&&i==="left"||n.value==="rtl"&&i==="right"?-1:1,s=u+f;if(!(s<0)){if(s>=e.inputChips.length){m();return}y[s].focus()}}function L(i){return V(this,null,function*(){var u;e.readonly||b.value||(w(),yield t.nextTick(),D(i),p.value=(u=i.label)!=null?u:i.value,m())})}function W(i,u,f){if(I.value=i,l.value=T.value,f==="button")m();else if(f==="Backspace"){const s=u===0?1:u-1;s<e.inputChips.length?y[s].focus():m()}else if(f==="Delete"){const s=u+1;s<e.inputChips.length?y[s].focus():m()}D(i)}function j(i){var f,s;const u=n.value==="rtl"?"ArrowRight":"ArrowLeft";switch(i.key){case"Enter":if(p.value.toString().length>0&&r.value){w(),i.preventDefault(),i.stopPropagation();return}break;case"Escape":(f=a.value)==null||f.blur(),i.preventDefault(),i.stopPropagation();return;case"Backspace":case u:if(((s=a.value)==null?void 0:s.selectionStart)===0&&a.value.selectionEnd===0&&e.inputChips.length>0){y[e.inputChips.length-1].focus(),i.preventDefault(),i.stopPropagation();return}break}}function U(){g.value=!0}function x(){g.value=!1}function H(i){var u;!((u=c.value)!=null&&u.contains(i.relatedTarget))&&r.value&&w()}return t.watch(t.toRef(e,"inputChips"),i=>{const u=i.find(f=>f.value===p.value);C.value=u?"error":"default"}),t.watch(p,()=>{C.value==="error"&&(C.value="default")}),{rootElement:c,chipsContainer:v,separateInputWrapper:h,input:a,computedInputValue:p,rootClasses:q,rootStyle:K,otherAttrs:N,assignChipTemplateRef:z,handleChipClick:L,handleChipRemove:W,moveChipFocus:O,onInputKeydown:j,focusInput:m,onInputFocus:U,onInputBlur:x,onFocusOut:H,computedDisabled:b,statusMessageContent:l}}}),ae={ref:"chipsContainer",class:"cdx-chip-input__chips",role:"listbox","aria-orientation":"horizontal"},ue=["readonly","disabled"],re={key:0,ref:"separateInputWrapper",class:"cdx-chip-input__separate-input"},le=["readonly","disabled"],se={class:"cdx-chip-input__aria-status",role:"status","aria-live":"polite"};function pe(e,o,d,c,v,h){const l=t.resolveComponent("cdx-input-chip");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-chip-input",e.rootClasses]),style:t.normalizeStyle(e.rootStyle),onClick:o[8]||(o[8]=n=>e.disabled||e.readonly?null:e.focusInput),onFocusout:o[9]||(o[9]=(...n)=>e.onFocusOut&&e.onFocusOut(...n))},[t.createElementVNode("div",ae,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.inputChips,(n,a)=>(t.openBlock(),t.createBlock(l,{key:n.value,ref_for:!0,ref:r=>e.assignChipTemplateRef(r,a),class:"cdx-chip-input__item",icon:n.icon,readonly:e.readonly,disabled:e.computedDisabled,onClickChip:r=>e.handleChipClick(n),onRemoveChip:r=>e.handleChipRemove(n,a,r),onArrowLeft:r=>e.moveChipFocus("left",a),onArrowRight:r=>e.moveChipFocus("right",a)},{default:t.withCtx(()=>{var r;return[t.createTextVNode(t.toDisplayString((r=n.label)!=null?r:n.value),1)]}),_:2},1032,["icon","readonly","disabled","onClickChip","onRemoveChip","onArrowLeft","onArrowRight"]))),128)),e.separateInput?t.createCommentVNode("v-if",!0):t.withDirectives((t.openBlock(),t.createElementBlock("input",t.mergeProps({key:0,ref:"input","onUpdate:modelValue":o[0]||(o[0]=n=>e.computedInputValue=n),class:"cdx-chip-input__input",readonly:e.readonly,disabled:e.computedDisabled},e.otherAttrs,{onBlur:o[1]||(o[1]=(...n)=>e.onInputBlur&&e.onInputBlur(...n)),onFocus:o[2]||(o[2]=(...n)=>e.onInputFocus&&e.onInputFocus(...n)),onKeydown:o[3]||(o[3]=(...n)=>e.onInputKeydown&&e.onInputKeydown(...n))}),null,16,ue)),[[t.vModelDynamic,e.computedInputValue]])],512),e.separateInput?(t.openBlock(),t.createElementBlock("div",re,[t.withDirectives(t.createElementVNode("input",t.mergeProps({ref:"input","onUpdate:modelValue":o[4]||(o[4]=n=>e.computedInputValue=n),class:"cdx-chip-input__input",readonly:e.readonly,disabled:e.computedDisabled},e.otherAttrs,{onBlur:o[5]||(o[5]=(...n)=>e.onInputBlur&&e.onInputBlur(...n)),onFocus:o[6]||(o[6]=(...n)=>e.onInputFocus&&e.onInputFocus(...n)),onKeydown:o[7]||(o[7]=(...n)=>e.onInputKeydown&&e.onInputKeydown(...n))}),null,16,le),[[t.vModelDynamic,e.computedInputValue]])],512)):t.createCommentVNode("v-if",!0),t.createElementVNode("div",se,t.toDisplayString(e.statusMessageContent),1)],38)}const de=E._export_sfc(ie,[["render",pe]]);module.exports=de; diff --git a/resources/lib/codex/modules/CdxChipInput.css b/resources/lib/codex/modules/CdxChipInput.css index 1bc7ea2f3514..0ed8ae105420 100644 --- a/resources/lib/codex/modules/CdxChipInput.css +++ b/resources/lib/codex/modules/CdxChipInput.css @@ -1 +1 @@ -.cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px;padding:0 0 0 8px;font-size:.875rem;line-height:1.5714285}.cdx-input-chip:not(.cdx-input-chip--disabled){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-input-chip:not(.cdx-input-chip--disabled):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):focus{outline:1px solid transparent}.cdx-input-chip:not(.cdx-input-chip--disabled):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-input-chip:not(.cdx-input-chip--disabled):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;margin-right:1px;border-radius:9999px;padding-right:2px;padding-left:2px;font-size:.75rem}.cdx-chip-input{border-radius:2px;overflow:hidden}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;padding:3px 8px;line-height:1.4285714}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);color:var(--color-base, #202122);flex-grow:inherit;border:0;font-family:inherit;font-size:inherit;line-height:1}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-chip-input:not(.cdx-chip-input--disabled) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}.cdx-chip-input--disabled .cdx-chip-input__chips,.cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} +.cdx-input-chip{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:32rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:9999px;padding:0 0 0 8px;font-size:.875rem;line-height:1.5714285}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly){transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus{outline:1px solid transparent}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-input-chip:not(.cdx-input-chip--disabled):not(.cdx-input-chip--readonly):focus:not(:active){border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-input-chip--readonly{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:hover{background-color:var(--background-color-transparent, transparent);cursor:default}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:active{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--readonly .cdx-input-chip__button.cdx-button:focus:not(:active){border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-input-chip--disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-input-chip--disabled .cdx-icon{color:var(--color-disabled-emphasized, #a2a9b1)}.cdx-input-chip__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-input-chip__button.cdx-button{min-width:20px;min-height:20px;margin-right:1px;border-radius:9999px;padding-right:2px;padding-left:2px;font-size:.75rem}.cdx-chip-input{border-radius:2px;overflow:hidden}.cdx-chip-input__chips,.cdx-chip-input__separate-input{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;padding:3px 8px;line-height:1.4285714}.cdx-chip-input__chips{display:flex;flex:1 auto;flex-flow:wrap;gap:8px}.cdx-chip-input__input{background-color:var(--background-color-transparent, transparent);color:var(--color-base, #202122);flex-grow:inherit;border:0;font-family:inherit;font-size:inherit;line-height:1}.cdx-chip-input__input:focus{outline:1px solid transparent}.cdx-chip-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-chip-input--has-separate-input .cdx-chip-input__chips{margin-bottom:-1px}.cdx-chip-input--has-separate-input .cdx-chip-input__input{width:100%}.cdx-chip-input__aria-status{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly) .cdx-chip-input__separate-input{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips{background-color:var(--background-color-base, #fff)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__chips{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input input::placeholder{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips:hover input::placeholder,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input:hover input::placeholder{color:var(--color-error--hover, #9f3526)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-error, #bf3c2c)}.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused):not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips .cdx-chip-input__input:hover,.cdx-chip-input:not(.cdx-chip-input--disabled):not(.cdx-chip-input--readonly).cdx-chip-input--status-error:not(.cdx-chip-input--focused).cdx-chip-input--has-separate-input .cdx-chip-input__separate-input .cdx-chip-input__input:hover{color:var(--color-error--hover, #9f3526)}.cdx-chip-input--readonly .cdx-chip-input__chips,.cdx-chip-input--readonly .cdx-chip-input__separate-input{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-chip-input--readonly.cdx-chip-input--focused:not(.cdx-chip-input--has-separate-input) .cdx-chip-input__chips,.cdx-chip-input--readonly.cdx-chip-input--focused.cdx-chip-input--has-separate-input .cdx-chip-input__separate-input{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-chip-input--disabled .cdx-chip-input__chips,.cdx-chip-input--disabled .cdx-chip-input__separate-input{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-chip-input--disabled .cdx-chip-input__chips .cdx-chip-input__input,.cdx-chip-input--disabled .cdx-chip-input__separate-input .cdx-chip-input__input{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxLabel-bidi.css b/resources/lib/codex/modules/CdxLabel-bidi.css index 7863d6694a5a..fc225e6bc64e 100644 --- a/resources/lib/codex/modules/CdxLabel-bidi.css +++ b/resources/lib/codex/modules/CdxLabel-bidi.css @@ -1 +1 @@ -.cdx-label{display:flex;flex-direction:column;line-height:1.375}[dir=ltr] .cdx-label__label__icon.cdx-icon{margin-right:4px}[dir=rtl] .cdx-label__label__icon.cdx-icon{margin-left:4px}.cdx-label__label__text{font-weight:700}[dir] legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-label--visually-hidden{margin:-1px;border:0;padding:0}[dir] .cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){[dir] .cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} +.cdx-label{display:flex;flex-direction:column;line-height:1.375}.cdx-label__label__icon.cdx-icon{color:var(--color-subtle, #54595d)}[dir=ltr] .cdx-label__label__icon.cdx-icon{margin-right:4px}[dir=rtl] .cdx-label__label__icon.cdx-icon{margin-left:4px}.cdx-label__label__text{font-weight:700}[dir] legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-label--visually-hidden{margin:-1px;border:0;padding:0}[dir] .cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){[dir] .cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} diff --git a/resources/lib/codex/modules/CdxLabel-rtl.css b/resources/lib/codex/modules/CdxLabel-rtl.css index 59eb360d097e..93916fe94e71 100644 --- a/resources/lib/codex/modules/CdxLabel-rtl.css +++ b/resources/lib/codex/modules/CdxLabel-rtl.css @@ -1 +1 @@ -.cdx-label{display:flex;flex-direction:column;line-height:1.375}.cdx-label__label__icon.cdx-icon{margin-left:4px}.cdx-label__label__text{font-weight:700}legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} +.cdx-label{display:flex;flex-direction:column;line-height:1.375}.cdx-label__label__icon.cdx-icon{color:var(--color-subtle, #54595d);margin-left:4px}.cdx-label__label__text{font-weight:700}legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} diff --git a/resources/lib/codex/modules/CdxLabel.css b/resources/lib/codex/modules/CdxLabel.css index af7ee43bf9ad..ca6c9ba945b0 100644 --- a/resources/lib/codex/modules/CdxLabel.css +++ b/resources/lib/codex/modules/CdxLabel.css @@ -1 +1 @@ -.cdx-label{display:flex;flex-direction:column;line-height:1.375}.cdx-label__label__icon.cdx-icon{margin-right:4px}.cdx-label__label__text{font-weight:700}legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} +.cdx-label{display:flex;flex-direction:column;line-height:1.375}.cdx-label__label__icon.cdx-icon{color:var(--color-subtle, #54595d);margin-right:4px}.cdx-label__label__text{font-weight:700}legend.cdx-label{padding:0}fieldset label.cdx-label__label .cdx-label__label__text{font-weight:400}.cdx-label:not(.cdx-label--disabled) .cdx-label__label__optional-flag,.cdx-label:not(.cdx-label--disabled) .cdx-label__description{color:var(--color-subtle, #54595d)}.cdx-label--disabled,.cdx-label--disabled .cdx-label__label__icon{color:var(--color-disabled, #a2a9b1)}.cdx-label--visually-hidden{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:8px}@media screen and (min-width: 640px){.cdx-label:not(.cdx-label--visually-hidden){padding-bottom:4px}} diff --git a/resources/lib/codex/modules/CdxLookup.cjs b/resources/lib/codex/modules/CdxLookup.cjs index 1fd7610f9c11..33ab9dd3b1b1 100644 --- a/resources/lib/codex/modules/CdxLookup.cjs +++ b/resources/lib/codex/modules/CdxLookup.cjs @@ -1 +1 @@ -"use strict";const t=require("vue"),N=require("./CdxMenu.cjs"),K=require("./CdxTextInput.cjs"),R=require("./useGeneratedId.cjs"),w=require("./useModelWrapper.cjs"),L=require("./useOptionalModelWrapper.js"),D=require("./useSplitAttributes.cjs"),E=require("./useFieldData.cjs"),O=require("./useFloatingMenu.cjs"),h=require("./constants.js"),P=require("./_plugin-vue_export-helper.js"),T=h.makeStringTypeValidator(h.ValidationStatusTypes),W=t.defineComponent({name:"CdxLookup",components:{CdxMenu:N,CdxTextInput:K},inheritAttrs:!1,props:{selected:{type:[String,Number,null],required:!0},menuItems:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},initialInputValue:{type:[String,Number],default:"",validator:e=>(e&&console.warn("CdxLookup: prop initialInputValue is deprecated. Use inputValue instead."),!0)},disabled:{type:Boolean,default:!1},menuConfig:{type:Object,default:()=>({})},status:{type:String,default:"default",validator:T}},emits:["update:selected","update:input-value","load-more","input","change","focus","blur"],setup:(e,{emit:u,attrs:g,slots:r})=>{const y=t.ref(),c=t.ref(),a=t.ref(),f=R("lookup-menu"),l=t.ref(!1),s=t.ref(!1),v=t.ref(!1),b=t.ref(e.menuItems),{computedDisabled:I,computedStatus:C}=E(t.toRef(e,"disabled"),t.toRef(e,"status")),V=t.toRef(e,"selected"),i=w(V,u,"update:selected"),d=t.computed(()=>{var n;return(n=a.value)==null?void 0:n.getComputedMenuItems().find(o=>o.value===i.value)}),S=t.computed(()=>{var n,o;return(o=(n=a.value)==null?void 0:n.getHighlightedMenuItem())==null?void 0:o.id}),q=t.ref(e.initialInputValue),p=L.useOptionalModelWrapper(q,t.toRef(e,"inputValue"),u,"update:input-value"),k=t.computed(()=>({"cdx-lookup--disabled":I.value,"cdx-lookup--pending":l.value})),{rootClasses:M,rootStyle:$,otherAttrs:x}=D(g,k);function U(n){d.value?d.value.label!==n&&d.value.value!==n&&(i.value=null):e.selected!==null&&e.selected!==n&&(i.value=null),n===""&&b.value.length===0?(s.value=!1,l.value=!1):l.value=!0,u("input",n)}function B(n){v.value=!0;const o=p.value!==null&&p.value!=="";!!(e.menuItems.length>0||r["no-results"])&&(o||b.value.length>0)&&(s.value=!0),u("focus",n)}function F(n){v.value=!1,s.value=!1,u("blur",n)}function A(n){!a.value||I.value||e.menuItems.length===0&&!r["no-results"]||n.key===" "||a.value.delegateKeyNavigation(n)}return O(c,a),t.watch(i,n=>{var o;if(n!==null){const m=d.value?(o=d.value.label)!=null?o:d.value.value:"";p.value!==m&&(p.value=m,u("input",m))}}),t.watch(t.toRef(e,"menuItems"),n=>{v.value&&l.value&&(n.length>0||r["no-results"])&&(s.value=!0),n.length===0&&!r["no-results"]&&(s.value=!1),l.value=!1}),{rootElement:y,textInput:c,menu:a,menuId:f,highlightedId:S,computedInputValue:p,selection:i,expanded:s,computedDisabled:I,computedStatus:C,onInputBlur:F,rootClasses:M,rootStyle:$,otherAttrs:x,onUpdateInput:U,onInputFocus:B,onKeydown:A}}});function z(e,u,g,r,y,c){const a=t.resolveComponent("cdx-text-input"),f=t.resolveComponent("cdx-menu");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-lookup",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.createVNode(a,t.mergeProps({ref:"textInput",modelValue:e.computedInputValue,"onUpdate:modelValue":u[0]||(u[0]=l=>e.computedInputValue=l)},e.otherAttrs,{class:"cdx-lookup__input",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-controls":e.menuId,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,disabled:e.computedDisabled,status:e.computedStatus,"onUpdate:modelValue":e.onUpdateInput,onChange:u[1]||(u[1]=l=>e.$emit("change",l)),onFocus:e.onInputFocus,onBlur:e.onInputBlur,onKeydown:e.onKeydown}),null,16,["modelValue","aria-controls","aria-expanded","aria-activedescendant","disabled","status","onUpdate:modelValue","onFocus","onBlur","onKeydown"]),t.createVNode(f,t.mergeProps({id:e.menuId,ref:"menu",selected:e.selection,"onUpdate:selected":u[2]||(u[2]=l=>e.selection=l),expanded:e.expanded,"onUpdate:expanded":u[3]||(u[3]=l=>e.expanded=l),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:u[4]||(u[4]=l=>e.$emit("load-more"))}),{default:t.withCtx(({menuItem:l})=>[t.renderSlot(e.$slots,"menu-item",{menuItem:l})]),"no-results":t.withCtx(()=>[t.renderSlot(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const H=P._export_sfc(W,[["render",z]]);module.exports=H; +"use strict";const t=require("vue"),N=require("./CdxMenu.cjs"),K=require("./CdxTextInput.cjs"),R=require("./useGeneratedId.cjs"),w=require("./useModelWrapper.cjs"),L=require("./useOptionalModelWrapper.js"),D=require("./useSplitAttributes.cjs"),E=require("./useFieldData.cjs"),O=require("./useFloatingMenu.cjs"),h=require("./constants.js"),P=require("./_plugin-vue_export-helper.js"),T=h.makeStringTypeValidator(h.ValidationStatusTypes),W=t.defineComponent({name:"CdxLookup",components:{CdxMenu:N,CdxTextInput:K},inheritAttrs:!1,props:{selected:{type:[String,Number,null],required:!0},menuItems:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},initialInputValue:{type:[String,Number],default:"",validator:e=>(e&&console.warn('[CdxLookup]: prop "initialInputValue" is deprecated. Use "inputValue" instead.'),!0)},disabled:{type:Boolean,default:!1},menuConfig:{type:Object,default:()=>({})},status:{type:String,default:"default",validator:T}},emits:["update:selected","update:input-value","load-more","input","change","focus","blur"],setup:(e,{emit:u,attrs:g,slots:r})=>{const y=t.ref(),c=t.ref(),a=t.ref(),f=R("lookup-menu"),l=t.ref(!1),s=t.ref(!1),v=t.ref(!1),b=t.ref(e.menuItems),{computedDisabled:I,computedStatus:C}=E(t.toRef(e,"disabled"),t.toRef(e,"status")),V=t.toRef(e,"selected"),i=w(V,u,"update:selected"),d=t.computed(()=>{var n;return(n=a.value)==null?void 0:n.getComputedMenuItems().find(o=>o.value===i.value)}),S=t.computed(()=>{var n,o;return(o=(n=a.value)==null?void 0:n.getHighlightedMenuItem())==null?void 0:o.id}),q=t.ref(e.initialInputValue),p=L.useOptionalModelWrapper(q,t.toRef(e,"inputValue"),u,"update:input-value"),k=t.computed(()=>({"cdx-lookup--disabled":I.value,"cdx-lookup--pending":l.value})),{rootClasses:M,rootStyle:$,otherAttrs:x}=D(g,k);function U(n){d.value?d.value.label!==n&&d.value.value!==n&&(i.value=null):e.selected!==null&&e.selected!==n&&(i.value=null),n===""&&b.value.length===0?(s.value=!1,l.value=!1):l.value=!0,u("input",n)}function B(n){v.value=!0;const o=p.value!==null&&p.value!=="";!!(e.menuItems.length>0||r["no-results"])&&(o||b.value.length>0)&&(s.value=!0),u("focus",n)}function F(n){v.value=!1,s.value=!1,u("blur",n)}function A(n){!a.value||I.value||e.menuItems.length===0&&!r["no-results"]||n.key===" "||a.value.delegateKeyNavigation(n)}return O(c,a),t.watch(i,n=>{var o;if(n!==null){const m=d.value?(o=d.value.label)!=null?o:d.value.value:"";p.value!==m&&(p.value=m,u("input",m))}}),t.watch(t.toRef(e,"menuItems"),n=>{v.value&&l.value&&(n.length>0||r["no-results"])&&(s.value=!0),n.length===0&&!r["no-results"]&&(s.value=!1),l.value=!1}),{rootElement:y,textInput:c,menu:a,menuId:f,highlightedId:S,computedInputValue:p,selection:i,expanded:s,computedDisabled:I,computedStatus:C,onInputBlur:F,rootClasses:M,rootStyle:$,otherAttrs:x,onUpdateInput:U,onInputFocus:B,onKeydown:A}}});function z(e,u,g,r,y,c){const a=t.resolveComponent("cdx-text-input"),f=t.resolveComponent("cdx-menu");return t.openBlock(),t.createElementBlock("div",{ref:"rootElement",class:t.normalizeClass(["cdx-lookup",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.createVNode(a,t.mergeProps({ref:"textInput",modelValue:e.computedInputValue,"onUpdate:modelValue":u[0]||(u[0]=l=>e.computedInputValue=l)},e.otherAttrs,{class:"cdx-lookup__input",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-controls":e.menuId,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,disabled:e.computedDisabled,status:e.computedStatus,"onUpdate:modelValue":e.onUpdateInput,onChange:u[1]||(u[1]=l=>e.$emit("change",l)),onFocus:e.onInputFocus,onBlur:e.onInputBlur,onKeydown:e.onKeydown}),null,16,["modelValue","aria-controls","aria-expanded","aria-activedescendant","disabled","status","onUpdate:modelValue","onFocus","onBlur","onKeydown"]),t.createVNode(f,t.mergeProps({id:e.menuId,ref:"menu",selected:e.selection,"onUpdate:selected":u[2]||(u[2]=l=>e.selection=l),expanded:e.expanded,"onUpdate:expanded":u[3]||(u[3]=l=>e.expanded=l),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:u[4]||(u[4]=l=>e.$emit("load-more"))}),{default:t.withCtx(({menuItem:l})=>[t.renderSlot(e.$slots,"menu-item",{menuItem:l})]),"no-results":t.withCtx(()=>[t.renderSlot(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const H=P._export_sfc(W,[["render",z]]);module.exports=H; diff --git a/resources/lib/codex/modules/CdxMenuItem-bidi.css b/resources/lib/codex/modules/CdxMenuItem-bidi.css index 7f88888e22b5..df187485aaf1 100644 --- a/resources/lib/codex/modules/CdxMenuItem-bidi.css +++ b/resources/lib/codex/modules/CdxMenuItem-bidi.css @@ -1 +1 @@ -.cdx-menu-item{list-style:none;position:relative;line-height:1.6}[dir] .cdx-menu-item{padding:8px 12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}[dir=ltr] .cdx-menu-item__thumbnail.cdx-thumbnail{margin-right:8px}[dir=rtl] .cdx-menu-item__thumbnail.cdx-thumbnail{margin-left:8px}[dir=ltr] .cdx-menu-item__icon{margin-right:8px}[dir=rtl] .cdx-menu-item__icon{margin-left:8px}.cdx-menu-item__selected-icon{height:1.4285714em}[dir=ltr] .cdx-menu-item__selected-icon{margin-left:auto}[dir=rtl] .cdx-menu-item__selected-icon{margin-right:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:inherit}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--highlighted{color:var(--color-base--hover, #404244)}[dir] .cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle, #f8f9fa);cursor:pointer}.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-base--hover, #404244)}.cdx-menu-item--enabled.cdx-menu-item--active{color:var(--color-emphasized, #101418)}[dir] .cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-emphasized, #101418)}[dir] .cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content{color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-progressive--hover, #3056a9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-progressive--active, #233566)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-menu-item--disabled{cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)} +.cdx-menu-item{list-style:none;position:relative;line-height:1.6}[dir] .cdx-menu-item{padding:8px 12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}[dir=ltr] .cdx-menu-item__thumbnail.cdx-thumbnail{margin-right:8px}[dir=rtl] .cdx-menu-item__thumbnail.cdx-thumbnail{margin-left:8px}[dir=ltr] .cdx-menu-item__icon{margin-right:8px}[dir=rtl] .cdx-menu-item__icon{margin-left:8px}.cdx-menu-item__selected-icon{height:1.4285714em}[dir=ltr] .cdx-menu-item__selected-icon{margin-left:auto}[dir=rtl] .cdx-menu-item__selected-icon{margin-right:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}[dir] .cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}[dir] .cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-menu-item--enabled.cdx-menu-item--selected{color:var(--color-progressive, #36c)}[dir] .cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__icon{color:var(--color-progressive, #36c)}[dir] .cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-progressive-subtle--hover, #dce3f9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-progressive--active, #233566)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-menu-item--disabled{cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content,.cdx-menu-item--destructive .cdx-menu-item__text__description,.cdx-menu-item--destructive .cdx-menu-item__icon{color:var(--color-destructive, #bf3c2c)}[dir] .cdx-menu-item--destructive.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-menu-item--destructive.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected{color:var(--color-destructive, #bf3c2c)}[dir] .cdx-menu-item--destructive.cdx-menu-item--selected{background-color:var(--background-color-destructive-subtle, #ffe9e5)}.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__text__description{color:var(--color-destructive, #bf3c2c)}[dir] .cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)}[dir] .cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-destructive--active, #612419)} diff --git a/resources/lib/codex/modules/CdxMenuItem-rtl.css b/resources/lib/codex/modules/CdxMenuItem-rtl.css index 34e8ab46a371..02c03de1139f 100644 --- a/resources/lib/codex/modules/CdxMenuItem-rtl.css +++ b/resources/lib/codex/modules/CdxMenuItem-rtl.css @@ -1 +1 @@ -.cdx-menu-item{list-style:none;position:relative;padding:8px 12px;line-height:1.6;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}.cdx-menu-item__thumbnail.cdx-thumbnail,.cdx-menu-item__icon{margin-left:8px}.cdx-menu-item__selected-icon{height:1.4285714em;margin-right:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:inherit}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base--hover, #404244);cursor:pointer}.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-base--hover, #404244)}.cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418)}.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-emphasized, #101418)}.cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content{color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-progressive--hover, #3056a9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-progressive--active, #233566)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)} +.cdx-menu-item{list-style:none;position:relative;padding:8px 12px;line-height:1.6;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}.cdx-menu-item__thumbnail.cdx-thumbnail,.cdx-menu-item__icon{margin-left:8px}.cdx-menu-item__selected-icon{height:1.4285714em;margin-right:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__icon{color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-progressive-subtle--hover, #dce3f9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-progressive--hover, #3056a9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-progressive--active, #233566)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content,.cdx-menu-item--destructive .cdx-menu-item__text__description,.cdx-menu-item--destructive .cdx-menu-item__icon{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__text__description{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-destructive--active, #612419)} diff --git a/resources/lib/codex/modules/CdxMenuItem.css b/resources/lib/codex/modules/CdxMenuItem.css index 76b3c3fadc76..ee0e6005488c 100644 --- a/resources/lib/codex/modules/CdxMenuItem.css +++ b/resources/lib/codex/modules/CdxMenuItem.css @@ -1 +1 @@ -.cdx-menu-item{list-style:none;position:relative;padding:8px 12px;line-height:1.6;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}.cdx-menu-item__thumbnail.cdx-thumbnail,.cdx-menu-item__icon{margin-right:8px}.cdx-menu-item__selected-icon{height:1.4285714em;margin-left:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:inherit}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base--hover, #404244);cursor:pointer}.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-base--hover, #404244)}.cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418)}.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-emphasized, #101418)}.cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content{color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-progressive--hover, #3056a9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-progressive--active, #233566)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)} +.cdx-menu-item{list-style:none;position:relative;padding:8px 12px;line-height:1.6;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-menu-item__content{display:flex;align-items:center;line-height:1.4285714;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-menu-item__content,.cdx-menu-item__content:hover{text-decoration:none}.cdx-menu-item--has-description .cdx-menu-item__content{align-items:flex-start}.cdx-menu-item__text{max-width:100%}.cdx-menu-item__text__description{display:block}.cdx-menu-item__thumbnail.cdx-thumbnail,.cdx-menu-item__icon{margin-right:8px}.cdx-menu-item__selected-icon{height:1.4285714em;margin-left:auto}.cdx-menu-item__icon.cdx-icon,.cdx-menu-item__selected-icon.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-menu-item--bold-label .cdx-menu-item__text__label{font-weight:700}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text{overflow:hidden}.cdx-menu-item--hide-description-overflow .cdx-menu-item__text__description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdx-menu-item--enabled,.cdx-menu-item--enabled .cdx-menu-item__content{color:var(--color-base, #202122)}.cdx-menu-item--enabled .cdx-menu-item__text__supporting-text,.cdx-menu-item--enabled .cdx-menu-item__text__description{color:var(--color-subtle, #54595d)}.cdx-menu-item--enabled.cdx-menu-item--highlighted{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-menu-item--enabled.cdx-menu-item--active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-menu-item--enabled.cdx-menu-item--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd);color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected .cdx-menu-item__icon{color:var(--color-progressive, #36c)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-progressive-subtle--hover, #dce3f9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-progressive--hover, #3056a9)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-progressive-subtle--active, #cbd6f6)}.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-progressive--active, #233566)}.cdx-menu-item--disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-menu-item--disabled .cdx-menu-item__text__description{color:var(--color-disabled, #a2a9b1)}.cdx-menu-item--destructive .cdx-menu-item__content,.cdx-menu-item--destructive .cdx-menu-item__text__description,.cdx-menu-item--destructive .cdx-menu-item__icon{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--highlighted .cdx-menu-item__icon{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__text__description,.cdx-menu-item--destructive.cdx-menu-item--active .cdx-menu-item__icon{color:var(--color-destructive--active, #612419)}.cdx-menu-item--destructive.cdx-menu-item--selected{background-color:var(--background-color-destructive-subtle, #ffe9e5);color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected .cdx-menu-item__text__description{color:var(--color-destructive, #bf3c2c)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted{background-color:var(--background-color-destructive-subtle--hover, #ffdad3)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description{color:var(--color-destructive--hover, #9f3526)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active{background-color:var(--background-color-destructive-subtle--active, #ffc8bd)}.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__content,.cdx-menu-item--destructive.cdx-menu-item--selected.cdx-menu-item--active .cdx-menu-item__text__description{color:var(--color-destructive--active, #612419)} diff --git a/resources/lib/codex/modules/CdxMultiselectLookup.cjs b/resources/lib/codex/modules/CdxMultiselectLookup.cjs index 45934628841f..b3433bc7c74e 100644 --- a/resources/lib/codex/modules/CdxMultiselectLookup.cjs +++ b/resources/lib/codex/modules/CdxMultiselectLookup.cjs @@ -1 +1 @@ -"use strict";var k=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var w=(e,u)=>{var l={};for(var a in e)T.call(e,a)&&u.indexOf(a)<0&&(l[a]=e[a]);if(e!=null&&k)for(var a of k(e))u.indexOf(a)<0&&z.call(e,a)&&(l[a]=e[a]);return l};var M=(e,u,l)=>new Promise((a,d)=>{var s=n=>{try{r(l.next(n))}catch(i){d(i)}},m=n=>{try{r(l.throw(n))}catch(i){d(i)}},r=n=>n.done?a(n.value):Promise.resolve(n.value).then(s,m);r((l=l.apply(e,u)).next())});const t=require("vue"),E=require("./CdxChipInput.cjs"),H=require("./CdxMenu.cjs"),P=require("./useFieldData.cjs"),j=require("./useFloatingMenu.cjs"),x=require("./useGeneratedId.cjs"),W=require("./useModelWrapper.cjs"),G=require("./useOptionalModelWrapper.js"),J=require("./useSplitAttributes.cjs"),b=require("./constants.js"),Q=require("./_plugin-vue_export-helper.js"),X=b.makeStringTypeValidator(b.ValidationStatusTypes),Y=t.defineComponent({name:"CdxMultiselectLookup",components:{CdxChipInput:E,CdxMenu:H},props:{inputChips:{type:Array,required:!0},selected:{type:[Array],required:!0},menuItems:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},separateInput:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},status:{type:String,default:"default",validator:X},menuConfig:{type:Object,default:()=>({})}},emits:["update:input-chips","update:selected","update:input-value","load-more","input","change","focus","blur"],setup:(e,{emit:u,attrs:l,slots:a})=>{const d=t.ref(),s=t.ref(),m=x("multiselect-lookup-menu"),r=t.computed(()=>{var o,p;return(p=(o=s.value)==null?void 0:o.getHighlightedMenuItem())==null?void 0:p.id}),n=t.ref(!1),i=t.ref(!1),h=t.ref(!1);t.provide(b.AllowArbitraryKey,t.ref(!1));const{computedDisabled:I,computedStatus:A}=P(t.toRef(e,"disabled"),t.toRef(e,"status")),R=t.computed(()=>({"cdx-multiselect-lookup--disabled":I.value,"cdx-multiselect-lookup--pending":n.value})),{rootClasses:B,rootStyle:U,otherAttrs:$}=J(l,R);j(d,s);const g=W(t.toRef(e,"selected"),u,"update:selected"),f=W(t.toRef(e,"inputChips"),u,"update:input-chips"),F=t.ref(""),y=G.useOptionalModelWrapper(F,t.toRef(e,"inputValue"),u,"update:input-value"),C=t.computed(()=>y.value.toString().length>0&&a["no-results"]);function K(o){return M(this,null,function*(){yield t.nextTick(),n.value=o!==null&&o!=="",u("input",o)})}function N(o){h.value=!0,(e.menuItems.length>0||C.value)&&(i.value=!0),u("focus",o)}function D(o){h.value=!1,i.value=!1,u("blur",o)}function L(o){!s.value||I.value||e.menuItems.length===0&&!C.value||o.key===" "||s.value.delegateKeyNavigation(o)}return t.watch(t.toRef(e,"selected"),o=>{const p=o.filter(v=>f.value.find(c=>v===c.value)===void 0);p.length>0&&(p.forEach(v=>{var q;const c=(q=s.value)==null?void 0:q.getComputedMenuItems().find(V=>V.value===v);if(c){const S=c,{id:V}=S,O=w(S,["id"]);f.value.push(O)}}),y.value="",u("input","")),f.value=f.value.filter(v=>o.find(c=>v.value===c)!==void 0)}),t.watch(t.toRef(e,"inputChips"),o=>{o.length<g.value.length&&(g.value=o.map(p=>p.value))}),t.watch(t.toRef(e,"menuItems"),o=>{o.length===0&&!C.value?i.value=!1:h.value&&n.value&&(i.value=!0),n.value=!1}),{chipInput:d,menu:s,menuId:m,highlightedId:r,expanded:i,computedDisabled:I,computedStatus:A,rootClasses:B,rootStyle:U,otherAttrs:$,selectedWrapper:g,inputChipsWrapper:f,computedInputValue:y,onUpdateInputValue:K,onInputBlur:D,onInputFocus:N,onKeydown:L}}});function Z(e,u,l,a,d,s){const m=t.resolveComponent("cdx-chip-input"),r=t.resolveComponent("cdx-menu");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["cdx-multiselect-lookup",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.createVNode(m,t.mergeProps({ref:"chipInput","input-chips":e.inputChipsWrapper,"onUpdate:inputChips":u[0]||(u[0]=n=>e.inputChipsWrapper=n),"input-value":e.computedInputValue,"onUpdate:inputValue":u[1]||(u[1]=n=>e.computedInputValue=n)},e.otherAttrs,{class:"cdx-multiselect-lookup__chip-input",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-controls":e.menuId,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,"separate-input":e.separateInput,disabled:e.computedDisabled,status:e.computedStatus,"disallow-arbitrary":!0,"onUpdate:inputValue":e.onUpdateInputValue,onFocus:e.onInputFocus,onBlur:e.onInputBlur,onKeydown:e.onKeydown}),null,16,["input-chips","input-value","aria-controls","aria-expanded","aria-activedescendant","separate-input","disabled","status","onUpdate:inputValue","onFocus","onBlur","onKeydown"]),t.createVNode(r,t.mergeProps({id:e.menuId,ref:"menu",selected:e.selectedWrapper,"onUpdate:selected":u[2]||(u[2]=n=>e.selectedWrapper=n),expanded:e.expanded,"onUpdate:expanded":u[3]||(u[3]=n=>e.expanded=n),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:u[4]||(u[4]=n=>e.$emit("load-more"))}),{default:t.withCtx(({menuItem:n})=>[t.renderSlot(e.$slots,"menu-item",{menuItem:n})]),"no-results":t.withCtx(()=>[t.renderSlot(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const _=Q._export_sfc(Y,[["render",Z]]);module.exports=_; +"use strict";var k=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var M=(e,n)=>{var l={};for(var a in e)T.call(e,a)&&n.indexOf(a)<0&&(l[a]=e[a]);if(e!=null&&k)for(var a of k(e))n.indexOf(a)<0&&z.call(e,a)&&(l[a]=e[a]);return l};var w=(e,n,l)=>new Promise((a,d)=>{var s=u=>{try{p(l.next(u))}catch(i){d(i)}},f=u=>{try{p(l.throw(u))}catch(i){d(i)}},p=u=>u.done?a(u.value):Promise.resolve(u.value).then(s,f);p((l=l.apply(e,n)).next())});const t=require("vue"),E=require("./CdxChipInput.cjs"),H=require("./CdxMenu.cjs"),P=require("./useFieldData.cjs"),j=require("./useFloatingMenu.cjs"),G=require("./useGeneratedId.cjs"),W=require("./useModelWrapper.cjs"),x=require("./useOptionalModelWrapper.js"),J=require("./useSplitAttributes.cjs"),b=require("./constants.js"),Q=require("./_plugin-vue_export-helper.js"),X=b.makeStringTypeValidator(b.ValidationStatusTypes),Y=t.defineComponent({name:"CdxMultiselectLookup",components:{CdxChipInput:E,CdxMenu:H},props:{inputChips:{type:Array,required:!0},selected:{type:[Array],required:!0},menuItems:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},separateInput:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},status:{type:String,default:"default",validator:X},menuConfig:{type:Object,default:()=>({})}},emits:["update:input-chips","update:selected","update:input-value","load-more","input","change","focus","blur"],setup:(e,{emit:n,attrs:l,slots:a})=>{const d=t.ref(),s=t.ref(),f=G("multiselect-lookup-menu"),p=t.computed(()=>{var o,r;return(r=(o=s.value)==null?void 0:o.getHighlightedMenuItem())==null?void 0:r.id}),u=t.ref(!1),i=t.ref(!1),h=t.ref(!1);t.provide(b.AllowArbitraryKey,t.ref(!1));const{computedDisabled:y,computedStatus:A}=P(t.toRef(e,"disabled"),t.toRef(e,"status")),B=t.computed(()=>({"cdx-multiselect-lookup--disabled":y.value,"cdx-multiselect-lookup--pending":u.value})),{rootClasses:R,rootStyle:U,otherAttrs:$}=J(l,B);j(d,s);const I=W(t.toRef(e,"selected"),n,"update:selected"),m=W(t.toRef(e,"inputChips"),n,"update:input-chips"),F=t.ref(""),g=x.useOptionalModelWrapper(F,t.toRef(e,"inputValue"),n,"update:input-value"),C=t.computed(()=>g.value.toString().length>0&&a["no-results"]);function K(o){return w(this,null,function*(){yield t.nextTick(),u.value=o!==null&&o!=="",n("input",o)})}function N(o){h.value=!0,(e.menuItems.length>0||C.value)&&(i.value=!0),n("focus",o)}function D(o){h.value=!1,i.value=!1,n("blur",o)}function L(o){!s.value||y.value||e.menuItems.length===0&&!C.value||o.key===" "||s.value.delegateKeyNavigation(o)}return t.watch(t.toRef(e,"selected"),o=>{const r=o.filter(v=>m.value.find(c=>v===c.value)===void 0);r.length>0&&(r.forEach(v=>{var q;const c=(q=s.value)==null?void 0:q.getComputedMenuItems().find(V=>V.value===v);if(c){const S=c,{id:V}=S,O=M(S,["id"]);m.value.push(O)}}),g.value="",n("input","")),m.value=m.value.filter(v=>o.find(c=>v.value===c)!==void 0)}),t.watch(t.toRef(e,"inputChips"),o=>{o.length<I.value.length&&(I.value=o.map(r=>r.value))}),t.watch(t.toRef(e,"menuItems"),o=>{o.length===0&&!C.value?i.value=!1:h.value&&u.value&&(i.value=!0),u.value=!1}),{chipInput:d,menu:s,menuId:f,highlightedId:p,expanded:i,computedDisabled:y,computedStatus:A,rootClasses:R,rootStyle:U,otherAttrs:$,selectedWrapper:I,inputChipsWrapper:m,computedInputValue:g,onUpdateInputValue:K,onInputBlur:D,onInputFocus:N,onKeydown:L}}});function Z(e,n,l,a,d,s){const f=t.resolveComponent("cdx-chip-input"),p=t.resolveComponent("cdx-menu");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["cdx-multiselect-lookup",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.createVNode(f,t.mergeProps({ref:"chipInput","input-chips":e.inputChipsWrapper,"onUpdate:inputChips":n[0]||(n[0]=u=>e.inputChipsWrapper=u),"input-value":e.computedInputValue,"onUpdate:inputValue":n[1]||(n[1]=u=>e.computedInputValue=u)},e.otherAttrs,{class:"cdx-multiselect-lookup__chip-input",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-controls":e.menuId,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,"separate-input":e.separateInput,readonly:e.readonly,disabled:e.computedDisabled,status:e.computedStatus,"onUpdate:inputValue":e.onUpdateInputValue,onFocus:e.onInputFocus,onBlur:e.onInputBlur,onKeydown:e.onKeydown}),null,16,["input-chips","input-value","aria-controls","aria-expanded","aria-activedescendant","separate-input","readonly","disabled","status","onUpdate:inputValue","onFocus","onBlur","onKeydown"]),t.createVNode(p,t.mergeProps({id:e.menuId,ref:"menu",selected:e.selectedWrapper,"onUpdate:selected":n[2]||(n[2]=u=>e.selectedWrapper=u),expanded:e.expanded,"onUpdate:expanded":n[3]||(n[3]=u=>e.expanded=u),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:n[4]||(n[4]=u=>e.$emit("load-more"))}),{default:t.withCtx(({menuItem:u})=>[t.renderSlot(e.$slots,"menu-item",{menuItem:u})]),"no-results":t.withCtx(()=>[t.renderSlot(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const _=Q._export_sfc(Y,[["render",Z]]);module.exports=_; diff --git a/resources/lib/codex/modules/CdxRadio-bidi.css b/resources/lib/codex/modules/CdxRadio-bidi.css index 5312f7ec975f..0fed7af6f463 100644 --- a/resources/lib/codex/modules/CdxRadio-bidi.css +++ b/resources/lib/codex/modules/CdxRadio-bidi.css @@ -1 +1 @@ -.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column}[dir] .cdx-radio:not(.cdx-radio--inline){margin-bottom:12px}[dir] .cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;white-space:nowrap}[dir=ltr] .cdx-radio--inline{margin-right:16px}[dir=rtl] .cdx-radio--inline{margin-left:16px}[dir=ltr] .cdx-radio--inline:last-child{margin-right:0}[dir=rtl] .cdx-radio--inline:last-child{margin-left:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;line-height:1.4285714}[dir=ltr] .cdx-radio__label,[dir=ltr] .cdx-radio__label.cdx-label{padding-left:calc(1.25rem + 8px)}[dir=rtl] .cdx-radio__label,[dir=rtl] .cdx-radio__label.cdx-label{padding-right:calc(1.25rem + 8px)}[dir] .cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{position:absolute;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir=ltr] .cdx-radio__icon{left:0}[dir=rtl] .cdx-radio__icon{right:0}.cdx-radio__input{opacity:0;position:absolute;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;font-size:inherit}[dir] .cdx-radio__input{margin:0;cursor:inherit}[dir=ltr] .cdx-radio__input{left:0}[dir=rtl] .cdx-radio__input{right:0}[dir] .cdx-radio:hover>.cdx-radio__input:enabled,[dir] .cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,[dir] .cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}[dir] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px}[dir=ltr] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-left:calc(1.25rem + 8px)}[dir=rtl] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-right:calc(1.25rem + 8px)}[dir] .cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;bottom:-.25rem}[dir] .cdx-radio__icon:before{right:-.25rem;left:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}[dir] .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}[dir] .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--border-color-progressive, #36c)}[dir] .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--border-color-progressive--hover, #3056a9)}[dir] .cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}[dir] .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}[dir] .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;bottom:2px}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{right:2px;left:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} +.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column}[dir] .cdx-radio:not(.cdx-radio--inline){margin-bottom:12px}[dir] .cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;white-space:nowrap}[dir=ltr] .cdx-radio--inline{margin-right:16px}[dir=rtl] .cdx-radio--inline{margin-left:16px}[dir=ltr] .cdx-radio--inline:last-child{margin-right:0}[dir=rtl] .cdx-radio--inline:last-child{margin-left:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;line-height:1.4285714}[dir=ltr] .cdx-radio__label,[dir=ltr] .cdx-radio__label.cdx-label{padding-left:calc(1.25rem + 8px)}[dir=rtl] .cdx-radio__label,[dir=rtl] .cdx-radio__label.cdx-label{padding-right:calc(1.25rem + 8px)}[dir] .cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{position:absolute;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir=ltr] .cdx-radio__icon{left:0}[dir=rtl] .cdx-radio__icon{right:0}.cdx-radio__input{opacity:0;position:absolute;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;font-size:inherit}[dir] .cdx-radio__input{margin:0;cursor:inherit}[dir=ltr] .cdx-radio__input{left:0}[dir=rtl] .cdx-radio__input{right:0}[dir] .cdx-radio:hover>.cdx-radio__input:enabled,[dir] .cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,[dir] .cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}[dir] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px}[dir=ltr] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-left:calc(1.25rem + 8px)}[dir=rtl] .cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-right:calc(1.25rem + 8px)}[dir] .cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;bottom:-.25rem}[dir] .cdx-radio__icon:before{right:-.25rem;left:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}[dir] .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}[dir] .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--background-color-progressive, #36c)}[dir] .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-progressive--hover, #3056a9)}[dir] .cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}[dir] .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-progressive--active, #233566)}[dir] .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--background-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;bottom:2px}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{right:2px;left:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}[dir] .cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} diff --git a/resources/lib/codex/modules/CdxRadio-rtl.css b/resources/lib/codex/modules/CdxRadio-rtl.css index f29bf8f496af..118370b35362 100644 --- a/resources/lib/codex/modules/CdxRadio-rtl.css +++ b/resources/lib/codex/modules/CdxRadio-rtl.css @@ -1 +1 @@ -.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column;margin-bottom:12px}.cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;margin-left:16px;white-space:nowrap}.cdx-radio--inline:last-child{margin-left:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;padding-right:calc(1.25rem + 8px);line-height:1.4285714}.cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);position:absolute;right:0;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-radio__input{opacity:0;position:absolute;right:0;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;margin:0;font-size:inherit;cursor:inherit}.cdx-radio:hover>.cdx-radio__input:enabled,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}.cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px;padding-right:calc(1.25rem + 8px)}.cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;left:-.25rem;bottom:-.25rem;right:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}.cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}.cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--border-color-progressive, #36c)}.cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}.cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}.cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;left:2px;bottom:2px;right:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}.cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} +.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column;margin-bottom:12px}.cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;margin-left:16px;white-space:nowrap}.cdx-radio--inline:last-child{margin-left:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;padding-right:calc(1.25rem + 8px);line-height:1.4285714}.cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);position:absolute;right:0;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-radio__input{opacity:0;position:absolute;right:0;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;margin:0;font-size:inherit;cursor:inherit}.cdx-radio:hover>.cdx-radio__input:enabled,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}.cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px;padding-right:calc(1.25rem + 8px)}.cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;left:-.25rem;bottom:-.25rem;right:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}.cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}.cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--background-color-progressive, #36c)}.cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-progressive--hover, #3056a9)}.cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-progressive--active, #233566)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--background-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}.cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}.cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;left:2px;bottom:2px;right:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}.cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} diff --git a/resources/lib/codex/modules/CdxRadio.css b/resources/lib/codex/modules/CdxRadio.css index 398aae89e499..1f0181192279 100644 --- a/resources/lib/codex/modules/CdxRadio.css +++ b/resources/lib/codex/modules/CdxRadio.css @@ -1 +1 @@ -.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column;margin-bottom:12px}.cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;margin-right:16px;white-space:nowrap}.cdx-radio--inline:last-child{margin-right:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;padding-left:calc(1.25rem + 8px);line-height:1.4285714}.cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);position:absolute;left:0;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-radio__input{opacity:0;position:absolute;left:0;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;margin:0;font-size:inherit;cursor:inherit}.cdx-radio:hover>.cdx-radio__input:enabled,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}.cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px;padding-left:calc(1.25rem + 8px)}.cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;right:-.25rem;bottom:-.25rem;left:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}.cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}.cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--border-color-progressive, #36c)}.cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}.cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}.cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;right:2px;bottom:2px;left:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}.cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} +.cdx-radio{position:relative;min-width:20px;min-height:20px}.cdx-radio__wrapper{display:flex}.cdx-radio:not(.cdx-radio--inline){display:flex;flex-direction:column;margin-bottom:12px}.cdx-radio:not(.cdx-radio--inline):last-child{margin-bottom:0}.cdx-radio--inline{display:inline-flex;margin-right:16px;white-space:nowrap}.cdx-radio--inline:last-child{margin-right:0}.cdx-radio__label,.cdx-radio__label.cdx-label{display:inline-flex;position:relative;z-index:0;padding-left:calc(1.25rem + 8px);line-height:1.4285714}.cdx-radio__label.cdx-label{padding-bottom:0}.cdx-radio__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-radio--inline .cdx-radio__label{display:inline}.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);position:absolute;left:0;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border-width:1px;border-style:solid;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-radio__input{opacity:0;position:absolute;left:0;z-index:1;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;margin:0;font-size:inherit;cursor:inherit}.cdx-radio:hover>.cdx-radio__input:enabled,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-label .cdx-label__label,.cdx-radio:hover>.cdx-radio__input:enabled~.cdx-radio__label:not(.cdx-label){cursor:pointer}.cdx-radio__custom-input:not(.cdx-radio__custom-input--inline){padding-top:6px;padding-left:calc(1.25rem + 8px)}.cdx-radio__icon{border-radius:50%}.cdx-radio__icon:before{content:" ";position:absolute;top:-.25rem;right:-.25rem;bottom:-.25rem;left:-.25rem;border:1px solid var(--border-color-transparent, transparent);border-radius:50%}.cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d)}.cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-radio__input:enabled:focus:not(:active)+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-width:6px;border-color:var(--background-color-progressive, #36c)}.cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-progressive--hover, #3056a9)}.cdx-radio__input:enabled:checked:focus+.cdx-radio__icon:before{border-color:var(--border-color-inverted, #fff)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-progressive--active, #233566)}.cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--background-color-progressive--active, #233566)}.cdx-radio--status-error .cdx-radio__input:enabled~.cdx-radio__label{color:var(--color-error, #bf3c2c)}.cdx-radio--status-error .cdx-radio__input:enabled+.cdx-radio__icon{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:hover+.cdx-radio__icon{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-radio--status-error .cdx-radio__input:enabled:focus+.cdx-radio__icon{border-color:var(--border-color-progressive--focus, #36c)}.cdx-radio--status-error .cdx-radio__input:enabled:active+.cdx-radio__icon{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked+.cdx-radio__icon{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:hover+.cdx-radio__icon{border-color:var(--background-color-error--hover, #d74032)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon{border-width:1px}.cdx-radio--status-error .cdx-radio__input:enabled:checked:focus:not(.cdx-radio--status-error .cdx-radio__input:enabled:checked:active)+.cdx-radio__icon:before{top:2px;right:2px;bottom:2px;left:2px;border-width:4px;border-color:var(--border-color-error, #f54739)}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon{border-color:var(--background-color-error--active, #bf3c2c);box-shadow:none}.cdx-radio--status-error .cdx-radio__input:enabled:checked:active+.cdx-radio__icon:before{border-color:var(--border-color-transparent, transparent)}.cdx-radio__input:disabled~.cdx-radio__label,.cdx-radio__input:disabled~.cdx-radio__label.cdx-label{color:var(--color-disabled, #a2a9b1)}.cdx-radio__input:disabled+.cdx-radio__icon{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-radio__input:disabled:checked+.cdx-radio__icon{background-color:var(--color-disabled-emphasized, #a2a9b1);border-width:6px;border-color:var(--background-color-disabled, #dadde3)} diff --git a/resources/lib/codex/modules/CdxSelect-bidi.css b/resources/lib/codex/modules/CdxSelect-bidi.css index aaebbe64d6f4..972be63b0601 100644 --- a/resources/lib/codex/modules/CdxSelect-bidi.css +++ b/resources/lib/codex/modules/CdxSelect-bidi.css @@ -1 +1 @@ -.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none}[dir] .cdx-select{border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;background-repeat:no-repeat;background-size:max(.75rem,12px)}[dir=ltr] .cdx-select{padding-left:12px;padding-right:calc(16px + 1.25rem);background-position:center right 12px}[dir=rtl] .cdx-select{padding-right:12px;padding-left:calc(16px + 1.25rem);background-position:center left 12px}.cdx-select:disabled{color:var(--color-disabled, #a2a9b1);opacity:1}[dir] .cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled{color:var(--color-base, #202122)}[dir] .cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled:hover{color:var(--color-base--hover, #404244)}[dir] .cdx-select:enabled:hover{background-color:var(--background-color-base, #fff);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select:enabled:focus{outline:1px solid transparent}[dir] .cdx-select:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-select:enabled:active{color:var(--color-emphasized, #101418)}[dir] .cdx-select:enabled:active{border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;font-size:inherit;line-height:1.375;position:relative;width:100%}[dir] .cdx-select-vue__handle{border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px}[dir=ltr] .cdx-select-vue__handle{padding-left:12px;padding-right:calc(16px + 1.25rem)}[dir=rtl] .cdx-select-vue__handle{padding-right:12px;padding-left:calc(16px + 1.25rem)}[dir=ltr] .cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-left:calc(20px + 1.25rem)}[dir=rtl] .cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-right:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-select-vue__start-icon.cdx-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-select-vue__start-icon.cdx-icon{left:12px}[dir=rtl] .cdx-select-vue__start-icon.cdx-icon{right:12px}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem}[dir] .cdx-select-vue__indicator.cdx-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-select-vue__indicator.cdx-icon{right:12px}[dir=rtl] .cdx-select-vue__indicator.cdx-icon{left:12px}.cdx-select-vue--enabled .cdx-select-vue__handle{color:var(--color-base, #202122)}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-select-vue--enabled .cdx-select-vue__handle:hover{color:var(--color-base--hover, #404244)}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-base, #fff);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select-vue--enabled .cdx-select-vue__handle:focus{outline:1px solid transparent}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-select-vue--enabled .cdx-select-vue__handle:active{color:var(--color-emphasized, #101418)}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:active{border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue--enabled .cdx-select-vue__handle:hover .cdx-select-vue__indicator{color:var(--color-base--hover, #404244)}[dir] .cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle .cdx-select-vue__indicator{color:var(--color-base, #202122)}.cdx-select-vue--disabled .cdx-select-vue__handle{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus){color:var(--color-error, #bf3c2c)}[dir] .cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-dialog .cdx-select-vue{position:static} +.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none}[dir] .cdx-select{border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;background-repeat:no-repeat;background-size:max(.75rem,12px)}[dir=ltr] .cdx-select{padding-left:8px;padding-right:calc(16px + 1.25rem);background-position:center right 12px}[dir=rtl] .cdx-select{padding-right:8px;padding-left:calc(16px + 1.25rem);background-position:center left 12px}.cdx-select:disabled{color:var(--color-disabled, #a2a9b1);opacity:1}[dir] .cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled{color:var(--color-subtle, #54595d)}[dir] .cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}[dir] .cdx-select:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}[dir] .cdx-select:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select:enabled:focus:not(:active){outline:1px solid transparent}[dir] .cdx-select:enabled:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;font-size:inherit;line-height:1.375;position:relative;width:100%}[dir] .cdx-select-vue__handle{border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px}[dir=ltr] .cdx-select-vue__handle{padding-left:8px;padding-right:calc(16px + 1.25rem)}[dir=rtl] .cdx-select-vue__handle{padding-right:8px;padding-left:calc(16px + 1.25rem)}[dir=ltr] .cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-left:calc(20px + 1.25rem)}[dir=rtl] .cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-right:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{color:var(--color-subtle, #54595d);position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-select-vue__start-icon.cdx-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-select-vue__start-icon.cdx-icon{left:12px}[dir=rtl] .cdx-select-vue__start-icon.cdx-icon{right:12px}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem}[dir] .cdx-select-vue__indicator.cdx-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-select-vue__indicator.cdx-icon{right:12px}[dir=rtl] .cdx-select-vue__indicator.cdx-icon{left:12px}.cdx-select-vue--enabled .cdx-select-vue__handle{color:var(--color-subtle, #54595d)}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){outline:1px solid transparent}[dir] .cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle{color:var(--color-base, #202122)}[dir] .cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--disabled .cdx-select-vue__handle{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle{color:var(--color-error, #bf3c2c)}[dir] .cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus){color:var(--color-error--hover, #9f3526)}[dir] .cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus){background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active{color:var(--color-error--active, #612419)}[dir] .cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-error-subtle--active, #ffc8bd);border-color:var(--border-color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active .cdx-select-vue__start-icon{color:var(--color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){color:var(--color-subtle, #54595d)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active){color:var(--color-base, #202122)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active) .cdx-select-vue__start-icon{color:var(--color-base, #202122)}.cdx-dialog .cdx-select-vue{position:static} diff --git a/resources/lib/codex/modules/CdxSelect-rtl.css b/resources/lib/codex/modules/CdxSelect-rtl.css index 9a8be17a68f2..d0cf83e420e5 100644 --- a/resources/lib/codex/modules/CdxSelect-rtl.css +++ b/resources/lib/codex/modules/CdxSelect-rtl.css @@ -1 +1 @@ -.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-right:12px;padding-left:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none;background-position:center left 12px;background-repeat:no-repeat;background-size:max(.75rem,12px)}.cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');opacity:1}.cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select:enabled:active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-right:12px;padding-left:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;position:relative;width:100%}.cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-right:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;right:12px;transform:translateY(-50%)}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem;transition-property:color;transition-duration:.1s;left:12px;transform:translateY(-50%)}.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select-vue--enabled .cdx-select-vue__handle:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue--enabled .cdx-select-vue__handle:active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue--enabled .cdx-select-vue__handle:hover .cdx-select-vue__indicator{color:var(--color-base--hover, #404244)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle .cdx-select-vue__indicator{color:var(--color-base, #202122)}.cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-dialog .cdx-select-vue{position:static} +.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-right:8px;padding-left:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none;background-position:center left 12px;background-repeat:no-repeat;background-size:max(.75rem,12px)}.cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');opacity:1}.cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-subtle, #54595d);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-select:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select:enabled:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-right:8px;padding-left:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;position:relative;width:100%}.cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-right:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{color:var(--color-subtle, #54595d);position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;right:12px;transform:translateY(-50%)}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem;transition-property:color;transition-duration:.1s;left:12px;transform:translateY(-50%)}.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-subtle, #54595d);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle{color:var(--color-base, #202122)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus){background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-error-subtle--active, #ffc8bd);color:var(--color-error--active, #612419);border-color:var(--border-color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active .cdx-select-vue__start-icon{color:var(--color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){color:var(--color-subtle, #54595d)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active){color:var(--color-base, #202122)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active) .cdx-select-vue__start-icon{color:var(--color-base, #202122)}.cdx-dialog .cdx-select-vue{position:static} diff --git a/resources/lib/codex/modules/CdxSelect.css b/resources/lib/codex/modules/CdxSelect.css index 07ad1c79a7c4..4de2211b4632 100644 --- a/resources/lib/codex/modules/CdxSelect.css +++ b/resources/lib/codex/modules/CdxSelect.css @@ -1 +1 @@ -.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-left:12px;padding-right:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none;background-position:center right 12px;background-repeat:no-repeat;background-size:max(.75rem,12px)}.cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');opacity:1}.cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select:enabled:active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-left:12px;padding-right:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;position:relative;width:100%}.cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-left:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;left:12px;transform:translateY(-50%)}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem;transition-property:color;transition-duration:.1s;right:12px;transform:translateY(-50%)}.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-base, #a2a9b1);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-select-vue--enabled .cdx-select-vue__handle:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue--enabled .cdx-select-vue__handle:active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d)}.cdx-select-vue--enabled .cdx-select-vue__handle:hover .cdx-select-vue__indicator{color:var(--color-base--hover, #404244)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle .cdx-select-vue__indicator{color:var(--color-base, #202122)}.cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:not(:focus):hover .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-dialog .cdx-select-vue{position:static} +.cdx-select{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-left:8px;padding-right:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;-webkit-appearance:none;appearance:none;background-position:center right 12px;background-repeat:no-repeat;background-size:max(.75rem,12px)}.cdx-select:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%2372777d"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>');opacity:1}.cdx-select:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-subtle, #54595d);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23202122"><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"/></svg>')}.cdx-select:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-select:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select:enabled:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue{display:inline-block;position:relative}.cdx-select-vue__handle{box-sizing:border-box;min-width:256px;min-height:32px;border-width:1px;border-style:solid;border-radius:2px;padding-top:4px;padding-bottom:4px;padding-left:8px;padding-right:calc(16px + 1.25rem);font-size:inherit;line-height:1.375;position:relative;width:100%}.cdx-select-vue--has-start-icon .cdx-select-vue__handle{padding-left:calc(20px + 1.25rem)}.cdx-select-vue__start-icon.cdx-icon{color:var(--color-subtle, #54595d);position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;left:12px;transform:translateY(-50%)}.cdx-select-vue__indicator.cdx-icon{color:var(--color-base, #202122);position:absolute;top:50%;min-width:12px;min-height:12px;width:.75rem;height:.75rem;transition-property:color;transition-duration:.1s;right:12px;transform:translateY(-50%)}.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-subtle, #54595d);border-color:var(--border-color-interactive, #72777d);transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-select-vue--enabled .cdx-select-vue__handle:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){background-color:var(--background-color-base, #fff);border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle{color:var(--color-base, #202122)}.cdx-select-vue--enabled.cdx-select-vue--expanded .cdx-select-vue__handle{background-color:var(--background-color-base, #fff)}.cdx-select-vue--disabled .cdx-select-vue__handle{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1);cursor:default}.cdx-select-vue--disabled .cdx-select-vue__indicator,.cdx-select-vue--disabled .cdx-select-vue__start-icon{color:var(--color-disabled, #a2a9b1)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle{background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle .cdx-select-vue__start-icon{color:var(--color-error, #bf3c2c)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus){background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:hover:not(:focus) .cdx-select-vue__start-icon{color:var(--color-error--hover, #9f3526)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active{background-color:var(--background-color-error-subtle--active, #ffc8bd);color:var(--color-error--active, #612419);border-color:var(--border-color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:active .cdx-select-vue__start-icon{color:var(--color-error--active, #612419)}.cdx-select-vue--status-error.cdx-select-vue--enabled .cdx-select-vue__handle:focus:not(:active){color:var(--color-subtle, #54595d)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active){color:var(--color-base, #202122)}.cdx-select-vue--status-error.cdx-select-vue--enabled.cdx-select-vue--value-selected .cdx-select-vue__handle:focus:not(:active) .cdx-select-vue__start-icon{color:var(--color-base, #202122)}.cdx-dialog .cdx-select-vue{position:static} diff --git a/resources/lib/codex/modules/CdxTable-bidi.css b/resources/lib/codex/modules/CdxTable-bidi.css index 55a3b7996121..2d31dc61a1d3 100644 --- a/resources/lib/codex/modules/CdxTable-bidi.css +++ b/resources/lib/codex/modules/CdxTable-bidi.css @@ -1 +1 @@ -.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px}[dir] .cdx-table-pager{padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem}[dir] .cdx-table-pager__center{text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>')}[dir] .cdx-table-pager__icon--first{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--first[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>')}[dir] .cdx-table-pager__icon--previous{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--previous[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>')}[dir] .cdx-table-pager__icon--next{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--next[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>')}[dir] .cdx-table-pager__icon--last{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--last[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}[dir] .cdx-table{border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px}[dir] .cdx-table__header{padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}[dir] .cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block}[dir=ltr] .cdx-table__pagination-status--short{text-align:right}[dir=rtl] .cdx-table__pagination-status--short{text-align:left}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block}[dir] .cdx-table__pagination-status--long{text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-table__table caption{margin:-1px;border:0;padding:0}[dir] .cdx-table__table th,[dir] .cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418)}[dir=ltr] .cdx-table__table th{text-align:left}[dir=rtl] .cdx-table__table th{text-align:right}.cdx-table__table thead th{vertical-align:bottom}[dir] .cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table tfoot td,[dir] .cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{vertical-align:top}[dir] .cdx-table__table tbody td,[dir] .cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1)}[dir] .cdx-table__table tbody tr:first-child td,[dir] .cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{display:flex;align-items:flex-end;gap:8px;width:100%;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-decoration:none}[dir] .cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);border:0;padding:12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir=ltr] .cdx-table__table__sort-button{text-align:left}[dir=rtl] .cdx-table__table__sort-button{text-align:right}[dir] .cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}[dir] .cdx-table__table__sort-button:active{background-color:var(--background-color-interactive, #eaecf0);border-color:var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>')}[dir] .cdx-table__table__sort-icon--unsorted{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>')}[dir] .cdx-table__table__sort-icon--asc{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>')}[dir] .cdx-table__table__sort-icon--desc{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}[dir] .cdx-table__table .cdx-table__table__cell--align-center{text-align:center}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-end{text-align:right}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-end{text-align:left}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{text-align:right}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{text-align:left}[dir] .cdx-table__table .cdx-table__table__cell--align-number,.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{text-align:right}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row-reverse}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row}[dir] .cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}[dir] .cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}[dir=ltr] .cdx-table__table--borders-vertical th,[dir=ltr] .cdx-table__table--borders-vertical td{border-right:1px solid var(--border-color-subtle, #c8ccd1)}[dir=rtl] .cdx-table__table--borders-vertical th,[dir=rtl] .cdx-table__table--borders-vertical td{border-left:1px solid var(--border-color-subtle, #c8ccd1)}[dir=ltr] .cdx-table__table--borders-vertical th:last-child,[dir=ltr] .cdx-table__table--borders-vertical td:last-child{border-right:0}[dir=rtl] .cdx-table__table--borders-vertical th:last-child,[dir=rtl] .cdx-table__table--borders-vertical td:last-child{border-left:0}[dir] .cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;vertical-align:middle}[dir] tbody td.cdx-table__table__empty-state-content{text-align:center}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px}[dir] .cdx-table__footer{border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} +.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px}[dir] .cdx-table-pager{padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem}[dir] .cdx-table-pager__center{text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>')}[dir] .cdx-table-pager__icon--first{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--first[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>')}[dir] .cdx-table-pager__icon--previous{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--previous[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>')}[dir] .cdx-table-pager__icon--next{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--next[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>')}[dir] .cdx-table-pager__icon--last{background-color:var(--color-base, #202122)}}[dir] .cdx-table-pager__icon--last[dir=rtl],html[dir][dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}[dir] .cdx-table{border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px}[dir] .cdx-table__header{padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}[dir] .cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block}[dir=ltr] .cdx-table__pagination-status--short{text-align:right}[dir=rtl] .cdx-table__pagination-status--short{text-align:left}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block}[dir] .cdx-table__pagination-status--long{text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;overflow:hidden}[dir] .cdx-table__table caption{margin:-1px;border:0;padding:0}[dir] .cdx-table__table th,[dir] .cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418)}[dir=ltr] .cdx-table__table th{text-align:left}[dir=rtl] .cdx-table__table th{text-align:right}.cdx-table__table thead th{vertical-align:bottom}[dir] .cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table tfoot td,[dir] .cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{vertical-align:top}[dir] .cdx-table__table tbody td,[dir] .cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1)}[dir] .cdx-table__table tbody tr:first-child td,[dir] .cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{display:flex;align-items:flex-end;gap:8px;width:100%;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-decoration:none}[dir] .cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);border:0;padding:12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir=ltr] .cdx-table__table__sort-button{text-align:left}[dir=rtl] .cdx-table__table__sort-button{text-align:right}[dir] .cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}[dir] .cdx-table__table__sort-button:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>')}[dir] .cdx-table__table__sort-icon--unsorted{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>')}[dir] .cdx-table__table__sort-icon--asc{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>')}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>')}[dir] .cdx-table__table__sort-icon--desc{background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}[dir] .cdx-table__table .cdx-table__table__cell--align-center{text-align:center}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-end{text-align:right}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-end{text-align:left}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{text-align:right}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{text-align:left}[dir] .cdx-table__table .cdx-table__table__cell--align-number,.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{text-align:right}[dir=ltr] .cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row-reverse}[dir=rtl] .cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row}[dir] .cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}[dir] .cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}[dir=ltr] .cdx-table__table--borders-vertical th,[dir=ltr] .cdx-table__table--borders-vertical td{border-right:1px solid var(--border-color-subtle, #c8ccd1)}[dir=rtl] .cdx-table__table--borders-vertical th,[dir=rtl] .cdx-table__table--borders-vertical td{border-left:1px solid var(--border-color-subtle, #c8ccd1)}[dir=ltr] .cdx-table__table--borders-vertical th:last-child,[dir=ltr] .cdx-table__table--borders-vertical td:last-child{border-right:0}[dir=rtl] .cdx-table__table--borders-vertical th:last-child,[dir=rtl] .cdx-table__table--borders-vertical td:last-child{border-left:0}[dir] .cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] .cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}[dir] thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;vertical-align:middle}[dir] tbody td.cdx-table__table__empty-state-content{text-align:center}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px}[dir] .cdx-table__footer{border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} diff --git a/resources/lib/codex/modules/CdxTable-rtl.css b/resources/lib/codex/modules/CdxTable-rtl.css index fa4ee80c445b..7fdcbfe0ef1e 100644 --- a/resources/lib/codex/modules/CdxTable-rtl.css +++ b/resources/lib/codex/modules/CdxTable-rtl.css @@ -1 +1 @@ -.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem;text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--first[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--previous[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--next[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--last[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px;padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}.cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block;text-align:left}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block;text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-table__table th,.cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418);text-align:right}.cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1);vertical-align:bottom}.cdx-table__table tfoot td,.cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1);vertical-align:top}.cdx-table__table tbody tr:first-child td,.cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);display:flex;align-items:flex-end;gap:8px;width:100%;border:0;padding:12px;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-align:right;text-decoration:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}.cdx-table__table__sort-button:active{background-color:var(--background-color-interactive, #eaecf0);border-color:var(--border-color-base, #a2a9b1)}.cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}.cdx-table__table .cdx-table__table__cell--align-center{text-align:center}.cdx-table__table .cdx-table__table__cell--align-end{text-align:left}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:left}.cdx-table__table .cdx-table__table__cell--align-number{text-align:right}.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row;text-align:right}.cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}.cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}.cdx-table__table--borders-vertical th,.cdx-table__table--borders-vertical td{border-left:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-table__table--borders-vertical th:last-child,.cdx-table__table--borders-vertical td:last-child{border-left:0}.cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;text-align:center;vertical-align:middle}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px;border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} +.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem;text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--first[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--previous[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--next[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--last[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px;padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}.cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block;text-align:left}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block;text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-table__table th,.cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418);text-align:right}.cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1);vertical-align:bottom}.cdx-table__table tfoot td,.cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1);vertical-align:top}.cdx-table__table tbody tr:first-child td,.cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);display:flex;align-items:flex-end;gap:8px;width:100%;border:0;padding:12px;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-align:right;text-decoration:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}.cdx-table__table__sort-button:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-base, #a2a9b1)}.cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}.cdx-table__table .cdx-table__table__cell--align-center{text-align:center}.cdx-table__table .cdx-table__table__cell--align-end{text-align:left}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:left}.cdx-table__table .cdx-table__table__cell--align-number{text-align:right}.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row;text-align:right}.cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}.cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}.cdx-table__table--borders-vertical th,.cdx-table__table--borders-vertical td{border-left:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-table__table--borders-vertical th:last-child,.cdx-table__table--borders-vertical td:last-child{border-left:0}.cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;text-align:center;vertical-align:middle}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px;border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} diff --git a/resources/lib/codex/modules/CdxTable.cjs b/resources/lib/codex/modules/CdxTable.cjs index 42931d26bff4..b6c313498c11 100644 --- a/resources/lib/codex/modules/CdxTable.cjs +++ b/resources/lib/codex/modules/CdxTable.cjs @@ -1 +1 @@ -"use strict";const e=require("vue"),te=require("./CdxCheckbox.cjs"),f=require("./Icon.js"),ae=require("./CdxButton.cjs"),ne=require("./CdxSelect.cjs"),$=require("./useModelWrapper.cjs"),c=require("./useI18n.cjs"),P=require("./_plugin-vue_export-helper.js"),oe=require("./CdxProgressBar.cjs"),y=require("./constants.js"),le=e.defineComponent({name:"CdxTablePager",components:{CdxButton:ae,CdxIcon:f.CdxIcon,CdxSelect:ne},props:{paginationSizeOptions:{type:Array,required:!0},itemsPerPage:{type:Number,required:!0},nextDisabled:{type:Boolean,default:!1},prevDisabled:{type:Boolean,default:!1},lastDisabled:{type:Boolean,default:!1}},emits:["update:itemsPerPage","first","last","next","prev"],setup(t,{emit:n}){const s=$(e.toRef(t,"itemsPerPage"),n,"update:itemsPerPage"),i=c("cdx-table-pager-items-per-page-default","Results per page"),v=c("cdx-table-pager-items-per-page-current",d=>"".concat(d," rows"),[s]),u=c("cdx-table-pager-button-first-page","First page"),p=c("cdx-table-pager-button-next-page","Next page"),g=c("cdx-table-pager-button-prev-page","Previous page"),m=c("cdx-table-pager-button-last-page","Last page");return{defaultItemsPerPageLabel:i,currentItemsPerPageLabel:v,btnLabelFirst:u,btnLabelNext:p,btnLabelPrev:g,btnLabelLast:m,wrappedItemsPerPage:s,cdxIconPrevious:f.e7,cdxIconNext:f.X6,cdxIconMoveFirst:f.N6,cdxIconMoveLast:f.O6}}}),se={class:"cdx-table-pager"},ie={class:"cdx-table-pager__start"},re={key:0},de={key:1},ce={class:"cdx-table-pager__center"},ue={class:"cdx-table-pager__end"};function pe(t,n,s,i,v,u){const p=e.resolveComponent("cdx-select"),g=e.resolveComponent("cdx-icon"),m=e.resolveComponent("cdx-button");return e.openBlock(),e.createElementBlock("div",se,[e.createElementVNode("div",ie,[e.createVNode(p,{selected:t.wrappedItemsPerPage,"onUpdate:selected":n[0]||(n[0]=d=>t.wrappedItemsPerPage=d),"default-label":t.defaultItemsPerPageLabel,"menu-items":t.paginationSizeOptions},{label:e.withCtx(({selectedMenuItem:d,defaultLabel:l})=>[d?(e.openBlock(),e.createElementBlock("span",re,[e.createElementVNode("span",null,e.toDisplayString(t.currentItemsPerPageLabel),1)])):(e.openBlock(),e.createElementBlock("span",de,e.toDisplayString(l),1))]),_:1},8,["selected","default-label","menu-items"])]),e.createElementVNode("div",ce,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",ue,[e.createVNode(m,{disabled:t.prevDisabled,class:"cdx-table-pager__button-first",weight:"quiet","aria-label":t.btnLabelFirst,onClick:n[1]||(n[1]=d=>t.$emit("first"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconMoveFirst},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.prevDisabled,class:"cdx-table-pager__button-prev",weight:"quiet","aria-label":t.btnLabelPrev,onClick:n[2]||(n[2]=d=>t.$emit("prev"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconPrevious},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.nextDisabled,class:"cdx-table-pager__button-next",weight:"quiet","aria-label":t.btnLabelNext,onClick:n[3]||(n[3]=d=>t.$emit("next"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconNext},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.nextDisabled||t.lastDisabled,class:"cdx-table-pager__button-last",weight:"quiet","aria-label":t.btnLabelLast,onClick:n[4]||(n[4]=d=>t.$emit("last"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconMoveLast},null,8,["icon"])]),_:1},8,["disabled","aria-label"])])])}const ge=P._export_sfc(le,[["render",pe]]),me=y.makeStringTypeValidator(y.TableTextAlignments),be=y.makeStringTypeValidator(y.TablePaginationPositions),ve={none:f.Z7,asc:f.u8,desc:f.n4},fe={none:"none",asc:"ascending",desc:"descending"},he=e.defineComponent({name:"CdxTable",components:{CdxCheckbox:te,CdxIcon:f.CdxIcon,CdxTablePager:ge,CdxProgressBar:oe},props:{caption:{type:String,required:!0},hideCaption:{type:Boolean,default:!1},columns:{type:Array,default:()=>[],validator:t=>{const n=t.map(i=>i.id);return new Set(n).size===n.length?!0:(console.warn('Each column in the "columns" prop of CdxTable must have a unique "id".'),!1)}},data:{type:Array,default:()=>[],validator:(t,n)=>{if(!Array.isArray(n.columns)||n.columns.length===0||t.length===0)return!0;const s=n.columns.some(v=>"allowSort"in v),i=t.every(v=>y.TableRowIdentifier in v);return s&&n.useRowSelection&&!i?(console.warn('For CdxTables with sorting and row selection, each row in the "data" prop must have a "TableRowIdentifier".'),!1):!0}},useRowHeaders:{type:Boolean,default:!1},showVerticalBorders:{type:Boolean,default:!1},useRowSelection:{type:Boolean,default:!1},selectedRows:{type:Array,default:()=>[]},sort:{type:Object,default:()=>({})},pending:{type:Boolean,default:!1},paginate:{type:Boolean,default:!1},serverPagination:{type:Boolean,default:!1},totalRows:{type:Number,default:NaN},paginationPosition:{type:String,default:"bottom",validator:be},paginationSizeOptions:{type:Array,default:()=>[{value:10},{value:20},{value:50}],validator:t=>{const n=s=>typeof s.value=="number";return t.every(n)?!0:(console.warn('"value" property of all menu items in PaginationOptions must be a number.'),!1)}},paginationSizeDefault:{type:Number,default:t=>t.paginate&&t.serverPagination?t.data.length:t.paginationSizeOptions[0].value}},emits:["update:selectedRows","update:sort","load-more","last"],setup(t,{emit:n}){const s=e.ref(0),i=e.ref(t.paginationSizeDefault),v=e.computed(()=>t.serverPagination&&t.paginate?t.data:t.paginate?t.data.slice(s.value,i.value+s.value):t.data),u=e.computed(()=>{var a;return t.serverPagination?(a=t.totalRows)!=null?a:NaN:t.data.length}),p=e.computed(()=>isNaN(u.value)),g=e.computed(()=>v.value.length),m=e.computed(()=>s.value+1),d=e.computed(()=>s.value+g.value),l=e.computed(()=>p.value),h=e.computed(()=>s.value<=0),b=e.computed(()=>p.value?g.value<i.value:s.value+i.value>=u.value),D=c("cdx-table-pagination-status-message-determinate-short",(a,o,r)=>"".concat(a,"–").concat(o," of ").concat(r),[m,d,u]),E=c("cdx-table-pagination-status-message-determinate-long",(a,o,r)=>"Showing results ".concat(a,"–").concat(o," of ").concat(r),[m,d,u]),x=c("cdx-table-pagination-status-message-indeterminate-short",(a,o)=>"".concat(a,"–").concat(o," of many"),[m,d]),L=c("cdx-table-pagination-status-message-indeterminate-long",(a,o)=>"Showing results ".concat(a,"–").concat(o," of many"),[m,d]),B=c("cdx-table-pagination-status-message-indeterminate-final",a=>"Showing the last ".concat(a," results"),[g]),V=c("cdx-table-pagination-status-message-pending","Loading results..."),R=e.computed(()=>t.pending?V.value:p.value&&b.value?B.value:p.value?x.value:D.value),I=e.computed(()=>t.pending?V.value:p.value&&b.value?B.value:p.value?L.value:E.value);function F(){s.value+=i.value,t.serverPagination&&n("load-more",s.value,i.value)}function z(){s.value-i.value<1?_():(s.value-=i.value,t.serverPagination&&n("load-more",s.value,i.value))}function _(){s.value=0,t.serverPagination&&n("load-more",s.value,i.value)}function A(){u.value%i.value===0?(s.value=u.value-i.value,n("load-more",s.value,i.value)):(s.value=Math.floor(u.value/i.value)*i.value,n("load-more",s.value,i.value))}e.watch(i,a=>{t.serverPagination&&n("load-more",s.value,a)});const C=$(e.toRef(t,"selectedRows"),n,"update:selectedRows"),w=e.ref(u.value===C.value.length),k=e.ref(!1),T=e.computed(()=>Object.keys(t.sort)[0]),q=e.computed(()=>t.columns.some(a=>a.allowSort)),M=e.computed(()=>{var o;return{"cdx-table__table--layout-fixed":(o=t.columns)==null?void 0:o.some(r=>"width"in r||"minWidth"in r),"cdx-table__table--borders-vertical":t.showVerticalBorders}}),O=c("cdx-table-sort-caption",a=>"".concat(a," (column headers with buttons are sortable)."),[e.toRef(t,"caption")]),U=(a,o)=>c("cdx-table-select-row-label",(r,S)=>"Select row ".concat(r," of ").concat(S),[()=>a,()=>o]).value,H=c("cdx-table-select-all-label","Select all rows");function N(a,o){return y.TableRowIdentifier in a?a[y.TableRowIdentifier]:o}function W(a,o){const r=N(a,o);return{"cdx-table__row--selected":C.value.indexOf(r)!==-1}}function K(a){const o=t.columns[0].id;if(t.useRowHeaders&&a===o)return"row"}function j(a){const o=t.columns[0].id;return t.useRowHeaders&&a===o?"th":"td"}function X(a,o=!1){if("textAlign"in a&&!me(a.textAlign)){console.warn("Invalid value for TableColumn textAlign property.");return}return{["cdx-table__table__cell--align-".concat(a.textAlign)]:"textAlign"in a&&a.textAlign!=="start","cdx-table__table__cell--has-sort":o}}function Z(a){const o={};return"width"in a&&(o.width=a.width),"minWidth"in a&&(o.minWidth=a.minWidth),o}function G(a){if(u.value===a.length){w.value=!0,k.value=!1;return}w.value=!1,u.value>a.length&&(k.value=!0),a.length===0&&(k.value=!1)}function J(a){k.value=!1,a?C.value=t.data.map((o,r)=>N(o,r)):C.value=[]}function Q(a){var S;const o=(S=t.sort[a])!=null?S:"none";let r="asc";o==="asc"&&(r="desc"),o==="desc"&&(r="none"),n("update:sort",{[a]:r})}function Y(a){var r;const o=(r=t.sort[a])!=null?r:"none";return ve[o]}function ee(a,o=!1){var r;if(o){const S=(r=t.sort[a])!=null?r:"none";return S==="none"?void 0:fe[S]}}return{dataForDisplay:v,pageSize:i,onNext:F,onPrev:z,onFirst:_,onLast:A,nextDisabled:b,prevDisabled:h,lastDisabled:l,paginationStatusMessageShort:R,paginationStatusMessageLong:I,wrappedSelectedRows:C,selectAll:w,selectAllIndeterminate:k,activeSortColumn:T,hasSortableColumns:q,tableClasses:M,getRowKey:N,getRowClass:W,getRowHeaderScope:K,getCellElement:j,getCellClass:X,getCellStyle:Z,handleRowSelection:G,handleSelectAll:J,handleSort:Q,getSortIcon:Y,getSortOrder:ee,translatedSortCaption:O,translatedSelectRowLabel:U,translatedSelectAllLabel:H}}}),Se={class:"cdx-table",tabindex:"0"},ye={key:0,class:"cdx-table__header"},Ce=["aria-hidden"],ke={class:"cdx-table__header__content"},we={class:"cdx-table__pagination-status--long"},Ne={class:"cdx-table__pagination-status--short"},Be={class:"cdx-table__table-wrapper"},Ve={key:0},_e={key:0,class:"cdx-table__table__select-rows"},$e=["aria-sort"],Pe=["aria-selected","onClick"],De={class:"cdx-table__table__sort-label"},Ee={key:0},xe={key:0},Le={key:1},Re={class:"cdx-table__table__empty-state"},Ie=["colspan"],Fe={class:"cdx-table__pagination-status--long"},ze={class:"cdx-table__pagination-status--short"},Ae={key:3,class:"cdx-table__footer"};function Te(t,n,s,i,v,u){const p=e.resolveComponent("cdx-table-pager"),g=e.resolveComponent("cdx-checkbox"),m=e.resolveComponent("cdx-icon"),d=e.resolveComponent("cdx-progress-bar");return e.openBlock(),e.createElementBlock("div",Se,[!t.hideCaption||t.$slots.header&&t.$slots.header().length>0?(e.openBlock(),e.createElementBlock("div",ye,[e.createElementVNode("div",{class:"cdx-table__header__caption","aria-hidden":t.$slots.header&&t.$slots.header().length>0?void 0:!0},[t.hideCaption?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(t.caption),1)],64))],8,Ce),e.createElementVNode("div",ke,[e.renderSlot(t.$slots,"header")])])):e.createCommentVNode("v-if",!0),t.paginate&&(t.paginationPosition==="top"||t.paginationPosition==="both")?(e.openBlock(),e.createBlock(p,{key:1,"items-per-page":t.pageSize,"onUpdate:itemsPerPage":n[0]||(n[0]=l=>t.pageSize=l),class:"cdx-table__pagination--top","pagination-size-options":t.paginationSizeOptions,"prev-disabled":t.prevDisabled,"next-disabled":t.nextDisabled,"last-disabled":t.lastDisabled,onNext:t.onNext,onPrev:t.onPrev,onFirst:t.onFirst,onLast:t.onLast},{default:e.withCtx(()=>[e.createElementVNode("span",we,e.toDisplayString(t.paginationStatusMessageLong),1),e.createElementVNode("span",Ne,e.toDisplayString(t.paginationStatusMessageShort),1)]),_:1},8,["items-per-page","pagination-size-options","prev-disabled","next-disabled","last-disabled","onNext","onPrev","onFirst","onLast"])):e.createCommentVNode("v-if",!0),e.createElementVNode("div",Be,[e.createElementVNode("table",{class:e.normalizeClass(["cdx-table__table",t.tableClasses])},[e.createElementVNode("caption",null,[t.hasSortableColumns?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(t.translatedSortCaption),1)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(t.caption),1)],64))]),e.renderSlot(t.$slots,"thead",{},()=>[t.columns.length>0?(e.openBlock(),e.createElementBlock("thead",Ve,[e.createElementVNode("tr",null,[t.useRowSelection?(e.openBlock(),e.createElementBlock("th",_e,[e.createVNode(g,{modelValue:t.selectAll,"onUpdate:modelValue":[n[1]||(n[1]=l=>t.selectAll=l),t.handleSelectAll],"hide-label":!0,indeterminate:t.selectAllIndeterminate},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.translatedSelectAllLabel),1)]),_:1},8,["modelValue","indeterminate","onUpdate:modelValue"])])):e.createCommentVNode("v-if",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.columns,l=>(e.openBlock(),e.createElementBlock("th",{key:l.id,scope:"col",class:e.normalizeClass(t.getCellClass(l,l.allowSort)),"aria-sort":t.getSortOrder(l.id,l.allowSort),style:e.normalizeStyle(t.getCellStyle(l))},[l.allowSort?(e.openBlock(),e.createElementBlock("button",{key:0,"aria-selected":l.id===t.activeSortColumn,class:"cdx-table__table__sort-button",onClick:h=>t.handleSort(l.id)},[e.createElementVNode("span",De,e.toDisplayString(l.label),1),e.createVNode(m,{icon:t.getSortIcon(l.id),size:"small",class:"cdx-table__table__sort-icon--vue","aria-hidden":"true"},null,8,["icon"])],8,Pe)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(l.label),1)],64))],14,$e))),128))])])):e.createCommentVNode("v-if",!0)]),t.pending?(e.openBlock(),e.createBlock(d,{key:0,inline:!0,class:"cdx-table__pending-indicator"})):e.createCommentVNode("v-if",!0),e.renderSlot(t.$slots,"tbody",{},()=>[t.dataForDisplay.length>0?(e.openBlock(),e.createElementBlock("tbody",Ee,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dataForDisplay,(l,h)=>(e.openBlock(),e.createElementBlock("tr",{key:t.getRowKey(l,h),class:e.normalizeClass(t.getRowClass(l,h))},[t.useRowSelection?(e.openBlock(),e.createElementBlock("td",xe,[e.createVNode(g,{modelValue:t.wrappedSelectedRows,"onUpdate:modelValue":[n[2]||(n[2]=b=>t.wrappedSelectedRows=b),t.handleRowSelection],"input-value":t.getRowKey(l,h),"hide-label":!0},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.translatedSelectRowLabel(h+1,t.dataForDisplay.length)),1)]),_:2},1032,["modelValue","input-value","onUpdate:modelValue"])])):e.createCommentVNode("v-if",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.columns,b=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.getCellElement(b.id)),{key:b.id,scope:t.getRowHeaderScope(b.id),class:e.normalizeClass(t.getCellClass(b))},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"item-"+b.id,{item:l[b.id],row:l},()=>[e.createTextVNode(e.toDisplayString(l[b.id]),1)])]),_:2},1032,["scope","class"]))),128))],2))),128))])):t.$slots["empty-state"]&&t.$slots["empty-state"]().length>0?(e.openBlock(),e.createElementBlock("tbody",Le,[e.createElementVNode("tr",Re,[e.createElementVNode("td",{colspan:t.columns.length,class:"cdx-table__table__empty-state-content"},[e.renderSlot(t.$slots,"empty-state")],8,Ie)])])):e.createCommentVNode("v-if",!0)]),e.renderSlot(t.$slots,"tfoot")],2)]),t.paginate&&(t.paginationPosition==="bottom"||t.paginationPosition==="both")?(e.openBlock(),e.createBlock(p,{key:2,"items-per-page":t.pageSize,"onUpdate:itemsPerPage":n[3]||(n[3]=l=>t.pageSize=l),class:"cdx-table__pagination--bottom","pagination-size-options":t.paginationSizeOptions,"prev-disabled":t.prevDisabled,"next-disabled":t.nextDisabled,"last-disabled":t.lastDisabled,onNext:t.onNext,onPrev:t.onPrev,onFirst:t.onFirst,onLast:t.onLast},{default:e.withCtx(()=>[e.createElementVNode("span",Fe,e.toDisplayString(t.paginationStatusMessageLong),1),e.createElementVNode("span",ze,e.toDisplayString(t.paginationStatusMessageShort),1)]),_:1},8,["items-per-page","pagination-size-options","prev-disabled","next-disabled","last-disabled","onNext","onPrev","onFirst","onLast"])):e.createCommentVNode("v-if",!0),t.$slots.footer&&t.$slots.footer().length>0?(e.openBlock(),e.createElementBlock("div",Ae,[e.renderSlot(t.$slots,"footer")])):e.createCommentVNode("v-if",!0)])}const qe=P._export_sfc(he,[["render",Te]]);module.exports=qe; +"use strict";const e=require("vue"),te=require("./CdxCheckbox.cjs"),f=require("./Icon.js"),ae=require("./CdxButton.cjs"),ne=require("./CdxSelect.cjs"),$=require("./useModelWrapper.cjs"),c=require("./useI18n.cjs"),P=require("./_plugin-vue_export-helper.js"),oe=require("./CdxProgressBar.cjs"),y=require("./constants.js"),le=e.defineComponent({name:"CdxTablePager",components:{CdxButton:ae,CdxIcon:f.CdxIcon,CdxSelect:ne},props:{paginationSizeOptions:{type:Array,required:!0},itemsPerPage:{type:Number,required:!0},nextDisabled:{type:Boolean,default:!1},prevDisabled:{type:Boolean,default:!1},lastDisabled:{type:Boolean,default:!1}},emits:["update:itemsPerPage","first","last","next","prev"],setup(t,{emit:n}){const s=$(e.toRef(t,"itemsPerPage"),n,"update:itemsPerPage"),i=c("cdx-table-pager-items-per-page-default","Results per page"),v=c("cdx-table-pager-items-per-page-current",d=>"".concat(d," rows"),[s]),u=c("cdx-table-pager-button-first-page","First page"),p=c("cdx-table-pager-button-next-page","Next page"),g=c("cdx-table-pager-button-prev-page","Previous page"),m=c("cdx-table-pager-button-last-page","Last page");return{defaultItemsPerPageLabel:i,currentItemsPerPageLabel:v,btnLabelFirst:u,btnLabelNext:p,btnLabelPrev:g,btnLabelLast:m,wrappedItemsPerPage:s,cdxIconPrevious:f.e7,cdxIconNext:f.X6,cdxIconMoveFirst:f.N6,cdxIconMoveLast:f.O6}}}),se={class:"cdx-table-pager"},ie={class:"cdx-table-pager__start"},re={key:0},de={key:1},ce={class:"cdx-table-pager__center"},ue={class:"cdx-table-pager__end"};function pe(t,n,s,i,v,u){const p=e.resolveComponent("cdx-select"),g=e.resolveComponent("cdx-icon"),m=e.resolveComponent("cdx-button");return e.openBlock(),e.createElementBlock("div",se,[e.createElementVNode("div",ie,[e.createVNode(p,{selected:t.wrappedItemsPerPage,"onUpdate:selected":n[0]||(n[0]=d=>t.wrappedItemsPerPage=d),"default-label":t.defaultItemsPerPageLabel,"menu-items":t.paginationSizeOptions},{label:e.withCtx(({selectedMenuItem:d,defaultLabel:l})=>[d?(e.openBlock(),e.createElementBlock("span",re,[e.createElementVNode("span",null,e.toDisplayString(t.currentItemsPerPageLabel),1)])):(e.openBlock(),e.createElementBlock("span",de,e.toDisplayString(l),1))]),_:1},8,["selected","default-label","menu-items"])]),e.createElementVNode("div",ce,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",ue,[e.createVNode(m,{disabled:t.prevDisabled,class:"cdx-table-pager__button-first",weight:"quiet","aria-label":t.btnLabelFirst,onClick:n[1]||(n[1]=d=>t.$emit("first"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconMoveFirst},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.prevDisabled,class:"cdx-table-pager__button-prev",weight:"quiet","aria-label":t.btnLabelPrev,onClick:n[2]||(n[2]=d=>t.$emit("prev"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconPrevious},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.nextDisabled,class:"cdx-table-pager__button-next",weight:"quiet","aria-label":t.btnLabelNext,onClick:n[3]||(n[3]=d=>t.$emit("next"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconNext},null,8,["icon"])]),_:1},8,["disabled","aria-label"]),e.createVNode(m,{disabled:t.nextDisabled||t.lastDisabled,class:"cdx-table-pager__button-last",weight:"quiet","aria-label":t.btnLabelLast,onClick:n[4]||(n[4]=d=>t.$emit("last"))},{default:e.withCtx(()=>[e.createVNode(g,{icon:t.cdxIconMoveLast},null,8,["icon"])]),_:1},8,["disabled","aria-label"])])])}const ge=P._export_sfc(le,[["render",pe]]),me=y.makeStringTypeValidator(y.TableTextAlignments),be=y.makeStringTypeValidator(y.TablePaginationPositions),ve={none:f.Z7,asc:f.u8,desc:f.n4},fe={none:"none",asc:"ascending",desc:"descending"},he=e.defineComponent({name:"CdxTable",components:{CdxCheckbox:te,CdxIcon:f.CdxIcon,CdxTablePager:ge,CdxProgressBar:oe},props:{caption:{type:String,required:!0},hideCaption:{type:Boolean,default:!1},columns:{type:Array,default:()=>[],validator:t=>{const n=t.map(i=>i.id);return new Set(n).size===n.length?!0:(console.warn('[CdxTable]: Each column in the "columns" prop must have a unique "id".'),!1)}},data:{type:Array,default:()=>[],validator:(t,n)=>{if(!Array.isArray(n.columns)||n.columns.length===0||t.length===0)return!0;const s=n.columns.some(v=>"allowSort"in v),i=t.every(v=>y.TableRowIdentifier in v);return s&&n.useRowSelection&&!i?(console.warn('[CdxTable]: With sorting and row selection, each row in the "data" prop must have a "TableRowIdentifier".'),!1):!0}},useRowHeaders:{type:Boolean,default:!1},showVerticalBorders:{type:Boolean,default:!1},useRowSelection:{type:Boolean,default:!1},selectedRows:{type:Array,default:()=>[]},sort:{type:Object,default:()=>({})},pending:{type:Boolean,default:!1},paginate:{type:Boolean,default:!1},serverPagination:{type:Boolean,default:!1},totalRows:{type:Number,default:NaN},paginationPosition:{type:String,default:"bottom",validator:be},paginationSizeOptions:{type:Array,default:()=>[{value:10},{value:20},{value:50}],validator:t=>{const n=s=>typeof s.value=="number";return t.every(n)?!0:(console.warn('[CdxTable]: "value" property of all menu items in PaginationOptions must be a number.'),!1)}},paginationSizeDefault:{type:Number,default:t=>t.paginate&&t.serverPagination?t.data.length:t.paginationSizeOptions[0].value}},emits:["update:selectedRows","update:sort","load-more","last"],setup(t,{emit:n}){const s=e.ref(0),i=e.ref(t.paginationSizeDefault),v=e.computed(()=>t.serverPagination&&t.paginate?t.data:t.paginate?t.data.slice(s.value,i.value+s.value):t.data),u=e.computed(()=>{var a;return t.serverPagination?(a=t.totalRows)!=null?a:NaN:t.data.length}),p=e.computed(()=>isNaN(u.value)),g=e.computed(()=>v.value.length),m=e.computed(()=>s.value+1),d=e.computed(()=>s.value+g.value),l=e.computed(()=>p.value),h=e.computed(()=>s.value<=0),b=e.computed(()=>p.value?g.value<i.value:s.value+i.value>=u.value),x=c("cdx-table-pagination-status-message-determinate-short",(a,o,r)=>"".concat(a,"–").concat(o," of ").concat(r),[m,d,u]),D=c("cdx-table-pagination-status-message-determinate-long",(a,o,r)=>"Showing results ".concat(a,"–").concat(o," of ").concat(r),[m,d,u]),E=c("cdx-table-pagination-status-message-indeterminate-short",(a,o)=>"".concat(a,"–").concat(o," of many"),[m,d]),L=c("cdx-table-pagination-status-message-indeterminate-long",(a,o)=>"Showing results ".concat(a,"–").concat(o," of many"),[m,d]),B=c("cdx-table-pagination-status-message-indeterminate-final",a=>"Showing the last ".concat(a," results"),[g]),V=c("cdx-table-pagination-status-message-pending","Loading results..."),R=e.computed(()=>t.pending?V.value:p.value&&b.value?B.value:p.value?E.value:x.value),I=e.computed(()=>t.pending?V.value:p.value&&b.value?B.value:p.value?L.value:D.value);function F(){s.value+=i.value,t.serverPagination&&n("load-more",s.value,i.value)}function T(){s.value-i.value<1?_():(s.value-=i.value,t.serverPagination&&n("load-more",s.value,i.value))}function _(){s.value=0,t.serverPagination&&n("load-more",s.value,i.value)}function z(){u.value%i.value===0?(s.value=u.value-i.value,n("load-more",s.value,i.value)):(s.value=Math.floor(u.value/i.value)*i.value,n("load-more",s.value,i.value))}e.watch(i,a=>{t.serverPagination&&n("load-more",s.value,a)});const C=$(e.toRef(t,"selectedRows"),n,"update:selectedRows"),w=e.ref(u.value===C.value.length),k=e.ref(!1),A=e.computed(()=>Object.keys(t.sort)[0]),q=e.computed(()=>t.columns.some(a=>a.allowSort)),M=e.computed(()=>{var o;return{"cdx-table__table--layout-fixed":(o=t.columns)==null?void 0:o.some(r=>"width"in r||"minWidth"in r),"cdx-table__table--borders-vertical":t.showVerticalBorders}}),O=c("cdx-table-sort-caption",a=>"".concat(a," (column headers with buttons are sortable)."),[e.toRef(t,"caption")]),U=(a,o)=>c("cdx-table-select-row-label",(r,S)=>"Select row ".concat(r," of ").concat(S),[()=>a,()=>o]).value,H=c("cdx-table-select-all-label","Select all rows");function N(a,o){return y.TableRowIdentifier in a?a[y.TableRowIdentifier]:o}function W(a,o){const r=N(a,o);return{"cdx-table__row--selected":C.value.indexOf(r)!==-1}}function K(a){const o=t.columns[0].id;if(t.useRowHeaders&&a===o)return"row"}function j(a){const o=t.columns[0].id;return t.useRowHeaders&&a===o?"th":"td"}function X(a,o=!1){if("textAlign"in a&&!me(a.textAlign)){console.warn('[CdxTable]: Invalid value for TableColumn "textAlign" property.');return}return{["cdx-table__table__cell--align-".concat(a.textAlign)]:"textAlign"in a&&a.textAlign!=="start","cdx-table__table__cell--has-sort":o}}function Z(a){const o={};return"width"in a&&(o.width=a.width),"minWidth"in a&&(o.minWidth=a.minWidth),o}function G(a){if(u.value===a.length){w.value=!0,k.value=!1;return}w.value=!1,u.value>a.length&&(k.value=!0),a.length===0&&(k.value=!1)}function J(a){k.value=!1,a?C.value=t.data.map((o,r)=>N(o,r)):C.value=[]}function Q(a){var S;const o=(S=t.sort[a])!=null?S:"none";let r="asc";o==="asc"&&(r="desc"),o==="desc"&&(r="none"),n("update:sort",{[a]:r})}function Y(a){var r;const o=(r=t.sort[a])!=null?r:"none";return ve[o]}function ee(a,o=!1){var r;if(o){const S=(r=t.sort[a])!=null?r:"none";return S==="none"?void 0:fe[S]}}return{dataForDisplay:v,pageSize:i,onNext:F,onPrev:T,onFirst:_,onLast:z,nextDisabled:b,prevDisabled:h,lastDisabled:l,paginationStatusMessageShort:R,paginationStatusMessageLong:I,wrappedSelectedRows:C,selectAll:w,selectAllIndeterminate:k,activeSortColumn:A,hasSortableColumns:q,tableClasses:M,getRowKey:N,getRowClass:W,getRowHeaderScope:K,getCellElement:j,getCellClass:X,getCellStyle:Z,handleRowSelection:G,handleSelectAll:J,handleSort:Q,getSortIcon:Y,getSortOrder:ee,translatedSortCaption:O,translatedSelectRowLabel:U,translatedSelectAllLabel:H}}}),Se={class:"cdx-table",tabindex:"0"},ye={key:0,class:"cdx-table__header"},Ce=["aria-hidden"],ke={class:"cdx-table__header__content"},we={class:"cdx-table__pagination-status--long"},Ne={class:"cdx-table__pagination-status--short"},Be={class:"cdx-table__table-wrapper"},Ve={key:0},_e={key:0,class:"cdx-table__table__select-rows"},$e=["aria-sort"],Pe=["aria-selected","onClick"],xe={class:"cdx-table__table__sort-label"},De={key:0},Ee={key:0},Le={key:1},Re={class:"cdx-table__table__empty-state"},Ie=["colspan"],Fe={class:"cdx-table__pagination-status--long"},Te={class:"cdx-table__pagination-status--short"},ze={key:3,class:"cdx-table__footer"};function Ae(t,n,s,i,v,u){const p=e.resolveComponent("cdx-table-pager"),g=e.resolveComponent("cdx-checkbox"),m=e.resolveComponent("cdx-icon"),d=e.resolveComponent("cdx-progress-bar");return e.openBlock(),e.createElementBlock("div",Se,[!t.hideCaption||t.$slots.header&&t.$slots.header().length>0?(e.openBlock(),e.createElementBlock("div",ye,[e.createElementVNode("div",{class:"cdx-table__header__caption","aria-hidden":t.$slots.header&&t.$slots.header().length>0?void 0:!0},[t.hideCaption?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(t.caption),1)],64))],8,Ce),e.createElementVNode("div",ke,[e.renderSlot(t.$slots,"header")])])):e.createCommentVNode("v-if",!0),t.paginate&&(t.paginationPosition==="top"||t.paginationPosition==="both")?(e.openBlock(),e.createBlock(p,{key:1,"items-per-page":t.pageSize,"onUpdate:itemsPerPage":n[0]||(n[0]=l=>t.pageSize=l),class:"cdx-table__pagination--top","pagination-size-options":t.paginationSizeOptions,"prev-disabled":t.prevDisabled,"next-disabled":t.nextDisabled,"last-disabled":t.lastDisabled,onNext:t.onNext,onPrev:t.onPrev,onFirst:t.onFirst,onLast:t.onLast},{default:e.withCtx(()=>[e.createElementVNode("span",we,e.toDisplayString(t.paginationStatusMessageLong),1),e.createElementVNode("span",Ne,e.toDisplayString(t.paginationStatusMessageShort),1)]),_:1},8,["items-per-page","pagination-size-options","prev-disabled","next-disabled","last-disabled","onNext","onPrev","onFirst","onLast"])):e.createCommentVNode("v-if",!0),e.createElementVNode("div",Be,[e.createElementVNode("table",{class:e.normalizeClass(["cdx-table__table",t.tableClasses])},[e.createElementVNode("caption",null,[t.hasSortableColumns?(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(t.translatedSortCaption),1)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(t.caption),1)],64))]),e.renderSlot(t.$slots,"thead",{},()=>[t.columns.length>0?(e.openBlock(),e.createElementBlock("thead",Ve,[e.createElementVNode("tr",null,[t.useRowSelection?(e.openBlock(),e.createElementBlock("th",_e,[e.createVNode(g,{modelValue:t.selectAll,"onUpdate:modelValue":[n[1]||(n[1]=l=>t.selectAll=l),t.handleSelectAll],"hide-label":!0,indeterminate:t.selectAllIndeterminate},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.translatedSelectAllLabel),1)]),_:1},8,["modelValue","indeterminate","onUpdate:modelValue"])])):e.createCommentVNode("v-if",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.columns,l=>(e.openBlock(),e.createElementBlock("th",{key:l.id,scope:"col",class:e.normalizeClass(t.getCellClass(l,l.allowSort)),"aria-sort":t.getSortOrder(l.id,l.allowSort),style:e.normalizeStyle(t.getCellStyle(l))},[l.allowSort?(e.openBlock(),e.createElementBlock("button",{key:0,"aria-selected":l.id===t.activeSortColumn,class:"cdx-table__table__sort-button",onClick:h=>t.handleSort(l.id)},[e.createElementVNode("span",xe,e.toDisplayString(l.label),1),e.createVNode(m,{icon:t.getSortIcon(l.id),size:"small",class:"cdx-table__table__sort-icon--vue","aria-hidden":"true"},null,8,["icon"])],8,Pe)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(l.label),1)],64))],14,$e))),128))])])):e.createCommentVNode("v-if",!0)]),t.pending?(e.openBlock(),e.createBlock(d,{key:0,inline:!0,class:"cdx-table__pending-indicator"})):e.createCommentVNode("v-if",!0),e.renderSlot(t.$slots,"tbody",{},()=>[t.dataForDisplay.length>0?(e.openBlock(),e.createElementBlock("tbody",De,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dataForDisplay,(l,h)=>(e.openBlock(),e.createElementBlock("tr",{key:t.getRowKey(l,h),class:e.normalizeClass(t.getRowClass(l,h))},[t.useRowSelection?(e.openBlock(),e.createElementBlock("td",Ee,[e.createVNode(g,{modelValue:t.wrappedSelectedRows,"onUpdate:modelValue":[n[2]||(n[2]=b=>t.wrappedSelectedRows=b),t.handleRowSelection],"input-value":t.getRowKey(l,h),"hide-label":!0},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.translatedSelectRowLabel(h+1,t.dataForDisplay.length)),1)]),_:2},1032,["modelValue","input-value","onUpdate:modelValue"])])):e.createCommentVNode("v-if",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.columns,b=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.getCellElement(b.id)),{key:b.id,scope:t.getRowHeaderScope(b.id),class:e.normalizeClass(t.getCellClass(b))},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"item-"+b.id,{item:l[b.id],row:l},()=>[e.createTextVNode(e.toDisplayString(l[b.id]),1)])]),_:2},1032,["scope","class"]))),128))],2))),128))])):t.$slots["empty-state"]&&t.$slots["empty-state"]().length>0?(e.openBlock(),e.createElementBlock("tbody",Le,[e.createElementVNode("tr",Re,[e.createElementVNode("td",{colspan:t.columns.length,class:"cdx-table__table__empty-state-content"},[e.renderSlot(t.$slots,"empty-state")],8,Ie)])])):e.createCommentVNode("v-if",!0)]),e.renderSlot(t.$slots,"tfoot")],2)]),t.paginate&&(t.paginationPosition==="bottom"||t.paginationPosition==="both")?(e.openBlock(),e.createBlock(p,{key:2,"items-per-page":t.pageSize,"onUpdate:itemsPerPage":n[3]||(n[3]=l=>t.pageSize=l),class:"cdx-table__pagination--bottom","pagination-size-options":t.paginationSizeOptions,"prev-disabled":t.prevDisabled,"next-disabled":t.nextDisabled,"last-disabled":t.lastDisabled,onNext:t.onNext,onPrev:t.onPrev,onFirst:t.onFirst,onLast:t.onLast},{default:e.withCtx(()=>[e.createElementVNode("span",Fe,e.toDisplayString(t.paginationStatusMessageLong),1),e.createElementVNode("span",Te,e.toDisplayString(t.paginationStatusMessageShort),1)]),_:1},8,["items-per-page","pagination-size-options","prev-disabled","next-disabled","last-disabled","onNext","onPrev","onFirst","onLast"])):e.createCommentVNode("v-if",!0),t.$slots.footer&&t.$slots.footer().length>0?(e.openBlock(),e.createElementBlock("div",ze,[e.renderSlot(t.$slots,"footer")])):e.createCommentVNode("v-if",!0)])}const qe=P._export_sfc(he,[["render",Ae]]);module.exports=qe; diff --git a/resources/lib/codex/modules/CdxTable.css b/resources/lib/codex/modules/CdxTable.css index 70943f60ad79..e926bbc51880 100644 --- a/resources/lib/codex/modules/CdxTable.css +++ b/resources/lib/codex/modules/CdxTable.css @@ -1 +1 @@ -.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem;text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--first[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--previous[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--next[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--last[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px;padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}.cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block;text-align:right}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block;text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-table__table th,.cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418);text-align:left}.cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1);vertical-align:bottom}.cdx-table__table tfoot td,.cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1);vertical-align:top}.cdx-table__table tbody tr:first-child td,.cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);display:flex;align-items:flex-end;gap:8px;width:100%;border:0;padding:12px;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-align:left;text-decoration:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}.cdx-table__table__sort-button:active{background-color:var(--background-color-interactive, #eaecf0);border-color:var(--border-color-base, #a2a9b1)}.cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}.cdx-table__table .cdx-table__table__cell--align-center{text-align:center}.cdx-table__table .cdx-table__table__cell--align-end{text-align:right}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:right}.cdx-table__table .cdx-table__table__cell--align-number{text-align:right}.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:right}.cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}.cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}.cdx-table__table--borders-vertical th,.cdx-table__table--borders-vertical td{border-right:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-table__table--borders-vertical th:last-child,.cdx-table__table--borders-vertical td:last-child{border-right:0}.cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;text-align:center;vertical-align:middle}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px;border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} +.cdx-table-pager{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px}@media screen and (min-width: 640px){.cdx-table-pager{flex-wrap:nowrap}}.cdx-table-pager__start .cdx-select,.cdx-table-pager__start .cdx-select-vue__handle{min-width:8rem}.cdx-table-pager__center{color:var(--color-subtle, #54595d);flex:1 1 40%;font-size:1rem;text-align:center}@media screen and (min-width: 640px){.cdx-table-pager__center{flex:0 1 auto}}.cdx-table-pager__end{display:flex;flex:1 0 100%;justify-content:space-between;gap:4px}@media screen and (min-width: 640px){.cdx-table-pager__end{flex:0 1 auto}}.cdx-table-pager__icon--first{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--first{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--first,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--first{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--first{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M3 1h2v18H3zm13.5 1.5L15 1l-9 9 9 9 1.5-1.5L9 10z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--first[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--first:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--previous{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--previous{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--previous,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--previous{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--previous{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m4 10 9 9 1.4-1.5L7 10l7.4-7.5L13 1z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--previous[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--previous:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--next{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--next{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--next,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--next{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--next{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M7 1 5.6 2.5 13 10l-7.4 7.5L7 19l9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--next[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--next:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table-pager__icon--last{min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table-pager__icon--last{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table-pager__icon--last,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table-pager__icon--last{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table-pager__icon--last{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M15 1h2v18h-2zM3.5 2.5 11 10l-7.5 7.5L5 19l9-9-9-9z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table-pager__icon--last[dir=rtl],html[dir=rtl] .cdx-table-pager__icon--last:not([dir="ltr"]){transform:scaleX(-1)}.cdx-table{color:var(--color-base, #202122);border:1px solid var(--border-color-base, #a2a9b1);border-radius:2px;word-wrap:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.cdx-table__header{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:16px;box-sizing:border-box;min-height:64px;padding:16px 12px}.cdx-table__header__caption{color:var(--color-emphasized, #101418);font-size:1.125rem;font-weight:700;line-height:1.25}.cdx-table__pagination--bottom{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__pagination-status--short{display:block;text-align:right}@media screen and (min-width: 640px){.cdx-table__pagination-status--short{display:none}}.cdx-table__pagination-status--long{display:none}@media screen and (min-width: 640px){.cdx-table__pagination-status--long{display:block;text-align:center}}.cdx-table__pending-indicator{position:absolute}.cdx-table__table-wrapper{position:relative;overflow-x:auto}.cdx-table__table{min-width:100%;line-height:1.375;border-collapse:collapse}.cdx-table__table caption{display:block;clip:rect(1px,1px,1px,1px);position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden}.cdx-table__table th,.cdx-table__table td{padding:12px}.cdx-table__table th{color:var(--color-emphasized, #101418);text-align:left}.cdx-table__table thead th{border-bottom:1px solid var(--border-color-base, #a2a9b1);vertical-align:bottom}.cdx-table__table tfoot td,.cdx-table__table tfoot th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table tbody td,.cdx-table__table tbody th{border-top:1px solid var(--border-color-subtle, #c8ccd1);vertical-align:top}.cdx-table__table tbody tr:first-child td,.cdx-table__table tbody tr:first-child th{border-top:0}.cdx-table__table__sort-button{background-color:var(--background-color-transparent, transparent);display:flex;align-items:flex-end;gap:8px;width:100%;border:0;padding:12px;font-family:inherit;font-size:inherit;font-weight:700;line-height:1.4285714;text-align:left;text-decoration:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-table__table__sort-button:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-base, #a2a9b1);cursor:pointer}.cdx-table__table__sort-button:focus{outline:1px solid transparent}.cdx-table__table__sort-button:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-base, #a2a9b1)}.cdx-table__table__sort-button:focus:not(:active){background-color:var(--background-color-base, #fff);box-shadow:inset 0 0 0 2px var(--box-shadow-color-progressive--focus, #36c)}.cdx-table__table__sort-icon--unsorted{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--unsorted{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--unsorted,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--unsorted{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--unsorted{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 0 3 8h14zm0 18-7-8h14z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--asc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--asc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--asc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--asc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--asc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="m10 5 8 10H2z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--desc{min-width:16px;min-height:16px;width:1rem;height:1rem;display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-table__table__sort-icon--desc{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}.cdx-button:not(.cdx-button--weight-quiet):disabled .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-progressive .cdx-table__table__sort-icon--desc,.cdx-button--weight-primary.cdx-button--action-destructive .cdx-table__table__sort-icon--desc{filter:invert(var(--filter-invert-primary-button-icon, 1))}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-table__table__sort-icon--desc{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20" fill="%23000000"><path d="M10 15 2 5h16z"/></svg>');background-color:var(--color-base, #202122)}}.cdx-table__table__sort-icon--vue,.cdx-table__table__sort-icon{color:var(--color-subtle, #54595d);flex-shrink:0;height:1.4285714em}.cdx-table__table .cdx-table__table__cell--align-center{text-align:center}.cdx-table__table .cdx-table__table__cell--align-end{text-align:right}.cdx-table__table .cdx-table__table__cell--align-end .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:right}.cdx-table__table .cdx-table__table__cell--align-number{text-align:right}.cdx-table__table .cdx-table__table__cell--align-number .cdx-table__table__sort-button{flex-direction:row-reverse;text-align:right}.cdx-table__table .cdx-table__table__cell--has-sort{padding:0}.cdx-table__table__select-rows{width:1px}.cdx-table__table__row--selected{background-color:var(--background-color-progressive-subtle, #f1f4fd)}.cdx-table__table--layout-fixed{table-layout:fixed}.cdx-table__table--borders-vertical th,.cdx-table__table--borders-vertical td{border-right:1px solid var(--border-color-subtle, #c8ccd1)}.cdx-table__table--borders-vertical th:last-child,.cdx-table__table--borders-vertical td:last-child{border-right:0}.cdx-table__table--borders-vertical thead tr:not(:first-child) th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__header+.cdx-table__table-wrapper .cdx-table__table--borders-vertical thead th{border-top:1px solid var(--border-color-base, #a2a9b1)}.cdx-table__table__empty-state{border-top:1px solid var(--border-color-base, #a2a9b1)}thead+tbody .cdx-table__table__empty-state{border-top:0}tbody td.cdx-table__table__empty-state-content{color:var(--color-subtle, #54595d);height:40px;text-align:center;vertical-align:middle}.cdx-table__footer{display:flex;align-items:center;gap:16px;box-sizing:border-box;min-height:64px;border-top:1px solid var(--border-color-base, #a2a9b1);padding:12px} diff --git a/resources/lib/codex/modules/CdxTabs-bidi.css b/resources/lib/codex/modules/CdxTabs-bidi.css index 4d2b222aa405..02e48fa2ddc4 100644 --- a/resources/lib/codex/modules/CdxTabs-bidi.css +++ b/resources/lib/codex/modules/CdxTabs-bidi.css @@ -1 +1 @@ -.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{position:absolute;top:0;bottom:0}[dir] .cdx-tabs__prev-scroller,[dir] .cdx-tabs__next-scroller{background-color:inherit}[dir=ltr] .cdx-tabs__prev-scroller{left:0}[dir=rtl] .cdx-tabs__prev-scroller,[dir=ltr] .cdx-tabs__next-scroller{right:0}[dir=rtl] .cdx-tabs__next-scroller{left:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}[dir=ltr] .cdx-tabs__prev-scroller:after{left:100%}[dir=rtl] .cdx-tabs__prev-scroller:after{right:100%}[dir=ltr] .cdx-tabs__next-scroller:before{right:100%}[dir=rtl] .cdx-tabs__next-scroller:before{left:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{display:block;flex:0 0 auto;max-width:16rem;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[dir] .cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);border-width:0;border-top-left-radius:2px;border-top-right-radius:2px;padding:4px 12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir] .cdx-tabs__list__item:hover{cursor:pointer}[dir] .cdx-tabs__list__item[aria-selected=true]{cursor:default}[dir=ltr] .cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-left:0}[dir=rtl] .cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-right:0}[dir] .cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{margin:8px 4px 0 8px}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{margin:8px 8px 0 4px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{color:var(--color-base, #202122)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-tab-list-item-framed--hover, rgba(255, 255, 255, .3))}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{color:var(--color-base, #202122)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-tab-list-item-framed--active, rgba(255, 255, 255, .65))}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-base, #202122)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);cursor:default}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:8px}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:8px}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #4b77d6)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{cursor:default}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-left:0}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-right:0}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:0}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{outline:1px solid transparent;overflow:hidden}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c)} +.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{position:absolute;top:0;bottom:0}[dir] .cdx-tabs__prev-scroller,[dir] .cdx-tabs__next-scroller{background-color:inherit}[dir=ltr] .cdx-tabs__prev-scroller{left:0}[dir=rtl] .cdx-tabs__prev-scroller,[dir=ltr] .cdx-tabs__next-scroller{right:0}[dir=rtl] .cdx-tabs__next-scroller{left:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}[dir=ltr] .cdx-tabs__prev-scroller:after{left:100%}[dir=rtl] .cdx-tabs__prev-scroller:after{right:100%}[dir=ltr] .cdx-tabs__next-scroller:before{right:100%}[dir=rtl] .cdx-tabs__next-scroller:before{left:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{display:block;flex:0 0 auto;max-width:16rem;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[dir] .cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);border-width:0;border-top-left-radius:2px;border-top-right-radius:2px;padding:4px 12px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}[dir] .cdx-tabs__list__item:hover{cursor:pointer}[dir] .cdx-tabs__list__item[aria-selected=true]{cursor:default}[dir=ltr] .cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-left:0}[dir=rtl] .cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-right:0}[dir] .cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122)}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{margin:8px 4px 0 8px}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{margin:8px 8px 0 4px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-blend, multiply)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{color:var(--color-base, #202122)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-base, normal)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);cursor:default}[dir=ltr] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:8px}[dir=rtl] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:8px}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #3056a9)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1)}[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{cursor:default}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-left:0}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-right:0}[dir=ltr] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:0}[dir=rtl] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{outline:1px solid transparent;overflow:hidden}[dir] .cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,[dir] .cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1)} diff --git a/resources/lib/codex/modules/CdxTabs-rtl.css b/resources/lib/codex/modules/CdxTabs-rtl.css index 9307dec27d3f..91515d881a6b 100644 --- a/resources/lib/codex/modules/CdxTabs-rtl.css +++ b/resources/lib/codex/modules/CdxTabs-rtl.css @@ -1 +1 @@ -.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{background-color:inherit;position:absolute;top:0;bottom:0}.cdx-tabs__prev-scroller{right:0}.cdx-tabs__next-scroller{left:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}.cdx-tabs__prev-scroller:after{right:100%}.cdx-tabs__next-scroller:before{left:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);display:block;flex:0 0 auto;max-width:16rem;border-width:0;border-top-right-radius:2px;border-top-left-radius:2px;padding:4px 12px;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-tabs__list__item:hover{cursor:pointer}.cdx-tabs__list__item[aria-selected=true]{cursor:default}.cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-right:0}.cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122);margin:8px 8px 0 4px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-tab-list-item-framed--hover, rgba(255, 255, 255, .3));color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-tab-list-item-framed--active, rgba(255, 255, 255, .65));color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:8px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #4b77d6)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-right:0}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c);outline:1px solid transparent;overflow:hidden} +.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{background-color:inherit;position:absolute;top:0;bottom:0}.cdx-tabs__prev-scroller{right:0}.cdx-tabs__next-scroller{left:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}.cdx-tabs__prev-scroller:after{right:100%}.cdx-tabs__next-scroller:before{left:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);display:block;flex:0 0 auto;max-width:16rem;border-width:0;border-top-right-radius:2px;border-top-left-radius:2px;padding:4px 12px;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-tabs__list__item:hover{cursor:pointer}.cdx-tabs__list__item[aria-selected=true]{cursor:default}.cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-right:0}.cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122);margin:8px 8px 0 4px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-blend, multiply)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-base, normal)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:8px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #3056a9)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-right:0}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1);outline:1px solid transparent;overflow:hidden} diff --git a/resources/lib/codex/modules/CdxTabs.css b/resources/lib/codex/modules/CdxTabs.css index 227bb661a407..5231e22070df 100644 --- a/resources/lib/codex/modules/CdxTabs.css +++ b/resources/lib/codex/modules/CdxTabs.css @@ -1 +1 @@ -.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{background-color:inherit;position:absolute;top:0;bottom:0}.cdx-tabs__prev-scroller{left:0}.cdx-tabs__next-scroller{right:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}.cdx-tabs__prev-scroller:after{left:100%}.cdx-tabs__next-scroller:before{right:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);display:block;flex:0 0 auto;max-width:16rem;border-width:0;border-top-left-radius:2px;border-top-right-radius:2px;padding:4px 12px;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-tabs__list__item:hover{cursor:pointer}.cdx-tabs__list__item[aria-selected=true]{cursor:default}.cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122);margin:8px 4px 0 8px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-tab-list-item-framed--hover, rgba(255, 255, 255, .3));color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-tab-list-item-framed--active, rgba(255, 255, 255, .65));color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:8px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #4b77d6)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-left:0}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #36c);outline:1px solid transparent;overflow:hidden} +.cdx-tabs__header{display:flex;align-items:flex-end;position:relative}.cdx-tabs__prev-scroller,.cdx-tabs__next-scroller{background-color:inherit;position:absolute;top:0;bottom:0}.cdx-tabs__prev-scroller{left:0}.cdx-tabs__next-scroller{right:0}.cdx-tabs__prev-scroller:after,.cdx-tabs__next-scroller:before{content:"";position:absolute;top:0;z-index:1;width:1.5rem;height:100%;pointer-events:none}.cdx-tabs__prev-scroller:after{left:100%}.cdx-tabs__next-scroller:before{right:100%}.cdx-tabs__scroll-button.cdx-button{height:100%}.cdx-tabs__list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cdx-tabs__list::-webkit-scrollbar{-webkit-appearance:none;display:none}.cdx-tabs__list__item{background-color:var(--background-color-transparent, transparent);display:block;flex:0 0 auto;max-width:16rem;border-width:0;border-top-left-radius:2px;border-top-right-radius:2px;padding:4px 12px;font-size:1rem;font-weight:700;line-height:1.4285714;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-tabs__list__item:hover{cursor:pointer}.cdx-tabs__list__item[aria-selected=true]{cursor:default}.cdx-tabs>.cdx-tabs__header .cdx-tabs__list__item+.cdx-tabs__list__item{margin-left:0}.cdx-tabs--framed>.cdx-tabs__header{background-color:var(--background-color-interactive, #eaecf0)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-interactive, #eaecf0) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item{color:var(--color-base, #202122);margin:8px 4px 0 8px}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled{overflow:hidden}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-blend, multiply)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:enabled:active{background-color:var(--background-color-interactive-subtle--active, #dadde3);color:var(--color-base, #202122)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true],.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);mix-blend-mode:var(--mix-blend-mode-base, normal)}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:disabled{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:8px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header{background-color:var(--background-color-base, #fff);margin:0 4px;border-bottom:1px solid var(--border-color-base, #a2a9b1)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__prev-scroller:after{background-image:linear-gradient(to right,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__next-scroller:before{background-image:linear-gradient(to left,var(--background-color-base, #fff) 0,var(--background-color-transparent, transparent) 100%)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item{margin:0 2px}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled{color:var(--color-base, #202122)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:hover:not([aria-selected="true"]){color:var(--color-progressive--hover, #3056a9);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--hover, #3056a9)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:enabled:active:not([aria-selected="true"]){color:var(--color-progressive--active, #233566);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected--active, #233566)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]{color:var(--color-progressive, #36c);box-shadow:inset 0 -2px 0 0 var(--box-shadow-color-progressive-selected, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item[aria-selected=true]:hover{color:var(--color-progressive, #36c)}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:disabled{color:var(--color-disabled, #a2a9b1);cursor:default}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:first-child{margin-left:0}.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:last-child{margin-right:0}.cdx-tabs--framed>.cdx-tabs__header .cdx-tabs__list__item:focus-visible,.cdx-tabs:not(.cdx-tabs--framed)>.cdx-tabs__header .cdx-tabs__list__item:focus-visible{box-shadow:inset 0 0 0 2px var(--border-color-progressive, #6485d1);outline:1px solid transparent;overflow:hidden} diff --git a/resources/lib/codex/modules/CdxTextArea-bidi.css b/resources/lib/codex/modules/CdxTextArea-bidi.css index 946efe437a0b..346c5c41370a 100644 --- a/resources/lib/codex/modules/CdxTextArea-bidi.css +++ b/resources/lib/codex/modules/CdxTextArea-bidi.css @@ -1 +1 @@ -.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem}[dir] .cdx-text-area .cdx-text-area__start-icon{transition-property:color;transition-duration:.1s}[dir=ltr] .cdx-text-area .cdx-text-area__start-icon{left:9px}[dir=rtl] .cdx-text-area .cdx-text-area__start-icon{right:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem}[dir] .cdx-text-area .cdx-text-area__end-icon{transition-property:color;transition-duration:.1s}[dir=ltr] .cdx-text-area .cdx-text-area__end-icon{right:9px}[dir=rtl] .cdx-text-area .cdx-text-area__end-icon{left:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}[dir] .cdx-text-area__textarea{border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{color:var(--color-base, #202122)}[dir] .cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}[dir] .cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-base, #202122)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{outline:1px solid transparent}[dir] .cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)}[dir] .cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}[dir=ltr] .cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-left:calc(16px + 1.25rem)}[dir=rtl] .cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-right:calc(16px + 1.25rem)}[dir=ltr] .cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-right:calc(16px + 1rem)}[dir=rtl] .cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-left:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){color:var(--color-error, #bf3c2c)}[dir] .cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem}[dir] .cdx-text-area .cdx-text-area__start-icon{transition-property:color;transition-duration:.1s}[dir=ltr] .cdx-text-area .cdx-text-area__start-icon{left:9px}[dir=rtl] .cdx-text-area .cdx-text-area__start-icon{right:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem}[dir] .cdx-text-area .cdx-text-area__end-icon{transition-property:color;transition-duration:.1s}[dir=ltr] .cdx-text-area .cdx-text-area__end-icon{right:9px}[dir=rtl] .cdx-text-area .cdx-text-area__end-icon{left:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}[dir] .cdx-text-area__textarea{border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{color:var(--color-base, #202122)}[dir] .cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}[dir] .cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{outline:1px solid transparent}[dir] .cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)}[dir] .cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}[dir=ltr] .cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-left:calc(16px + 1.25rem)}[dir=rtl] .cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-right:calc(16px + 1.25rem)}[dir=ltr] .cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-right:calc(16px + 1rem)}[dir=rtl] .cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-left:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){color:var(--color-error, #bf3c2c)}[dir] .cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxTextArea-rtl.css b/resources/lib/codex/modules/CdxTextArea-rtl.css index e1f973c5cfb0..2282858f9240 100644 --- a/resources/lib/codex/modules/CdxTextArea-rtl.css +++ b/resources/lib/codex/modules/CdxTextArea-rtl.css @@ -1 +1 @@ -.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem;transition-property:color;transition-duration:.1s;right:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem;transition-property:color;transition-duration:.1s;left:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-base, #202122)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-right:calc(16px + 1.25rem)}.cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-left:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem;transition-property:color;transition-duration:.1s;right:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem;transition-property:color;transition-duration:.1s;left:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-right:calc(16px + 1.25rem)}.cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-left:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxTextArea.css b/resources/lib/codex/modules/CdxTextArea.css index c7b570f6ca36..531ef7d8c053 100644 --- a/resources/lib/codex/modules/CdxTextArea.css +++ b/resources/lib/codex/modules/CdxTextArea.css @@ -1 +1 @@ -.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem;transition-property:color;transition-duration:.1s;left:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem;transition-property:color;transition-duration:.1s;right:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-base, #202122)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-left:calc(16px + 1.25rem)}.cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-right:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-area{position:relative}.cdx-text-area .cdx-text-area__start-icon{position:absolute;top:4px;min-width:20px;min-height:20px;width:1.25rem;height:1.5rem;transition-property:color;transition-duration:.1s;left:9px}.cdx-text-area .cdx-text-area__end-icon{position:absolute;top:4px;min-width:16px;min-height:16px;width:1rem;height:1.5rem;transition-property:color;transition-duration:.1s;right:9px}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__start-icon{background-position:center;background-repeat:no-repeat;background-size:max(1.25rem,20px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__start-icon{-webkit-mask-size:max(1.25rem,20px);mask-size:max(1.25rem,20px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__icon.cdx-text-area__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem;height:1.5rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-area__icon.cdx-text-area__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-area__icon.cdx-text-area__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-area__textarea{display:block;box-sizing:border-box;min-height:64px;width:100%;border-width:1px;border-style:solid;border-radius:2px;padding:4px 8px;overflow:auto;font-family:inherit;font-size:inherit;line-height:1.4285714;resize:vertical}.cdx-text-area__textarea--is-autosize{resize:none;overflow:hidden}.cdx-text-area__textarea--is-autosize::-webkit-resizer{display:none}.cdx-text-area__textarea:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-area__textarea:enabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-placeholder, #72777d)}.cdx-text-area__textarea:enabled~.cdx-text-area__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-area__textarea:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon-vue.cdx-icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-subtle, #54595d)}.cdx-text-area__textarea:enabled:focus~.cdx-text-area__icon,.cdx-text-area__textarea:enabled.cdx-text-area__textarea--has-value~.cdx-text-area__icon{opacity:1}.cdx-text-area__textarea:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-area__textarea:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-area__textarea:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-disabled, #a2a9b1)}.cdx-text-area__textarea:disabled~.cdx-text-area__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-area__textarea::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-area--has-start-icon .cdx-text-area__textarea{padding-left:calc(16px + 1.25rem)}.cdx-text-area--has-end-icon .cdx-text-area__textarea{padding-right:calc(16px + 1rem)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus)~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error, #bf3c2c)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-area--status-error .cdx-text-area__textarea:enabled:not(:read-only):not(:focus):hover~.cdx-text-area__icon-vue.cdx-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxTextInput-bidi.css b/resources/lib/codex/modules/CdxTextInput-bidi.css index b8b5f46fcfde..51daf6f94cf3 100644 --- a/resources/lib/codex/modules/CdxTextInput-bidi.css +++ b/resources/lib/codex/modules/CdxTextInput-bidi.css @@ -1 +1 @@ -.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;overflow:hidden}[dir] .cdx-text-input{border-radius:2px}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-text-input .cdx-text-input__start-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-text-input .cdx-text-input__start-icon{left:9px}[dir=rtl] .cdx-text-input .cdx-text-input__start-icon{right:9px}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem}[dir] .cdx-text-input__clear-icon.cdx-icon,[dir] .cdx-text-input .cdx-text-input__end-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-text-input__clear-icon.cdx-icon,[dir=ltr] .cdx-text-input .cdx-text-input__end-icon{right:9px}[dir=rtl] .cdx-text-input__clear-icon.cdx-icon,[dir=rtl] .cdx-text-input .cdx-text-input__end-icon{left:9px}[dir] .cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}[dir=ltr] .cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{right:calc(17px + 1rem)}[dir=rtl] .cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{left:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;font-family:inherit;font-size:inherit;line-height:1.375}[dir] .cdx-text-input__input{margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px}.cdx-text-input__input:enabled{color:var(--color-base, #202122)}[dir] .cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}[dir] .cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{outline:1px solid transparent}[dir] .cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)}[dir] .cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}[dir=ltr] .cdx-text-input--has-start-icon .cdx-text-input__input{padding-left:calc(16px + 1.25rem)}[dir=rtl] .cdx-text-input--has-start-icon .cdx-text-input__input{padding-right:calc(16px + 1.25rem)}[dir=ltr] .cdx-text-input--has-end-icon .cdx-text-input__input,[dir=ltr] .cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(16px + 1rem)}[dir=rtl] .cdx-text-input--has-end-icon .cdx-text-input__input,[dir=rtl] .cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(16px + 1rem)}[dir=ltr] .cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(24px + 2rem)}[dir=rtl] .cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){color:var(--color-error, #bf3c2c)}[dir] .cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;overflow:hidden}[dir] .cdx-text-input{border-radius:2px}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-text-input .cdx-text-input__start-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-text-input .cdx-text-input__start-icon{left:9px}[dir=rtl] .cdx-text-input .cdx-text-input__start-icon{right:9px}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem}[dir] .cdx-text-input__clear-icon.cdx-icon,[dir] .cdx-text-input .cdx-text-input__end-icon{transition-property:color;transition-duration:.1s;transform:translateY(-50%)}[dir=ltr] .cdx-text-input__clear-icon.cdx-icon,[dir=ltr] .cdx-text-input .cdx-text-input__end-icon{right:9px}[dir=rtl] .cdx-text-input__clear-icon.cdx-icon,[dir=rtl] .cdx-text-input .cdx-text-input__end-icon{left:9px}[dir] .cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}[dir=ltr] .cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{right:calc(17px + 1rem)}[dir=rtl] .cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{left:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;font-family:inherit;font-size:inherit;line-height:1.375}[dir] .cdx-text-input__input{margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px}.cdx-text-input__input:enabled{color:var(--color-base, #202122)}[dir] .cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}[dir] .cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-subtle, #54595d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__clear-icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__clear-icon{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{outline:1px solid transparent}[dir] .cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1)}[dir] .cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}[dir=ltr] .cdx-text-input--has-start-icon .cdx-text-input__input{padding-left:calc(16px + 1.25rem)}[dir=rtl] .cdx-text-input--has-start-icon .cdx-text-input__input{padding-right:calc(16px + 1.25rem)}[dir=ltr] .cdx-text-input--has-end-icon .cdx-text-input__input,[dir=ltr] .cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(16px + 1rem)}[dir=rtl] .cdx-text-input--has-end-icon .cdx-text-input__input,[dir=rtl] .cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(16px + 1rem)}[dir=ltr] .cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(24px + 2rem)}[dir=rtl] .cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){color:var(--color-error, #bf3c2c)}[dir] .cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{color:var(--color-error--hover, #9f3526)}[dir] .cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxTextInput-rtl.css b/resources/lib/codex/modules/CdxTextInput-rtl.css index 6765bd129afe..f1f8dc7c00d9 100644 --- a/resources/lib/codex/modules/CdxTextInput-rtl.css +++ b/resources/lib/codex/modules/CdxTextInput-rtl.css @@ -1 +1 @@ -.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;border-radius:2px;overflow:hidden}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;right:9px;transform:translateY(-50%)}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem;transition-property:color;transition-duration:.1s;left:9px;transform:translateY(-50%)}.cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}.cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{left:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px;font-family:inherit;font-size:inherit;line-height:1.375}.cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}.cdx-text-input--has-start-icon .cdx-text-input__input{padding-right:calc(16px + 1.25rem)}.cdx-text-input--has-end-icon .cdx-text-input__input,.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(16px + 1rem)}.cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;border-radius:2px;overflow:hidden}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;right:9px;transform:translateY(-50%)}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem;transition-property:color;transition-duration:.1s;left:9px;transform:translateY(-50%)}.cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}.cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{left:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px;font-family:inherit;font-size:inherit;line-height:1.375}.cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-subtle, #54595d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__clear-icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__clear-icon{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}.cdx-text-input--has-start-icon .cdx-text-input__input{padding-right:calc(16px + 1.25rem)}.cdx-text-input--has-end-icon .cdx-text-input__input,.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(16px + 1rem)}.cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-left:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxTextInput.css b/resources/lib/codex/modules/CdxTextInput.css index 51aeea79fe73..f24d6593d12f 100644 --- a/resources/lib/codex/modules/CdxTextInput.css +++ b/resources/lib/codex/modules/CdxTextInput.css @@ -1 +1 @@ -.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;border-radius:2px;overflow:hidden}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;left:9px;transform:translateY(-50%)}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem;transition-property:color;transition-duration:.1s;right:9px;transform:translateY(-50%)}.cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}.cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{right:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px;font-family:inherit;font-size:inherit;line-height:1.375}.cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}.cdx-text-input--has-start-icon .cdx-text-input__input{padding-left:calc(16px + 1.25rem)}.cdx-text-input--has-end-icon .cdx-text-input__input,.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(16px + 1rem)}.cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} +.cdx-text-input{position:relative;box-sizing:border-box;min-width:256px;border-radius:2px;overflow:hidden}.cdx-text-input .cdx-text-input__start-icon{position:absolute;top:50%;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;transition-property:color;transition-duration:.1s;left:9px;transform:translateY(-50%)}.cdx-text-input__icon.cdx-text-input__end-icon{min-width:16px;min-height:16px;width:1rem;height:1rem}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-text-input__icon.cdx-text-input__end-icon{background-position:center;background-repeat:no-repeat;background-size:max(1rem,16px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-text-input__icon.cdx-text-input__end-icon{-webkit-mask-size:max(1rem,16px);mask-size:max(1rem,16px);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}}.cdx-text-input__clear-icon.cdx-icon,.cdx-text-input .cdx-text-input__end-icon{position:absolute;top:50%;min-width:16px;min-height:16px;width:1rem;height:1rem;transition-property:color;transition-duration:.1s;right:9px;transform:translateY(-50%)}.cdx-text-input__clear-icon.cdx-icon:hover{cursor:pointer}.cdx-text-input__end-icon.cdx-icon+.cdx-text-input__clear-icon.cdx-icon{right:calc(17px + 1rem)}.cdx-text-input__input{display:block;box-sizing:border-box;min-height:32px;width:100%;margin:0;border-width:1px;border-style:solid;border-radius:0;padding:4px 8px;font-family:inherit;font-size:inherit;line-height:1.375}.cdx-text-input__input:enabled{background-color:var(--background-color-base, #fff);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d);box-shadow:inset 0 0 0 1px var(--box-shadow-color-transparent, transparent);transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-text-input__input:enabled~.cdx-text-input__icon-vue{color:var(--color-placeholder, #72777d)}.cdx-text-input__input:enabled~.cdx-text-input__icon{opacity:var(--opacity-icon-placeholder, .51)}.cdx-text-input__input:enabled:hover{border-color:var(--border-color-interactive--hover, #27292d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon-vue,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon-vue{color:var(--color-subtle, #54595d)}.cdx-text-input__input:enabled:focus~.cdx-text-input__clear-icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__clear-icon{color:var(--color-base, #202122)}.cdx-text-input__input:enabled:focus~.cdx-text-input__icon,.cdx-text-input__input:enabled.cdx-text-input__input--has-value~.cdx-text-input__icon{opacity:1}.cdx-text-input__input:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-text-input__input:enabled:read-only{background-color:var(--background-color-neutral-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-text-input__input:disabled{background-color:var(--background-color-disabled-subtle, #eaecf0);color:var(--color-disabled, #a2a9b1);-webkit-text-fill-color:var(--color-disabled, #a2a9b1);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-text-input__input:disabled~.cdx-text-input__icon-vue{color:var(--color-disabled, #a2a9b1);pointer-events:none}.cdx-text-input__input:disabled~.cdx-text-input__icon{opacity:var(--opacity-icon-base--disabled, .51)}.cdx-text-input__input::placeholder{color:var(--color-placeholder, #72777d);opacity:1}.cdx-text-input__input::-ms-clear{display:none}.cdx-text-input__input[type=search]{-webkit-appearance:none;-moz-appearance:textfield}.cdx-text-input__input[type=search]::-webkit-search-decoration,.cdx-text-input__input[type=search]::-webkit-search-cancel-button{display:none}.cdx-text-input--has-start-icon .cdx-text-input__input{padding-left:calc(16px + 1.25rem)}.cdx-text-input--has-end-icon .cdx-text-input__input,.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(16px + 1rem)}.cdx-text-input--has-end-icon.cdx-text-input--clearable .cdx-text-input__input{padding-right:calc(24px + 2rem)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus){background-color:var(--background-color-error-subtle, #ffe9e5);color:var(--color-error, #bf3c2c);border-color:var(--border-color-error, #f54739)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus)~.cdx-text-input__end-icon{color:var(--color-error, #bf3c2c)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover{background-color:var(--background-color-error-subtle--hover, #ffdad3);color:var(--color-error--hover, #9f3526);border-color:var(--border-color-error--hover, #9f3526)}.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover::placeholder,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__start-icon,.cdx-text-input--status-error .cdx-text-input__input:enabled:not(:read-only):not(:focus):hover~.cdx-text-input__end-icon{color:var(--color-error--hover, #9f3526)} diff --git a/resources/lib/codex/modules/CdxToggleButton-bidi.css b/resources/lib/codex/modules/CdxToggleButton-bidi.css index 99ff53bcd8d0..61a52222ae49 100644 --- a/resources/lib/codex/modules/CdxToggleButton-bidi.css +++ b/resources/lib/codex/modules/CdxToggleButton-bidi.css @@ -1 +1 @@ -.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none}[dir] .cdx-toggle-button{margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px}[dir] .cdx-toggle-button--size-large{padding-right:15px;padding-left:15px}.cdx-toggle-button--icon-only{min-width:32px}[dir] .cdx-toggle-button--icon-only{padding-right:5px;padding-left:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px}[dir] .cdx-toggle-button--icon-only.cdx-toggle-button--size-large{padding-right:11px;padding-left:11px}[dir] .cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}[dir] .cdx-toggle-button:enabled:hover{cursor:pointer}.cdx-toggle-button:enabled:focus{outline:1px solid transparent}[dir] .cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}.cdx-toggle-button:enabled:active,.cdx-toggle-button:enabled.cdx-toggle-button--is-active{color:var(--color-emphasized, #101418)}[dir] .cdx-toggle-button:enabled:active,[dir] .cdx-toggle-button:enabled.cdx-toggle-button--is-active{border-color:var(--border-color-interactive, #72777d);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}[dir] .cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-toggle-button--framed:enabled:hover{color:var(--color-base--hover, #404244)}[dir] .cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-base, #fff)}[dir] .cdx-toggle-button--framed:enabled:active,[dir] .cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--framed:disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{color:var(--color-emphasized, #101418)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0);border-color:var(--border-color-interactive, #72777d);box-shadow:none}[dir] .cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}[dir] .cdx-toggle-button--quiet:enabled:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa)}[dir] .cdx-toggle-button--quiet:enabled:focus{background-color:var(--background-color-interactive-subtle, #f8f9fa)}[dir] .cdx-toggle-button--quiet:enabled:active,[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} +.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none}[dir] .cdx-toggle-button{margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px}[dir] .cdx-toggle-button--size-large{padding-right:15px;padding-left:15px}.cdx-toggle-button--icon-only{min-width:32px}[dir] .cdx-toggle-button--icon-only{padding-right:5px;padding-left:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px}[dir] .cdx-toggle-button--icon-only.cdx-toggle-button--size-large{padding-right:11px;padding-left:11px}[dir] .cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}[dir] .cdx-toggle-button:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-toggle-button:enabled:focus{outline:1px solid transparent}[dir] .cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-toggle-button:enabled:active,[dir] .cdx-toggle-button:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}.cdx-toggle-button--framed:enabled{color:var(--color-base, #202122)}[dir] .cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-interactive, #72777d)}[dir] .cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}[dir] .cdx-toggle-button--framed:enabled:active,[dir] .cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122);box-shadow:none}.cdx-toggle-button--framed:disabled{color:var(--color-disabled-emphasized, #a2a9b1)}[dir] .cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{color:var(--color-inverted-fixed, #fff)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,[dir] .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:none}[dir] .cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:hover{background-color:var(--background-color-interactive--hover, #dadde3)}[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:focus{background-color:var(--background-color-interactive, #eaecf0)}[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:active,[dir] .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on.cdx-toggle-button--is-active{background-color:var(--background-color-interactive--active, #c8ccd1)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxToggleButton-rtl.css b/resources/lib/codex/modules/CdxToggleButton-rtl.css index 50eed04fbcbd..0dc26e060f90 100644 --- a/resources/lib/codex/modules/CdxToggleButton-rtl.css +++ b/resources/lib/codex/modules/CdxToggleButton-rtl.css @@ -1 +1 @@ -.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-left:11px;padding-right:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px;padding-left:15px;padding-right:15px}.cdx-toggle-button--icon-only{min-width:32px;padding-left:5px;padding-right:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px;padding-left:11px;padding-right:11px}.cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}.cdx-toggle-button:enabled:hover{cursor:pointer}.cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-button:enabled:active,.cdx-toggle-button:enabled.cdx-toggle-button--is-active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}.cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244)}.cdx-toggle-button--framed:enabled:active,.cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive--active, #233566);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d);box-shadow:none}.cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-toggle-button--quiet:enabled:focus{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-toggle-button--quiet:enabled:active,.cdx-toggle-button--quiet:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} +.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-left:11px;padding-right:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px;padding-left:15px;padding-right:15px}.cdx-toggle-button--icon-only{min-width:32px;padding-left:5px;padding-right:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px;padding-left:11px;padding-right:11px}.cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}.cdx-toggle-button:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-button:enabled:active,.cdx-toggle-button:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}.cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d)}.cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-toggle-button--framed:enabled:active,.cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122);box-shadow:none}.cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:hover{background-color:var(--background-color-interactive--hover, #dadde3)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:focus{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:active,.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on.cdx-toggle-button--is-active{background-color:var(--background-color-interactive--active, #c8ccd1)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxToggleButton.css b/resources/lib/codex/modules/CdxToggleButton.css index b04645aa1636..147098c09e61 100644 --- a/resources/lib/codex/modules/CdxToggleButton.css +++ b/resources/lib/codex/modules/CdxToggleButton.css @@ -1 +1 @@ -.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px;padding-right:15px;padding-left:15px}.cdx-toggle-button--icon-only{min-width:32px;padding-right:5px;padding-left:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px;padding-right:11px;padding-left:11px}.cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}.cdx-toggle-button:enabled:hover{cursor:pointer}.cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-button:enabled:active,.cdx-toggle-button:enabled.cdx-toggle-button--is-active{color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}.cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);border-color:var(--border-color-base, #a2a9b1)}.cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-base, #fff);color:var(--color-base--hover, #404244)}.cdx-toggle-button--framed:enabled:active,.cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive--active, #233566);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--active, #233566)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0);color:var(--color-emphasized, #101418);border-color:var(--border-color-interactive, #72777d);box-shadow:none}.cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled:hover{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-toggle-button--quiet:enabled:focus{background-color:var(--background-color-interactive-subtle, #f8f9fa)}.cdx-toggle-button--quiet:enabled:active,.cdx-toggle-button--quiet:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} +.cdx-toggle-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;box-sizing:border-box;min-height:32px;max-width:28rem;margin:0;border-width:1px;border-style:solid;border-radius:2px;padding-right:11px;padding-left:11px;font-family:inherit;font-size:inherit;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:none;transition-property:background-color,color,border-color,box-shadow;transition-duration:.1s}.cdx-toggle-button--size-large{min-height:44px;padding-right:15px;padding-left:15px}.cdx-toggle-button--icon-only{min-width:32px;padding-right:5px;padding-left:5px}.cdx-toggle-button--icon-only.cdx-toggle-button--size-large{min-width:44px;padding-right:11px;padding-left:11px}.cdx-toggle-button::-moz-focus-inner{border:0;padding:0}.cdx-toggle-button:enabled{color:var(--color-base, #202122)}.cdx-toggle-button:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);cursor:pointer}.cdx-toggle-button:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-button:enabled:active,.cdx-toggle-button:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-toggle-button .cdx-icon{color:inherit;vertical-align:middle}.cdx-toggle-button--framed:enabled{background-color:var(--background-color-interactive-subtle, #f8f9fa);color:var(--color-base, #202122);border-color:var(--border-color-interactive, #72777d)}.cdx-toggle-button--framed:enabled:hover{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d);cursor:pointer}.cdx-toggle-button--framed:enabled:active,.cdx-toggle-button--framed:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122);box-shadow:none}.cdx-toggle-button--framed:disabled{background-color:var(--background-color-disabled, #dadde3);color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled{background-color:var(--background-color-progressive, #36c);color:var(--color-inverted-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus{border-color:var(--border-color-progressive--focus, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c),inset 0 0 0 2px var(--box-shadow-color-inverted, #fff)}.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active,.cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled.cdx-toggle-button--is-active{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:none}.cdx-toggle-button--quiet{background-color:var(--background-color-transparent, transparent);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:hover{background-color:var(--background-color-interactive--hover, #dadde3)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:focus{background-color:var(--background-color-interactive, #eaecf0)}.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on:active,.cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on.cdx-toggle-button--is-active{background-color:var(--background-color-interactive--active, #c8ccd1)}.cdx-toggle-button--quiet:disabled{color:var(--color-disabled, #a2a9b1)} diff --git a/resources/lib/codex/modules/CdxToggleSwitch-bidi.css b/resources/lib/codex/modules/CdxToggleSwitch-bidi.css index c669f166550a..36e5a81f4b8d 100644 --- a/resources/lib/codex/modules/CdxToggleSwitch-bidi.css +++ b/resources/lib/codex/modules/CdxToggleSwitch-bidi.css @@ -1 +1 @@ -.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0}[dir] .cdx-toggle-switch{margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}[dir] .cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}[dir=ltr] .cdx-toggle-switch__label:not(:empty),[dir=ltr] .cdx-toggle-switch__label.cdx-label:not(:empty){padding-right:6px}[dir=rtl] .cdx-toggle-switch__label:not(:empty),[dir=rtl] .cdx-toggle-switch__label.cdx-label:not(:empty){padding-left:6px}[dir] .cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;overflow:hidden}[dir] .cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;bottom:1px;z-index:1}[dir] .cdx-toggle-switch__switch:before{right:1px;left:1px;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-toggle-switch__switch__grip{border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}[dir=ltr] .cdx-toggle-switch__switch__grip{transform:translate(.3125rem) translateY(-50%)}[dir=rtl] .cdx-toggle-switch__switch__grip{transform:translate(-.3125rem) translateY(-50%)}.cdx-toggle-switch__input{opacity:0;position:absolute;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;font-size:inherit}[dir] .cdx-toggle-switch__input{margin:0}[dir=ltr] .cdx-toggle-switch__input{right:0}[dir=rtl] .cdx-toggle-switch__input{left:0}[dir] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff)}[dir=ltr] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{transform:translate(calc(100% + .0625rem)) translateY(-50%)}[dir=rtl] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{transform:translate(calc(-1*(100% + .0625rem))) translateY(-50%)}[dir] .cdx-toggle-switch__input:enabled:hover,[dir] .cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,[dir] .cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}[dir] .cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}[dir] .cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{outline:1px solid transparent}[dir] .cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c)}[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-progressive--active, #233566)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-inverted, #fff)}[dir] .cdx-toggle-switch__input:disabled{cursor:default}[dir] .cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} +.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0}[dir] .cdx-toggle-switch{margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}[dir] .cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}[dir=ltr] .cdx-toggle-switch__label:not(:empty),[dir=ltr] .cdx-toggle-switch__label.cdx-label:not(:empty){padding-right:6px}[dir=rtl] .cdx-toggle-switch__label:not(:empty),[dir=rtl] .cdx-toggle-switch__label.cdx-label:not(:empty){padding-left:6px}[dir] .cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;overflow:hidden}[dir] .cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;bottom:1px;z-index:1}[dir] .cdx-toggle-switch__switch:before{right:1px;left:1px;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem}[dir] .cdx-toggle-switch__switch__grip{border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}[dir=ltr] .cdx-toggle-switch__switch__grip{transform:translate(.3125rem) translateY(-50%)}[dir=rtl] .cdx-toggle-switch__switch__grip{transform:translate(-.3125rem) translateY(-50%)}.cdx-toggle-switch__input{opacity:0;position:absolute;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;font-size:inherit}[dir] .cdx-toggle-switch__input{margin:0}[dir=ltr] .cdx-toggle-switch__input{right:0}[dir=rtl] .cdx-toggle-switch__input{left:0}[dir] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff)}[dir=ltr] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{transform:translate(calc(100% + .0625rem)) translateY(-50%)}[dir=rtl] .cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{transform:translate(calc(-1*(100% + .0625rem))) translateY(-50%)}[dir] .cdx-toggle-switch__input:enabled:hover,[dir] .cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,[dir] .cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}[dir] .cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}[dir] .cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}[dir] .cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}[dir] .cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{outline:1px solid transparent}[dir] .cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c)}[dir] .cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,[dir] .cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:disabled{cursor:default}[dir] .cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}[dir] .cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}[dir] .cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} diff --git a/resources/lib/codex/modules/CdxToggleSwitch-rtl.css b/resources/lib/codex/modules/CdxToggleSwitch-rtl.css index 5796bf77215a..83040c9bc5c6 100644 --- a/resources/lib/codex/modules/CdxToggleSwitch-rtl.css +++ b/resources/lib/codex/modules/CdxToggleSwitch-rtl.css @@ -1 +1 @@ -.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0;margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}.cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}.cdx-toggle-switch__label:not(:empty),.cdx-toggle-switch__label.cdx-label:not(:empty){padding-left:6px}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;overflow:hidden;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;left:1px;bottom:1px;right:1px;z-index:1;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transform:translate(-.3125rem) translateY(-50%);transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}.cdx-toggle-switch__input{opacity:0;position:absolute;left:0;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;margin:0;font-size:inherit}.cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff);transform:translate(calc(-1*(100% + .0625rem))) translateY(-50%)}.cdx-toggle-switch__input:enabled:hover,.cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:disabled{cursor:default}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} +.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0;margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}.cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}.cdx-toggle-switch__label:not(:empty),.cdx-toggle-switch__label.cdx-label:not(:empty){padding-left:6px}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;overflow:hidden;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;left:1px;bottom:1px;right:1px;z-index:1;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transform:translate(-.3125rem) translateY(-50%);transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}.cdx-toggle-switch__input{opacity:0;position:absolute;left:0;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;margin:0;font-size:inherit}.cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff);transform:translate(calc(-1*(100% + .0625rem))) translateY(-50%)}.cdx-toggle-switch__input:enabled:hover,.cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled{cursor:default}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} diff --git a/resources/lib/codex/modules/CdxToggleSwitch.css b/resources/lib/codex/modules/CdxToggleSwitch.css index 52c08af05155..12c7702f28dd 100644 --- a/resources/lib/codex/modules/CdxToggleSwitch.css +++ b/resources/lib/codex/modules/CdxToggleSwitch.css @@ -1 +1 @@ -.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0;margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}.cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}.cdx-toggle-switch__label:not(:empty),.cdx-toggle-switch__label.cdx-label:not(:empty){padding-right:6px}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;overflow:hidden;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;right:1px;bottom:1px;left:1px;z-index:1;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transform:translate(.3125rem) translateY(-50%);transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}.cdx-toggle-switch__input{opacity:0;position:absolute;right:0;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;margin:0;font-size:inherit}.cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff);transform:translate(calc(100% + .0625rem)) translateY(-50%)}.cdx-toggle-switch__input:enabled:hover,.cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-progressive--hover, #3056a9)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-progressive, #36c)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-progressive--active, #233566);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:disabled{cursor:default}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} +.cdx-toggle-switch{display:inline-flex;align-items:center;justify-content:flex-start;position:relative;z-index:0;margin-bottom:12px}.cdx-toggle-switch--align-switch{display:flex;justify-content:space-between}.cdx-toggle-switch:last-child{margin-bottom:0}.cdx-toggle-switch__label,.cdx-toggle-switch__label.cdx-label{order:-1}.cdx-toggle-switch__label:not(:empty),.cdx-toggle-switch__label.cdx-label:not(:empty){padding-right:6px}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label{padding-bottom:0}.cdx-toggle-switch .cdx-toggle-switch__label.cdx-label .cdx-label__label__text{font-weight:400}.cdx-toggle-switch__switch{transform:translateZ(0);background-color:var(--background-color-base, #fff);display:inline-block;flex-shrink:0;position:relative;box-sizing:border-box;min-width:48px;min-height:32px;width:3rem;height:2rem;border-width:1px;border-style:solid;border-color:var(--border-color-interactive, #72777d);border-radius:9999px;overflow:hidden;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch:before{content:"";display:block;position:absolute;top:1px;right:1px;bottom:1px;left:1px;z-index:1;border:1px solid var(--border-color-transparent, transparent);border-radius:9999px;transition-property:background-color,color,border-color,box-shadow;transition-duration:.25s}.cdx-toggle-switch__switch__grip{position:absolute;top:50%;box-sizing:border-box;min-width:20px;min-height:20px;width:1.25rem;height:1.25rem;border:1px solid var(--border-color-interactive, #72777d);border-radius:50%;transform:translate(.3125rem) translateY(-50%);transition-property:background-color,border-color,transform;transition-duration:.25s,.1s,.1s}.cdx-toggle-switch__input{opacity:0;position:absolute;right:0;z-index:2;min-width:48px;min-height:32px;width:3rem;height:2rem;margin:0;font-size:inherit}.cdx-toggle-switch__input:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-inverted, #fff);transform:translate(calc(100% + .0625rem)) translateY(-50%)}.cdx-toggle-switch__input:enabled:hover,.cdx-toggle-switch__input:enabled~.cdx-label .cdx-label__label:hover,.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__label:not(.cdx-label):hover{cursor:pointer}.cdx-toggle-switch__input:enabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--hover, #eaecf0);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:hover~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--hover, #27292d)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch{background-color:var(--background-color-interactive-subtle--active, #dadde3);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base, #fff);border-color:var(--border-color-interactive--active, #202122)}.cdx-toggle-switch__input:enabled:focus:not(:active)~.cdx-toggle-switch__switch{box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c);outline:1px solid transparent}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive, #36c);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--background-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:hover~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--hover, #3056a9);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch{border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch:before,.cdx-toggle-switch__input:enabled:checked:focus:not(:active)~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-inverted, #fff)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch{background-color:var(--background-color-progressive--active, #233566);border-color:var(--border-color-transparent, transparent);box-shadow:inset 0 0 0 1px var(--box-shadow-color-progressive--active, #233566)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch:before{border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:enabled:checked:active~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--background-color-base-fixed, #fff);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled{cursor:default}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled-subtle, #eaecf0);border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{border-color:var(--border-color-disabled, #c8ccd1)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch{background-color:var(--background-color-disabled, #dadde3);border-color:var(--border-color-transparent, transparent)}.cdx-toggle-switch__input:disabled:checked~.cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip{background-color:var(--color-disabled-emphasized, #a2a9b1);border-color:var(--border-color-transparent, transparent)} diff --git a/resources/lib/codex/modules/CdxTooltip.cjs b/resources/lib/codex/modules/CdxTooltip.cjs index b82d7bd438c0..cf7f2180a419 100644 --- a/resources/lib/codex/modules/CdxTooltip.cjs +++ b/resources/lib/codex/modules/CdxTooltip.cjs @@ -1 +1 @@ -"use strict";var a=Object.defineProperty;var p=(t,e,i)=>e in t?a(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i;var n=(t,e,i)=>(p(t,typeof e!="symbol"?e+"":e,i),i);const c=require("./useGeneratedId.cjs"),s=require("./floating-ui.dom.js");class E{constructor(e,i){n(this,"referenceElement");n(this,"tooltipElement");n(this,"textContent");n(this,"placement");n(this,"autoUpdateCleanup");n(this,"referenceElementHandlers");n(this,"tooltipElementHandlers");n(this,"escapeHandler");n(this,"timeoutId");var h,o;const l=e.ownerDocument,r=c("tooltip");this.referenceElement=e,this.textContent=i.textContent,this.placement=(h=i.placement)!=null?h:"bottom",this.timeoutId=null,this.tooltipElement=l.createElement("div"),this.tooltipElement.classList.add("cdx-tooltip"),this.tooltipElement.role="tooltip",this.tooltipElement.id=r,this.referenceElement.setAttribute("aria-describedby",r),this.tooltipElement.textContent=this.textContent,(o=this.referenceElement.parentElement)==null||o.appendChild(this.tooltipElement),this.referenceElementHandlers={},this.referenceElementHandlers.mouseenter=this.show.bind(this),this.referenceElementHandlers.mouseleave=this.hideAfterDelay.bind(this),this.referenceElementHandlers.focus=this.show.bind(this),this.referenceElementHandlers.blur=this.hide.bind(this),this.tooltipElementHandlers={},this.tooltipElementHandlers.mouseenter=this.show.bind(this),this.tooltipElementHandlers.mouseleave=this.hideAfterDelay.bind(this),this.escapeHandler=this.onKeyup.bind(this),this.addEventListeners(),this.autoUpdateCleanup=s.autoUpdate(this.referenceElement,this.tooltipElement,()=>this.update())}isVisible(){return this.tooltipElement.style.display==="block"}show(){this.timeoutId&&clearTimeout(this.timeoutId),this.tooltipElement.style.display="block",this.tooltipElement.ownerDocument.addEventListener("keyup",this.escapeHandler)}hide(){this.tooltipElement.style.display="none",this.tooltipElement.ownerDocument.removeEventListener("keyup",this.escapeHandler)}hideAfterDelay(){this.timeoutId=setTimeout(this.hide.bind(this),250)}onKeyup(e){e.key==="Escape"&&this.isVisible()&&this.hide()}addEventListeners(){Object.keys(this.referenceElementHandlers).forEach(e=>{this.referenceElement.addEventListener(e,this.referenceElementHandlers[e])}),Object.keys(this.tooltipElementHandlers).forEach(e=>{this.tooltipElement.addEventListener(e,this.tooltipElementHandlers[e])})}removeEventListeners(){Object.keys(this.referenceElementHandlers).forEach(e=>{this.referenceElement.removeEventListener(e,this.referenceElementHandlers[e])}),Object.keys(this.tooltipElementHandlers).forEach(e=>{this.tooltipElement.removeEventListener(e,this.tooltipElementHandlers[e])})}update(){s.computePosition(this.referenceElement,this.tooltipElement,{placement:this.placement,middleware:[s.offset(4),s.flip(),s.shift(),s.hide()]}).then(({x:e,y:i,middlewareData:l})=>{var o,m,d;const r=(m=(o=l.offset)==null?void 0:o.placement)!=null?m:this.placement,h={left:"right","left-start":"right","left-end":"right",top:"bottom","top-start":"bottom","top-end":"bottom",bottom:"top","bottom-start":"top","bottom-end":"top",right:"left","right-start":"left","right-end":"left"};Object.assign(this.tooltipElement.style,{left:"".concat(e,"px"),top:"".concat(i,"px"),visibility:(d=l.hide)!=null&&d.referenceHidden?"hidden":"visible",transformOrigin:h[r]})})}remove(){this.tooltipElement.remove(),this.autoUpdateCleanup(),this.removeEventListeners()}}const f={mounted(t,{value:e,arg:i}){t.tooltip=new E(t,{textContent:String(e),placement:i})},beforeUnmount(t){t.tooltip&&t.tooltip.remove()}};module.exports=f; +"use strict";var p=Object.defineProperty;var a=(t,e,i)=>e in t?p(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i;var n=(t,e,i)=>(a(t,typeof e!="symbol"?e+"":e,i),i);const c=require("./useGeneratedId.cjs"),s=require("./floating-ui.dom.js");class E{constructor(e,i){n(this,"referenceElement");n(this,"tooltipElement");n(this,"textContent");n(this,"placement");n(this,"autoUpdateCleanup");n(this,"referenceElementHandlers");n(this,"tooltipElementHandlers");n(this,"escapeHandler");n(this,"timeoutId");var h,o;const l=e.ownerDocument,r=c("tooltip");this.referenceElement=e,this.textContent=i.textContent,this.placement=(h=i.placement)!=null?h:"bottom",this.timeoutId=null,this.tooltipElement=l.createElement("div"),this.tooltipElement.classList.add("cdx-tooltip"),this.tooltipElement.role="tooltip",this.tooltipElement.id=r,this.referenceElement.setAttribute("aria-describedby",r),this.tooltipElement.textContent=this.textContent,(o=this.referenceElement.parentElement)==null||o.appendChild(this.tooltipElement),this.referenceElementHandlers={},this.referenceElementHandlers.mouseenter=this.show.bind(this),this.referenceElementHandlers.mouseleave=this.hideAfterDelay.bind(this),this.referenceElementHandlers.focus=this.show.bind(this),this.referenceElementHandlers.blur=this.hide.bind(this),this.tooltipElementHandlers={},this.tooltipElementHandlers.mouseenter=this.show.bind(this),this.tooltipElementHandlers.mouseleave=this.hideAfterDelay.bind(this),this.escapeHandler=this.onKeyup.bind(this),this.addEventListeners(),this.autoUpdateCleanup=s.autoUpdate(this.referenceElement,this.tooltipElement,()=>this.update())}isVisible(){return this.tooltipElement.style.display==="block"}show(){this.timeoutId&&clearTimeout(this.timeoutId),this.tooltipElement.style.display="block",this.tooltipElement.ownerDocument.addEventListener("keyup",this.escapeHandler)}hide(){this.tooltipElement.style.display="none",this.tooltipElement.ownerDocument.removeEventListener("keyup",this.escapeHandler)}hideAfterDelay(){this.timeoutId=setTimeout(this.hide.bind(this),250)}onKeyup(e){e.key==="Escape"&&this.isVisible()&&this.hide()}addEventListeners(){Object.keys(this.referenceElementHandlers).forEach(e=>{this.referenceElement.addEventListener(e,this.referenceElementHandlers[e])}),Object.keys(this.tooltipElementHandlers).forEach(e=>{this.tooltipElement.addEventListener(e,this.tooltipElementHandlers[e])})}removeEventListeners(){Object.keys(this.referenceElementHandlers).forEach(e=>{this.referenceElement.removeEventListener(e,this.referenceElementHandlers[e])}),Object.keys(this.tooltipElementHandlers).forEach(e=>{this.tooltipElement.removeEventListener(e,this.tooltipElementHandlers[e])})}update(){s.computePosition(this.referenceElement,this.tooltipElement,{placement:this.placement,middleware:[s.offset(4),s.flip(),s.shift(),s.hide()]}).then(({x:e,y:i,middlewareData:l})=>{var o,m,d;const r=(m=(o=l.offset)==null?void 0:o.placement)!=null?m:this.placement,h={left:"right","left-start":"right","left-end":"right",top:"bottom","top-start":"bottom","top-end":"bottom",bottom:"top","bottom-start":"top","bottom-end":"top",right:"left","right-start":"left","right-end":"left"};Object.assign(this.tooltipElement.style,{left:"".concat(e,"px"),top:"".concat(i,"px"),visibility:(d=l.hide)!=null&&d.referenceHidden?"hidden":"visible",transformOrigin:h[r]})})}remove(){this.tooltipElement.remove(),this.autoUpdateCleanup(),this.removeEventListeners()}}const f={mounted(t,{value:e,arg:i}){e&&(typeof e=="string"&&e.trim()===""||(t.tooltip=new E(t,{textContent:String(e),placement:i})))},beforeUnmount(t){t.tooltip&&t.tooltip.remove()}};module.exports=f; |