You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
84 lines
1.7 KiB
84 lines
1.7 KiB
.icon-button {
|
|
flex: 0 0 auto;
|
|
padding: 12px;
|
|
overflow: visible;
|
|
font-size: 1.5rem;
|
|
text-align: center;
|
|
transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
border-radius: 50%;
|
|
color: var(--palette-action-default);
|
|
|
|
&.button {
|
|
min-width: unset;
|
|
border-radius: var(--default-borderradius);
|
|
}
|
|
|
|
&:hover, &:focus-visible {
|
|
background-color: var(--palette-action-default-hover);
|
|
}
|
|
|
|
&:disabled {
|
|
color: var(--palette-action-disabled);
|
|
background-color: transparent;
|
|
}
|
|
|
|
&.readonly, .readonly:hover {
|
|
cursor: default;
|
|
}
|
|
}
|
|
|
|
.icon-button-color-inherit {
|
|
color: inherit;
|
|
|
|
&:hover, &:focus-visible {
|
|
background-color: var(--palette-action-default-hover);
|
|
}
|
|
}
|
|
|
|
.icon-button-label {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: inherit;
|
|
justify-content: inherit;
|
|
}
|
|
|
|
.icon-button-edge-start {
|
|
margin-left: -12px;
|
|
margin-inline-start: -12px;
|
|
margin-inline-end: unset;
|
|
}
|
|
|
|
.icon-button-edge-end {
|
|
margin-right: -12px;
|
|
margin-inline-end: -12px;
|
|
margin-inline-start: unset;
|
|
}
|
|
|
|
.icon-button-edge-margin-end {
|
|
margin-right: 8px;
|
|
margin-inline-end: 8px;
|
|
margin-inline-start: unset;
|
|
}
|
|
|
|
.icon-button-size-small {
|
|
padding: 3px;
|
|
font-size: 1.125rem;
|
|
|
|
&.icon-button-edge-start {
|
|
margin-left: -3px;
|
|
margin-inline-start: -3px;
|
|
margin-inline-end: unset;
|
|
}
|
|
|
|
&.icon-button-edge-end {
|
|
margin-right: -3px;
|
|
margin-inline-end: -3px;
|
|
margin-inline-start: unset;
|
|
}
|
|
}
|
|
|
|
|
|
.icon-button-size-large.button > .icon-button-label > .icon-size-large {
|
|
font-size: 2rem;
|
|
}
|