Flattish is a Reddit CSS theme written according to Google's Material Design specifications.
Flattish draws heavily from Material Design, from its animations to color palettes to components, including buttons, cards, dialogs, lists, menus, tabs, and more. The stylesheet is designed around Google's Roboto font, which is free to download.
Tabs and buttons will trigger animations and effects on hovering or clicking.
Flattish also features a dark theme for RES night mode users!
Flattish can be extended with several addons. Refer to the wiki for more details.
This addon will increase the height of the header to accomodate larger images. Large header images should be 420px tall.
When you load a page on your subreddit, this addon will randomly choose from a selection of header images in the stylesheet and alternate between the choices. This addon requires a minimum of 2 header images to alternate between, while supporting up to 36 unique headers.
Examples of this addon in action can be seen on subreddits like /r/kpop
Display an image on the sidebar of your subreddit. Sidebar images should be 330px wide. Depending on the height of your image, you will have to edit the base CSS.
Pin important announcements, content, or resources next to the main list of posts. Pinned content can be in the form of links or dropdown menus. Choose from seven different icons to represent each pinned item.
There are three options to get started with using flattish:
-
Customize your own version of flattish with the theme editor
-
Download and use the latest release build
-
Use the latest, untested, and unreleased development build
Use the flattish customizer to tailor the base stylesheet to your sub! This option allows for the quickest vanilla setup out of the box, while also being the easiest to customize right from the start.
Download the latest release of flattish.css from the project's releases page! This option allows for more control over the changes you wish to make to the base theme, but is also more complicated to extend compared to using the theme editor.
If you wish to develop the latest, cutting edge (and not completely tested) version of flattish:
- Clone the flattish repo:
git clone https://github.com/emyarod/flattish.git - Setup and install the necessary dependencies, Sass and Bourbon
After moving the stylesheet to your subreddit and uploading all of the necessary images, be sure to do the following:
- Add the following line to the sidebar of your subreddit
[This subreddit is night mode compatible](#/RES_SR_Config/NightModeCompatible)
- Edit subreddit settings to label submit buttons (/r/yoursubreddit/about/edit)
If you come across a bug while using flattish, please help me by reporting the bug on GitHub or by submitting a bug report post on /r/flattish.
- Google Material Design guidelines & Material Design Lite
- Google Material icons
- Ionicons
- Sass Burger
- kazuend
- Stitches
- Hover.css
- Kel Diobrando
- traducer