Merge pull request #4453 from nextcloud-libraries/fix/nc-checkbox-rad…

…io-switch-empty-text
nextcloud-libraries · Aug 24, 2023 · 772f485 · 772f485
2 parents 51fa1c0 + 9caab51
commit 772f485
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue b/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue
@@ -604,6 +604,11 @@ export default {
 		&, * {
 			cursor: pointer;
 		}
+
+		&-text:empty {
+			// hide text if empty to ensure checkbox outline is a circle instead of oval
+			display: none;
+		}
 	}
 
 	&__icon > * {
@@ -629,6 +634,12 @@ export default {
 		background-color: var(--color-primary-element-light-hover);
 	}
 
+	&-checkbox, &-switch {
+		.checkbox-radio-switch__label {
+			padding: 4px 10px; // we use 24x24px sized MDI icons for checkbox and radiobutton -> (44px - 24 px) / 2 = 10px
+		}
+	}
+
 	// Switch specific rules
 	&-switch:not(&--checked) &__icon > * {
 		color: var(--color-text-maxcontrast);