0
0
mirror of https://github.com/wagtail/wagtail.git synced 2024-11-29 09:33:54 +01:00
wagtail/client/scss/components/_indicator.scss
Vaibhav Shukla 66d9463d5c show different locked indicator for locked by current user
- ensure it works for colour contrast, windows high contrast mode and non-colour only visible change
- only show the change if page is locked by the current owner
- added assert check for the locked-indicator-owner in  test
- adopt new icons for privacy indicator also
- ensure the icons show correctly for high contrast mode
2022-09-06 10:20:20 +10:00

47 lines
801 B
SCSS

.privacy-indicator {
.label-private,
.label-public {
&:before {
font-size: 1.5em;
}
}
&.public {
.label-private {
display: none;
}
}
&.private {
.label-public {
display: none;
}
}
}
.indicator {
font-size: 1em;
margin-inline-end: 0;
opacity: theme('opacity.70');
.icon {
border: 1px solid transparent;
border-radius: 50%;
font-size: 1.25em;
padding: 2px;
vertical-align: middle; // reset vertical-align set by icon.initial
@media (forced-colors: active) {
background-color: ButtonText;
}
}
&.indicator--is-inverse {
.icon {
border-color: $color-white; // ensure border is available for high contrast mode
background-color: $color-grey-1;
color: $color-white;
}
}
}