Back to marketplace
115

Clean Theme

Clean theme for Humhub based on the Community theme

Clean theme for Humhub based on the Community theme.

Overview

  • Modern, smooth and uncluttered theme
  • Variants: Contrasted and Bordered
  • On large screens: the 2 top menu bars of the default theme are merged
  • On small screens:
    • the second menu becomes a bottom menu bar
    • on scrolling down, the top and bottom menus are hidden
  • The left menu is sticky when scrolling vertically
  • The top right icon becomes active when it's the URL of the current page.
  • Adds the profile's header in the user's account pages
  • Compatible with the Dark Mode module
  • Possibility to collapse the left navigation menu (in a space, profile, account and admin menu) with the collapsibleLeftNavigation property (see the documentation).
  • You can create a child theme to customize colors, fonts, etc. (see instructions below) or use the Theme Builder module (works only on the clean-base theme).

Configuration

  1. Administration -> Modules: install and activate the module
  2. Administration -> Settings -> Appearance: select the theme
  3. Advanced configuration: See available public properties in the Module.php file and the Module configuration documentation

Pricing

This module is free, but is the result of a lot of work for the design and maintenance over time.

If it's useful to you, please consider making a donation or participating in the code. Thanks!

Child themes

To customize colors, fonts, etc., create a child theme (don't forget to copy img and ico folders).

See documentation here.

You can start with this empty template which is a child theme of the "contrasted" theme.

Simply unzip it in the /themes root folder (not in protected or the module).

Add you custom styles in less/theme.less and colors in less/variables.less (see available variables here) and build the CSS: cd less; lessc ./build.less ../css/theme.css --clean-css="--s1 --advanced" --source-map=../css/theme.css.map

Advanced

Import the less files in less/build.less (see example in themes/clean-contrasted) and specify the parent theme as explained here defining the variable @baseTheme: "clean-base"; in the less/variables.less (1).

And then overwrite the variable values using the variables names mentioned here.

You can load new fonts by downloading the via this Google webfonts helper site.

(1) This will allow the child theme to use view pages of clean-base (you also can use a sub-theme such as clean-contrasted as a parent theme). If you change the parent theme, flushing cache has no effect, you need to switch to another theme and switch back to your child theme.

Repository

https://github.com/cuzy-app/humhub-modules-clean-theme

Publisher

CUZY.APP

Licence

GNU AGPL

Module Information

Price:
Free
Latest version release:
1.7.3 - March 27, 2024
Publisher:
Author(s):
Website:
Compatibility:
HumHub 1.15 - Latest