diff --git a/src/assets/NcAppNavigationItem.scss b/src/assets/NcAppNavigationItem.scss
index 1e596ef645..398487fc91 100644
--- a/src/assets/NcAppNavigationItem.scss
+++ b/src/assets/NcAppNavigationItem.scss
@@ -119,6 +119,7 @@
max-width: 100%;
white-space: nowrap;
text-overflow: ellipsis;
+ font-weight: var(--font-weight-element, normal);
}
.editingContainer {
diff --git a/src/assets/action.scss b/src/assets/action.scss
index 05f00585d3..f0e566198c 100644
--- a/src/assets/action.scss
+++ b/src/assets/action.scss
@@ -54,7 +54,7 @@
background-color: transparent;
box-shadow: none;
- font-weight: normal;
+ font-weight: var(--font-weight-element, normal);
font-size: var(--default-font-size);
line-height: var(--default-clickable-area);
@@ -105,7 +105,7 @@
}
&__name {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
@@ -117,6 +117,7 @@
display: block;
white-space: pre-wrap;
font-size: var(--font-size-small);
+ font-weight: var(--font-weight-default, normal);
line-height: var(--default-line-height);
color: var(--color-text-maxcontrast);
cursor: pointer;
diff --git a/src/components/NcActionInput/NcActionInput.vue b/src/components/NcActionInput/NcActionInput.vue
index f3f321c294..a35577568b 100644
--- a/src/components/NcActionInput/NcActionInput.vue
+++ b/src/components/NcActionInput/NcActionInput.vue
@@ -531,7 +531,7 @@ $input-margin: 4px;
background-color: transparent;
box-shadow: none;
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
&__icon-wrapper {
display: flex;
diff --git a/src/components/NcActionTextEditable/NcActionTextEditable.vue b/src/components/NcActionTextEditable/NcActionTextEditable.vue
index adb7d5eca7..8f01f8822c 100644
--- a/src/components/NcActionTextEditable/NcActionTextEditable.vue
+++ b/src/components/NcActionTextEditable/NcActionTextEditable.vue
@@ -217,7 +217,7 @@ $input-margin: 4px;
background-color: transparent;
box-shadow: none;
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
line-height: var(--default-clickable-area);
& > span {
diff --git a/src/components/NcAppNavigationCaption/NcAppNavigationCaption.vue b/src/components/NcAppNavigationCaption/NcAppNavigationCaption.vue
index 4f3c4a7753..71e9610dcf 100644
--- a/src/components/NcAppNavigationCaption/NcAppNavigationCaption.vue
+++ b/src/components/NcAppNavigationCaption/NcAppNavigationCaption.vue
@@ -266,7 +266,7 @@ export default {
}
&__name {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
color: var(--color-main-text);
font-size: var(--default-font-size);
line-height: var(--default-clickable-area);
diff --git a/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue b/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue
index f7e27f8042..c46267492d 100644
--- a/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue
+++ b/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue
@@ -104,7 +104,7 @@ onClickOutside(container, () => {
padding-inline: 0 calc((var(--default-clickable-area) - 16px) / 2) !important;
:global(.button-vue__text) {
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
}
}
diff --git a/src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue b/src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue
index f560f3be56..9846923d9e 100644
--- a/src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue
+++ b/src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue
@@ -285,7 +285,7 @@ function unregisterSection(id: string) {
margin: 4px 0;
line-height: var(--default-clickable-area);
border-radius: var(--border-radius-element);
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
padding: 0 calc(4 * var(--default-grid-baseline));
cursor: pointer;
white-space: nowrap;
diff --git a/src/components/NcAppSettingsSection/NcAppSettingsSection.vue b/src/components/NcAppSettingsSection/NcAppSettingsSection.vue
index 370d604331..a2b721397e 100644
--- a/src/components/NcAppSettingsSection/NcAppSettingsSection.vue
+++ b/src/components/NcAppSettingsSection/NcAppSettingsSection.vue
@@ -88,7 +88,7 @@ onBeforeUnmount(() => {
padding-inline: var(--app-settings-section-text-offset);
padding-block: 0;
font-size: 20px;
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
}
&__description {
diff --git a/src/components/NcAppSidebar/NcAppSidebar.vue b/src/components/NcAppSidebar/NcAppSidebar.vue
index 096c61bc58..fe041a4d7b 100644
--- a/src/components/NcAppSidebar/NcAppSidebar.vue
+++ b/src/components/NcAppSidebar/NcAppSidebar.vue
@@ -1731,7 +1731,7 @@ $desc-height: $desc-name-height + $desc-subname-height;
margin: 0;
padding: $desc-input-padding;
font-size: 20px;
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
}
}
diff --git a/src/components/NcAppSidebar/NcAppSidebarTabsButton.vue b/src/components/NcAppSidebar/NcAppSidebarTabsButton.vue
index e198779348..3da3adb3d5 100644
--- a/src/components/NcAppSidebar/NcAppSidebarTabsButton.vue
+++ b/src/components/NcAppSidebar/NcAppSidebarTabsButton.vue
@@ -88,14 +88,14 @@ defineProps<{
}
.sidebarTabsButton__name {
- font-weight: normal;
+ font-weight: var(--font-weight-element, normal);
overflow: hidden;
text-overflow: ellipsis;
text-wrap: nowrap;
}
.sidebarTabsButton_selected .sidebarTabsButton__name {
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
}
.sidebarTabsButton__icon {
diff --git a/src/components/NcAssistantButton/NcAssistantButton.vue b/src/components/NcAssistantButton/NcAssistantButton.vue
index 18318bb84e..9cc3c8fbed 100644
--- a/src/components/NcAssistantButton/NcAssistantButton.vue
+++ b/src/components/NcAssistantButton/NcAssistantButton.vue
@@ -76,7 +76,7 @@ export default {
}
h5 {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
margin: 40px 0 20px 0;
}
diff --git a/src/components/NcAvatar/NcAvatar.vue b/src/components/NcAvatar/NcAvatar.vue
index 3eed0c0596..e28a2e169f 100644
--- a/src/components/NcAvatar/NcAvatar.vue
+++ b/src/components/NcAvatar/NcAvatar.vue
@@ -953,7 +953,7 @@ export default {
display: block;
width: 100%;
text-align: center;
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
}
}
diff --git a/src/components/NcBreadcrumb/NcBreadcrumb.vue b/src/components/NcBreadcrumb/NcBreadcrumb.vue
index e65989a7fa..6b8a59f918 100644
--- a/src/components/NcBreadcrumb/NcBreadcrumb.vue
+++ b/src/components/NcBreadcrumb/NcBreadcrumb.vue
@@ -326,7 +326,7 @@ export default {
}
&__text {
- font-weight: normal;
+ font-weight: var(--font-weight-element, normal);
}
}
:deep(.button-vue__text) {
diff --git a/src/components/NcButton/NcButton.vue b/src/components/NcButton/NcButton.vue
index f9a34764ea..f44f18edfa 100644
--- a/src/components/NcButton/NcButton.vue
+++ b/src/components/NcButton/NcButton.vue
@@ -176,7 +176,7 @@ export default {
}
h5 {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
margin: 40px 0 20px 0;
}
@@ -417,7 +417,7 @@ td.row-size {
}
.table-header {
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
color: var(--color-text-maxcontrast);
}
@@ -751,7 +751,7 @@ function onClick(event: MouseEvent) {
transition-timing-function: linear;
cursor: pointer;
font-size: var(--default-font-size);
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
// Setup different button sizes
&--size-small {
@@ -847,7 +847,7 @@ function onClick(event: MouseEvent) {
}
&__text {
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
margin-bottom: 1px;
padding: 2px 0;
white-space: nowrap;
diff --git a/src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue b/src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue
index 0c3dce1433..9b91ef814d 100644
--- a/src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue
+++ b/src/components/NcCheckboxRadioSwitch/NcCheckboxContent.vue
@@ -264,6 +264,7 @@ export default {
&__description {
display: block;
color: var(--color-text-maxcontrast);
+ font-weight: var(--font-weight-default, normal);
}
&--button-variant {
diff --git a/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue b/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue
index 6f00fa023d..07b688ed7b 100644
--- a/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue
+++ b/src/components/NcCheckboxRadioSwitch/NcCheckboxRadioSwitch.vue
@@ -712,6 +712,7 @@ export default {
color: var(--color-main-text);
background-color: transparent;
font-size: var(--default-font-size);
+ font-weight: var(--font-weight-element, normal);
line-height: var(--default-line-height);
padding: 0;
position: relative;
@@ -774,7 +775,7 @@ export default {
overflow: hidden;
&--checked {
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
.checkbox-radio-switch__content {
background-color: var(--color-primary-element);
diff --git a/src/components/NcColorPicker/NcColorPicker.vue b/src/components/NcColorPicker/NcColorPicker.vue
index 31fd10ab76..f61dc456da 100644
--- a/src/components/NcColorPicker/NcColorPicker.vue
+++ b/src/components/NcColorPicker/NcColorPicker.vue
@@ -587,7 +587,7 @@ function hexToRGB(hex: string): [number, number, number] {
font-family: var(--font-face);
font-size: var(--font-size-small, 13px);
line-height: 1.5;
- font-weight: 500;
+ font-weight: var(--font-weight-element, 500);
color: var(--color-text-maxcontrast);
background-color: var(--color-main-background);
pointer-events: none;
diff --git a/src/components/NcContent/NcContent.vue b/src/components/NcContent/NcContent.vue
index 82603345fb..5c15fb0943 100644
--- a/src/components/NcContent/NcContent.vue
+++ b/src/components/NcContent/NcContent.vue
@@ -201,7 +201,7 @@ function setAppNavigation(value: boolean): void {
}
&__headline {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
font-size: 20px;
line-height: 30px;
margin-bottom: 12px;
diff --git a/src/components/NcDateTime/NcDateTime.vue b/src/components/NcDateTime/NcDateTime.vue
index 52dfa88cc1..d85409017e 100644
--- a/src/components/NcDateTime/NcDateTime.vue
+++ b/src/components/NcDateTime/NcDateTime.vue
@@ -82,7 +82,7 @@ It is also possible to disable relative time by setting the `relativeTime` prope
diff --git a/src/components/NcEmptyContent/NcEmptyContent.vue b/src/components/NcEmptyContent/NcEmptyContent.vue
index ee82f7619b..e8c3f50561 100644
--- a/src/components/NcEmptyContent/NcEmptyContent.vue
+++ b/src/components/NcEmptyContent/NcEmptyContent.vue
@@ -230,7 +230,7 @@ const nameId = createElementId()
&__name {
margin-bottom: 10px;
text-align: center;
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
font-size: 20px;
line-height: 30px;
}
diff --git a/src/components/NcFormBox/NcFormBoxItem.vue b/src/components/NcFormBox/NcFormBoxItem.vue
index 4c6656efde..2d985800e7 100644
--- a/src/components/NcFormBox/NcFormBoxItem.vue
+++ b/src/components/NcFormBox/NcFormBoxItem.vue
@@ -117,6 +117,7 @@ const hasDescription = () => !!description || !!slots.description
border-radius: var(--border-radius-element);
background-color: var(--color-primary-element-extra-light);
color: var(--color-main-text);
+ font-weight: var(--font-weight-element, normal);
transition-property: color, border-color, background-color;
transition-duration: var(--animation-quick);
transition-timing-function: linear;
@@ -143,6 +144,10 @@ const hasDescription = () => !!description || !!slots.description
box-shadow: 0 0 0 4px var(--color-main-background);
}
+ &__description {
+ font-weight: var(--font-weight-default, normal);
+ }
+
&.formBoxItem_legacy {
--nc-form-box-item-border-width: 0px;
border: none;
diff --git a/src/components/NcFormGroup/NcFormGroup.vue b/src/components/NcFormGroup/NcFormGroup.vue
index f160f9d6d9..63420ea9da 100644
--- a/src/components/NcFormGroup/NcFormGroup.vue
+++ b/src/components/NcFormGroup/NcFormGroup.vue
@@ -93,7 +93,7 @@ const hasContentOnly = () => hideLabel && (!hasDescription() || hideDescription)
.formGroup__label {
padding-inline: var(--form-element-label-offset);
font-size: var(--font-size);
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
}
.formGroup__description {
diff --git a/src/components/NcHotkeyList/NcHotkeyList.vue b/src/components/NcHotkeyList/NcHotkeyList.vue
index e66efd3c7b..a832760c00 100644
--- a/src/components/NcHotkeyList/NcHotkeyList.vue
+++ b/src/components/NcHotkeyList/NcHotkeyList.vue
@@ -45,7 +45,7 @@ const labelId = `NcHotkeyList_${createElementId()}`
}
.hotkeyList__heading {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
margin-inline: var(--form-element-label-offset);
}
diff --git a/src/components/NcInputField/NcInputField.vue b/src/components/NcInputField/NcInputField.vue
index d5860648b6..4c86a037b8 100644
--- a/src/components/NcInputField/NcInputField.vue
+++ b/src/components/NcInputField/NcInputField.vue
@@ -444,7 +444,7 @@ function handleInput(event: Event) {
line-height: 1.5; // minimum allowed line height for accessibility
// 1.5 * font-size = line-height; line-height / 2 for centering and make it negative as we need to move outside the element
inset-block-start: calc(-1.5 * var(--input-label-font-size) / 2);
- font-weight: 500;
+ font-weight: var(--font-weight-element, 500);
border-radius: var(--default-grid-baseline) var(--default-grid-baseline) 0 0;
background-color: var(--color-main-background);
padding-inline: var(--default-grid-baseline);
diff --git a/src/components/NcKbd/NcKbd.vue b/src/components/NcKbd/NcKbd.vue
index 66b7272580..f7782744f9 100644
--- a/src/components/NcKbd/NcKbd.vue
+++ b/src/components/NcKbd/NcKbd.vue
@@ -215,7 +215,7 @@ OS detection is automatic but can be overridden via the `mac` prop.
border-block-end: 2px solid var(--color-border);
th {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
}
}
}
diff --git a/src/components/NcListItem/NcListItem.vue b/src/components/NcListItem/NcListItem.vue
index baeb75e509..3ef88f1df9 100644
--- a/src/components/NcListItem/NcListItem.vue
+++ b/src/components/NcListItem/NcListItem.vue
@@ -887,7 +887,7 @@ export default {
.list-item-content__name {
min-width: 100px;
flex: 1 1 10%;
- font-weight: 500;
+ font-weight: var(--font-weight-element, 500);
}
.list-item-content__subname {
@@ -895,7 +895,7 @@ export default {
min-width: 0;
color: var(--color-text-maxcontrast);
&--bold {
- font-weight: 500;
+ font-weight: var(--font-weight-element, 500);
}
}
@@ -1017,7 +1017,7 @@ export default {
&__details {
color: var(--color-text-maxcontrast);
margin: 0 9px !important;
- font-weight: normal;
+ font-weight: var(--font-weight-default, normal);
}
&__extra {
margin: 2px 4px 0 4px;
diff --git a/src/components/NcModal/NcModal.vue b/src/components/NcModal/NcModal.vue
index 3d600ca761..30bafb5d5a 100644
--- a/src/components/NcModal/NcModal.vue
+++ b/src/components/NcModal/NcModal.vue
@@ -996,7 +996,7 @@ export default {
.model__content-text {
font-size: 16px;
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
}
```
diff --git a/src/components/NcNoteCard/NcNoteCard.vue b/src/components/NcNoteCard/NcNoteCard.vue
index c677b9ddb2..24a7a8a259 100644
--- a/src/components/NcNoteCard/NcNoteCard.vue
+++ b/src/components/NcNoteCard/NcNoteCard.vue
@@ -163,7 +163,7 @@ const iconPath = computed(() => {
&__heading {
font-size: var(--note-card-icon-size); // Same as icon
- font-weight: 600;
+ font-weight: var(--font-weight-heading, 600);
}
&__icon {
diff --git a/src/components/NcRadioGroupButton/NcRadioGroupButton.vue b/src/components/NcRadioGroupButton/NcRadioGroupButton.vue
index d049411d73..7c4c83bfed 100644
--- a/src/components/NcRadioGroupButton/NcRadioGroupButton.vue
+++ b/src/components/NcRadioGroupButton/NcRadioGroupButton.vue
@@ -143,7 +143,7 @@ function onUpdate() {
}
.radioGroupButton__label {
- font-weight: bold;
+ font-weight: var(--font-weight-element, bold);
}
.radioGroupButton_disabled {
diff --git a/src/components/NcRelatedResourcesPanel/NcRelatedResourcesPanel.vue b/src/components/NcRelatedResourcesPanel/NcRelatedResourcesPanel.vue
index 64f34c1da5..49d6bef762 100644
--- a/src/components/NcRelatedResourcesPanel/NcRelatedResourcesPanel.vue
+++ b/src/components/NcRelatedResourcesPanel/NcRelatedResourcesPanel.vue
@@ -261,7 +261,7 @@ export default {
&__header {
h5 {
- font-weight: bold;
+ font-weight: var(--font-weight-heading, bold);
margin-bottom: 6px;
}
diff --git a/src/components/NcRelatedResourcesPanel/NcResource.vue b/src/components/NcRelatedResourcesPanel/NcResource.vue
index bbc29608e4..c192bdaddf 100644
--- a/src/components/NcRelatedResourcesPanel/NcResource.vue
+++ b/src/components/NcRelatedResourcesPanel/NcResource.vue
@@ -85,7 +85,7 @@ export default {
justify-content: flex-start !important;
.button-vue__text {
- font-weight: normal !important;
+ font-weight: var(--font-weight-default, normal) !important;
margin-inline-start: 2px !important;
}
}
diff --git a/src/components/NcRelatedResourcesPanel/NcTeamResources.vue b/src/components/NcRelatedResourcesPanel/NcTeamResources.vue
index 3255829bdc..7fe57e6edf 100644
--- a/src/components/NcRelatedResourcesPanel/NcTeamResources.vue
+++ b/src/components/NcRelatedResourcesPanel/NcTeamResources.vue
@@ -201,7 +201,7 @@ export default {