diff --git a/src/Umbraco.Web.UI.Client/src/packages/users/user-groups/workspace/components/user-group-default-permission-list.element.ts b/src/Umbraco.Web.UI.Client/src/packages/users/user-groups/workspace/components/user-group-default-permission-list.element.ts
index 0a0c09d09e..51738c068b 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/users/user-groups/workspace/components/user-group-default-permission-list.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/users/user-groups/workspace/components/user-group-default-permission-list.element.ts
@@ -45,20 +45,40 @@ export class UmbUserGroupDefaultPermissionListElement extends UmbLitElement {
}
#renderPermission(userPermissionManifest: ManifestUserPermission) {
- return html`
+ return html`
- this.#onChangeUserPermission(event, userPermissionManifest)}>
-
-
${userPermissionManifest.meta.label}
- ${userPermissionManifest.meta.description}
-
+ @change=${(event: UUIBooleanInputEvent) => this.#onChangeUserPermission(event, userPermissionManifest)}>
+
+
`;
}
- static styles = [UmbTextStyles, css``];
+ static styles = [
+ UmbTextStyles,
+ css`
+ .permission-toggle {
+ display: flex;
+ align-items: center;
+ border-bottom: 1px solid var(--uui-color-divider);
+ padding: var(--uui-size-space-3) 0 var(--uui-size-space-4) 0;
+ }
+
+ .permission-meta {
+ margin-left: var(--uui-size-space-4);
+ line-height: 1.2em;
+ }
+
+ .permission-name {
+ font-weight: bold;
+ }
+ `,
+ ];
}
export default UmbUserGroupDefaultPermissionListElement;