overleaf-cep/services/web/frontend/stylesheets/bootstrap-5/components/radio-chip.scss
M Fahru b4051e48d3 Merge pull request #23305 from overleaf/mf-onboarding-data-collection-bs5
[web] Migrate onboarding collection data page to bootstrap 5

GitOrigin-RevId: ebf91db34ff11313c262bf57ad45e70d30857cd6
2025-02-13 09:05:58 +00:00

56 lines
1 KiB
SCSS

.radio-chip {
background: #fff;
border: 1px solid var(--neutral-60);
border-radius: var(--border-radius-full);
color: var(--neutral-90);
cursor: pointer;
display: inline-flex;
font-weight: 400;
gap: var(--spacing-02);
inline-size: fit-content;
line-height: 1.4;
padding: var(--spacing-04) var(--spacing-06) var(--spacing-04)
var(--spacing-04);
@include media-breakpoint-down(md) {
width: 100%;
}
&:hover {
background: var(--neutral-20);
}
&:focus-within {
box-shadow: 0 0 0 2px var(--blue-30);
}
input[type='radio'] {
accent-color: var(--green-50);
cursor: pointer;
height: 16px;
margin: var(--spacing-02);
width: 15px;
}
}
.radio-chip[data-disabled='true'] {
border-color: var(--neutral-20);
&:hover {
background: #fff;
cursor: not-allowed;
}
}
.radio-group {
display: flex;
flex-flow: column wrap;
grid-gap: var(--spacing-06);
height: 180px;
width: 100%;
@include media-breakpoint-down(md) {
flex-wrap: nowrap;
height: 100%;
}
}