diff options
Diffstat (limited to 'apps/theming')
| -rw-r--r-- | apps/theming/css/default.css | 7 | ||||
| -rw-r--r-- | apps/theming/lib/Themes/DefaultTheme.php | 9 | ||||
| -rw-r--r-- | apps/theming/lib/Themes/HighContrastTheme.php | 3 | ||||
| -rw-r--r-- | apps/theming/src/components/BackgroundSettings.vue | 2 | ||||
| -rw-r--r-- | apps/theming/src/components/UserPrimaryColor.vue | 2 | ||||
| -rw-r--r-- | apps/theming/src/components/admin/FileInputField.vue | 2 | ||||
| -rw-r--r-- | apps/theming/tests/Migration/Version2006Date20240905111627Test.php | 2 |
7 files changed, 22 insertions, 5 deletions
diff --git a/apps/theming/css/default.css b/apps/theming/css/default.css index ad5b27530c3..6a6628f074a 100644 --- a/apps/theming/css/default.css +++ b/apps/theming/css/default.css @@ -74,8 +74,15 @@ --clickable-area-large: 48px; --clickable-area-small: 24px; --default-grid-baseline: 4px; + --header-height: 50px; --header-menu-item-height: 44px; + /* An alpha mask to be applied to all icons on the navigation bar (header menu). + * Icons are have a size of 20px but usually we use MDI which have a content of 16px so 2px padding top bottom, + * for better gradient we set those 2px (10% of height) as start and stop positions, this is also somewhat size agnostic as we only depend on the percentage. + */ + --header-menu-icon-mask: linear-gradient(var(--color-background-plain-text) 10%, color-mix(in srgb, var(--color-background-plain-text), 25% transparent) 90%) alpha; + --navigation-width: 300px; --sidebar-min-width: 300px; --sidebar-max-width: 500px; diff --git a/apps/theming/lib/Themes/DefaultTheme.php b/apps/theming/lib/Themes/DefaultTheme.php index 1a301eb9820..7d06926c52f 100644 --- a/apps/theming/lib/Themes/DefaultTheme.php +++ b/apps/theming/lib/Themes/DefaultTheme.php @@ -191,9 +191,16 @@ class DefaultTheme implements ITheme { '--default-grid-baseline' => '4px', - // various structure data + // header / navigation bar '--header-height' => '50px', '--header-menu-item-height' => '44px', + /* An alpha mask to be applied to all icons on the navigation bar (header menu). + * Icons are have a size of 20px but usually we use MDI which have a content of 16px so 2px padding top bottom, + * for better gradient we set those 2px (10% of height) as start and stop positions, this is also somewhat size agnostic as we only depend on the percentage. + */ + '--header-menu-icon-mask' => 'linear-gradient(var(--color-background-plain-text) 10%, color-mix(in srgb, var(--color-background-plain-text), 25% transparent) 90%) alpha', + + // various structure data '--navigation-width' => '300px', '--sidebar-min-width' => '300px', '--sidebar-max-width' => '500px', diff --git a/apps/theming/lib/Themes/HighContrastTheme.php b/apps/theming/lib/Themes/HighContrastTheme.php index 1d20ae251df..5b51114a32f 100644 --- a/apps/theming/lib/Themes/HighContrastTheme.php +++ b/apps/theming/lib/Themes/HighContrastTheme.php @@ -106,6 +106,9 @@ class HighContrastTheme extends DefaultTheme implements ITheme { '--color-border' => $this->util->darken($colorMainBackground, 50), '--color-border-dark' => $this->util->darken($colorMainBackground, 50), '--color-border-maxcontrast' => $this->util->darken($colorMainBackground, 56), + + // remove the gradient from the app icons + '--header-menu-icon-mask' => 'none', ] ); } diff --git a/apps/theming/src/components/BackgroundSettings.vue b/apps/theming/src/components/BackgroundSettings.vue index ce4489138ff..58b76dd9602 100644 --- a/apps/theming/src/components/BackgroundSettings.vue +++ b/apps/theming/src/components/BackgroundSettings.vue @@ -87,7 +87,7 @@ import NcColorPicker from '@nextcloud/vue/components/NcColorPicker' import Check from 'vue-material-design-icons/Check.vue' import ImageEdit from 'vue-material-design-icons/ImageEdit.vue' -import ColorPalette from 'vue-material-design-icons/Palette.vue' +import ColorPalette from 'vue-material-design-icons/PaletteOutline.vue' const shippedBackgroundList = loadState('theming', 'shippedBackgrounds') const backgroundImage = loadState('theming', 'userBackgroundImage') diff --git a/apps/theming/src/components/UserPrimaryColor.vue b/apps/theming/src/components/UserPrimaryColor.vue index 462ce43e997..f10b8a01825 100644 --- a/apps/theming/src/components/UserPrimaryColor.vue +++ b/apps/theming/src/components/UserPrimaryColor.vue @@ -38,7 +38,7 @@ import debounce from 'debounce' import NcButton from '@nextcloud/vue/components/NcButton' import NcColorPicker from '@nextcloud/vue/components/NcColorPicker' import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon' -import IconColorPalette from 'vue-material-design-icons/Palette.vue' +import IconColorPalette from 'vue-material-design-icons/PaletteOutline.vue' import IconUndo from 'vue-material-design-icons/UndoVariant.vue' const { primaryColor, defaultPrimaryColor } = loadState('theming', 'data', { primaryColor: '#0082c9', defaultPrimaryColor: '#0082c9' }) diff --git a/apps/theming/src/components/admin/FileInputField.vue b/apps/theming/src/components/admin/FileInputField.vue index 698bc53c402..d5e0052f5bd 100644 --- a/apps/theming/src/components/admin/FileInputField.vue +++ b/apps/theming/src/components/admin/FileInputField.vue @@ -68,7 +68,7 @@ import { loadState } from '@nextcloud/initial-state' import NcButton from '@nextcloud/vue/components/NcButton' import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon' import NcNoteCard from '@nextcloud/vue/components/NcNoteCard' -import Delete from 'vue-material-design-icons/Delete.vue' +import Delete from 'vue-material-design-icons/DeleteOutline.vue' import Undo from 'vue-material-design-icons/UndoVariant.vue' import Upload from 'vue-material-design-icons/Upload.vue' diff --git a/apps/theming/tests/Migration/Version2006Date20240905111627Test.php b/apps/theming/tests/Migration/Version2006Date20240905111627Test.php index c4bcb75b364..5f7458db11a 100644 --- a/apps/theming/tests/Migration/Version2006Date20240905111627Test.php +++ b/apps/theming/tests/Migration/Version2006Date20240905111627Test.php @@ -9,9 +9,9 @@ declare(strict_types=1); namespace OCA\Theming\Tests\Migration; -use NCU\Config\IUserConfig; use OCA\Theming\Migration\Version2006Date20240905111627; use OCP\BackgroundJob\IJobList; +use OCP\Config\IUserConfig; use OCP\IAppConfig; use OCP\IDBConnection; use OCP\IUserManager; |