Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update theming docs #481

Merged
merged 1 commit into from
May 23, 2017
Merged

Update theming docs #481

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions admin_manual/release_notes.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,11 @@ automatically. This could have multiple reasons: either you disabled the
appstore with the config.php flag or your server could not reach the app store.
The instance will work fine, but the features that are usually provided by this
app are not available.

Theming changes
===============

With Nextcloud 12, CSS files have been merged into one server.css so in order
to keep your theme working you should consolidate your existing css styles into
a server.css file. As for the example theme the styles.css file has been
renamed to server.css.
42 changes: 35 additions & 7 deletions developer_manual/core/theming.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,8 @@
Theming Nextcloud
=================
Themes can be used to customize the look and feel of Nextcloud.
Themes can relate to the following topics of Nextcloud:

* Theming the web-frontend
* Theming the desktop client

This documentation contains only the Web-frontend adaptations so far.

.. note:: This is an advanced way of theming Nextcloud; the Nextcloud team recommends instead the use of the **Theming** app which, when enabled, can be accessed from the Admin settings.
.. note:: This is an advanced way of theming Nextcloud; the Nextcloud team recommends instead the use of the `theming app <../../admin_manual/configuration_server/theming.html>` which, when enabled, can be accessed from the Admin settings.

Getting started
===============
Expand Down Expand Up @@ -117,6 +111,31 @@ To customize favicon for MyTheme:

Changing the default colours
----------------------------

You can inject custom variables into the SCSS generator to apply colors to the default css code by adding the following method to defaults.php:

.. code-clock:: php

public function getScssVariables() {
return [
'color-primary' => '#745bca'
];
}


The following variables can be overwritten:

* color-main-text
* color-main-background
* color-primary
* color-primary-text
* color-error
* color-warning
* color-success
* color-loading
* color-loading-dark
* color-box-shadow

With a web-developer tool like Mozilla-Inspector, you also get easily displayed the color of the background you clicked on.
On the top of the login page you can see a case- distinguished setting for different browsers:

Expand Down Expand Up @@ -191,6 +210,15 @@ because the first is needed to enable translations in the JavaScript code and
the second one is read by the PHP code and provides the data for translated
terms in there.

How to update custom mimetype icons
===================================

The following command is required to run after adding custom mimetype icons to your theme:

.. code-block:: bash

sudo -u www-data php occ maintenance:mimetype:update-js


How to change names, slogans and URLs
=====================================
Expand Down