settings: Fix disabled look for group settings pills UI.

We now have a grey-ish background color for the pill container
with opacity also reduced like we do for the disabled select
elements in settings.

Needed to adjust the selectors so that the CSS for disabled
state correctly overrides the CSS for enabled state.
This commit is contained in:
Sahil Batra 2024-10-31 09:26:53 +05:30 committed by Tim Abbott
parent 9a6ef9db93
commit aed8ac9672
1 changed files with 24 additions and 18 deletions

View File

@ -696,28 +696,34 @@ h4.user_group_setting_subsection_title {
}
}
.group_setting_disabled {
cursor: not-allowed;
/* This ensures that we do not see the not allowed cursor in the
extra space of a div */
width: fit-content;
/* This specific rules are needed to override the default settings
of these elements */
.pill-container,
.group-setting-label {
.org-permissions-form,
.group-permissions {
.group_setting_disabled {
cursor: not-allowed;
}
/* This ensures that we do not see the not allowed cursor in the
extra space of a div */
width: fit-content;
.pill-container {
.pill {
.exit {
display: none;
}
/* This specific rules are needed to override the default settings
of these elements */
.pill-container,
.group-setting-label {
cursor: not-allowed;
}
.input {
pointer-events: none;
.pill-container {
background-color: hsl(0deg 0% 93%);
opacity: 0.7;
.pill {
.exit {
display: none;
}
}
.input {
pointer-events: none;
}
}
}
}