Page Menu
Home
WickedGov Phorge
Search
Configure Global Search
Log In
Files
F4094932
CdxChipInput-rtl.css
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Flag For Later
Award Token
Size
9 KB
Referenced Files
None
Subscribers
None
CdxChipInput-rtl.css
View Options
.
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
:
4
px
;
box-sizing
:
border-box
;
max-width
:
100
%
;
border
:
1
px
solid
var
(
--border-color-interactive
,
#72777d
);
border-radius
:
9999
px
;
padding
:
0
8
px
0
0
;
font-size
:
.875
rem
;
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
:
.25
s
}.
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
:
1
px
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
1
px
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
:
20
px
;
min-height
:
20
px
;
margin-left
:
1
px
;
border-radius
:
9999
px
;
padding-left
:
2
px
;
padding-right
:
2
px
;
font-size
:
.75
rem
}.
cdx-chip-input
{
border-radius
:
2
px
;
overflow
:
hidden
}.
cdx-chip-input__chips
,
.
cdx-chip-input__separate-input
{
box-sizing
:
border-box
;
min-width
:
256
px
;
min-height
:
32
px
;
border-width
:
1
px
;
border-style
:
solid
;
padding
:
3
px
8
px
;
line-height
:
1.4285714
}.
cdx-chip-input__chips
{
display
:
flex
;
flex
:
1
auto
;
flex-flow
:
wrap
;
gap
:
8
px
}.
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
:
1
px
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
:
-1
px
}.
cdx-chip-input--has-separate-input
.
cdx-chip-input__input
{
width
:
100
%
}.
cdx-chip-input__aria-status
{
display
:
block
;
clip
:
rect
(
1
px
,
1
px
,
1
px
,
1
px
);
position
:
absolute
!important
;
width
:
1
px
;
height
:
1
px
;
margin
:
-1
px
;
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
1
px
var
(
--box-shadow-color-transparent
,
transparent
);
transition-property
:
background-color
,
color
,
border-color
,
box-shadow
;
transition-duration
:
.25
s
}.
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
1
px
var
(
--box-shadow-color-progressive--focus
,
#36c
);
outline
:
1
px
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
1
px
var
(
--box-shadow-color-progressive--focus
,
#36c
);
outline
:
1
px
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
)}
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Tue, Aug 18, 13:34 (4 w, 1 d ago)
Storage Engine
local-disk
Storage Format
Raw Data
Storage Handle
30/5f/3d2f8a4edf08b939da9743ee8e67
Default Alt Text
CdxChipInput-rtl.css (9 KB)
Attached To
Mode
rMWPROD MediaWiki Production
Attached
Detach File
Event Timeline
Log In to Comment