[GUIDE] Change OMV look ;)

sbocquet · Aug 7th 2020

Hi,

For those who want to have fun...

- Connect via SSH to your server...

Code

cd /var/www/openmediavault/css
cp defaults.scss defaults.sav
vi defaults.scss

- Modify those line with what colors you want:

Code

$omv-color-more-lighter: #404040;
$omv-color-lighter: #303030;
$omv-color-default: #202020;
$omv-color-darker: #101010;
$omv-color-more-darker: #000000;

Save and exit.

- Compile the new CSS file:

Code

root@home-server:/var/www/openmediavault/css# apt install sassc
Reading package lists... Done
Building dependency tree
Reading state information... Done
The following additional packages will be installed:
libsass1
The following NEW packages will be installed:
libsass1 sassc
0 upgraded, 2 newly installed, 0 to remove and 0 not upgraded.
Need to get 785 kB of archives.
After this operation, 2,832 kB of additional disk space will be used.
Do you want to continue? [Y/n] Y
Get:1 http://deb.debian.org/debian buster/main amd64 libsass1 amd64 3.5.5-4 [772 kB]
Get:2 http://deb.debian.org/debian buster/main amd64 sassc amd64 3.5.0-1 [12.7 kB]
Fetched 785 kB in 0s (4,902 kB/s)
Selecting previously unselected package libsass1:amd64.
(Reading database ... 63357 files and directories currently installed.)
Preparing to unpack .../libsass1_3.5.5-4_amd64.deb ...
Unpacking libsass1:amd64 (3.5.5-4) ...
Selecting previously unselected package sassc.
Preparing to unpack .../sassc_3.5.0-1_amd64.deb ...
Unpacking sassc (3.5.0-1) ...
Setting up libsass1:amd64 (3.5.5-4) ...
Setting up sassc (3.5.0-1) ...
Processing triggers for man-db (2.8.5-2) ...
Processing triggers for libc-bin (2.28-10) ...

root@home-server:/var/www/openmediavault/css# make all; chown openmediavault-webgui:openmediavault-webgui *; chmod 664 *;
rm -f theme-all-rtl.min.css theme-all.min.css theme-triton.min.css theme-all-rtl.min.css.map theme-all.min.css.map theme-triton.min.css.map
sassc -t compressed --sourcemap theme-all-rtl.scss theme-all-rtl.min.css
sassc -t compressed --sourcemap theme-all.scss theme-all.min.css
sassc -t compressed --sourcemap theme-triton.scss theme-triton.min.css

Display More

- Refresh your web browser with CTRL+F5 and enjoy

Note : This have to be done after each OMV update... or maybe you can use the theme-custom.css file possibility to override the default CSS?

ryecoaaron · Aug 7th 2020

Have you seen this plugin? I'm not sure what it's state is with OMV 5.x though.

OMV-Theme plugin, theme changer and UI customisation

macom · Aug 7th 2020

Quote from sbocquet

or maybe you can use the theme-custom.css

Looks great. Maybe you can post a theme-custom file like here

[CSS] Black OMV v4.x GUI

sbocquet · Aug 8th 2020

I will have a look at both next week

Agricola · Aug 10th 2020

Quote from sbocquet

you can use the theme-custom.css file possibility to override the default CSS?

This is what I have done and it persists through the updates.

This post has similar customizing information with some links.

[GUIDE] Change OMV look ;)

Participate now!

Similar Threads

Newbie question on backing up boot device

[Thoughts] OMV 5.x Plugin Ecosystem

How do I unreference a shared folder that isn't registering as not registered?

Denied Credential Access

Email notifications stop working

Tags