You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
roundcubemail/skins/elastic
Aleksander Machniak 8533a43707 Fix hidden toolbars in desktop mode 8 years ago
..
bootstrap Use Bootstrap 4, forget about Semantic UI 8 years ago
fonts Use Bootstrap 4, forget about Semantic UI 8 years ago
images Elastic skin - initial commit 8 years ago
includes Added compose.html template 8 years ago
styles Add icons for selectable listings, other fixes 8 years ago
templates Enable checkbox selection on contacts list in mail compose 8 years ago
README Added supported browsers list (#6) 8 years ago
meta.json Force widescreen mode 8 years ago
ui.js Fix hidden toolbars in desktop mode 8 years ago
watermark.html Elastic skin - initial commit 8 years ago

README

Roundcube Webmail Skin "Elastic"
================================

This skin package contains a theme for the Roundcube Webmail
software. It can be used, modified and redistributed according to
the terms described in the LICENSE section.

For information about building or modifiying Roundcube skins please visit
https://github.com/roundcube/roundcubemail/wiki/Skins

Roboto font from https://google-webfonts-helper.herokuapp.com/fonts/roboto?subsets=cyrillic,latin-ext,cyrillic-ext,latin,greek,greek-ext

LICENSE
-------
The contents of this folder are subject to the Creative Commons
Attribution-ShareAlike License. It is allowed to copy, distribute,
transmit and to adapt the work by keeping credits to the original
authors in the README file.
See http://creativecommons.org/licenses/by-sa/3.0/ for details.


PROJECT GOALS
-------------
Create a user interface that is clean and usable with any screen size.
Use new technologies like e.g. flexbox, @media, font-icons or less.
Cleanup css/html and unify as much as possible.


INSTALLATION (development):
---------------------------
1. Clone git-master roundcube/roundcubemail
2. Switch to branch dev-elastic
3. Goto /skins
4. git clone https://github.com/roundcube/elastic.git
5. Before use disable all plugins (we're not there yet) and set devel_mode=true

INSTALLATION (production):
--------------------------
styles.css is written using LESS syntax. Thus it needs to be compiled
using the `lessc` command line tool. This comes with the `nodejs-less`
RPM package which depends on nodejs.

 $ lessc -x styles/styles.less > styles/styles.css

(the -x option minifies the CSS code)

References to image files from the included CSS files can be appended
with cache-buster marks to avoid browser caching issues after updating.

Run `bin/updatecss.sh --dir <path-to-kolab-skin>` from the Roundcube
package before packaging the skin or after installing it on the
destination system.


RULES:
------
- Supported browsers: IE10+, Edge, Last 2 versions for Chrome/Firefox/Safari,
  Android Browser 5+, iOS Safari 7+.

- Minimum supported screen width is 240px (note that even if the device screen
  resolution is e.g.320x372 changing the text size in device settings will reduce
  the resolution)

- Every page (which is not a frame) has following required structure:
```
    <body>
        <div id="layout">
            <div id="menu"></div>
            <div id="sidebar"></div>
            <div id="list"></div>
            <div id="content"></div>
        </div>
    </body>
```
  where `sidebar` and `list` are optional. Which element of the `layout` will be displayed
  as a main view on mobile devices can be defined by adding `selected` class to it.