mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
Fix Loopback Styling
This commit is contained in:
parent
c6118e8898
commit
a1971f6830
@ -17,6 +17,7 @@ const LoopbackButton = () => {
|
||||
<IAIIconButton
|
||||
aria-label="Toggle Loopback"
|
||||
tooltip="Toggle Loopback"
|
||||
styleClass="loopback-btn"
|
||||
asCheckbox={true}
|
||||
isChecked={shouldLoopback}
|
||||
icon={<FaRecycle />}
|
||||
|
@ -26,3 +26,34 @@
|
||||
// $btn-width: 3rem
|
||||
);
|
||||
}
|
||||
|
||||
.loopback-btn {
|
||||
&[data-as-checkbox='true'] {
|
||||
background-color: var(--btn-grey);
|
||||
border: 3px solid var(--btn-grey);
|
||||
svg {
|
||||
fill: var(--text-color);
|
||||
}
|
||||
&:hover {
|
||||
background-color: var(--btn-grey);
|
||||
border-color: var(--btn-checkbox-border-hover);
|
||||
svg {
|
||||
fill: var(--text-color);
|
||||
}
|
||||
}
|
||||
&[data-selected='true'] {
|
||||
border-color: var(--accent-color);
|
||||
background-color: var(--btn-grey);
|
||||
svg {
|
||||
fill: var(--text-color);
|
||||
}
|
||||
&:hover {
|
||||
border-color: var(--accent-color);
|
||||
background-color: var(--btn-grey);
|
||||
svg {
|
||||
fill: var(--text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user