Note - stay tuned, Sasson v3.x is going to be awesome.
Sasson is a powerful tool-kit intended for advanced drupal theming, aiming at bringing the fun back to theming.
It is a set of advanced tools combined together in a modular structure, everything is optional and we keep it so that what you don't use won't leave any trace in your output code.
Clean and simple code, lightweight structure, latest technologies, 100% open-source and the best DX (developer experience) we could think of is what we hope you will find in this new drupal base theme.
What it does ?
- SASS - Sasson makes your CSS smarter with Sass & Compass.
- Responsive - It's mobile friendly - with responsive, content-first layout, out of the box. optional mobile-first responsive layout, media queries break-points are configurable.
- HTML5 - It converts Drupal's template files to HTML5 markup -
<nav>for menus etc.(thanks Boron)
- Fluid grid - It includes Susy v2.x - a powerful, semantic layout system.
- CSS Reset/Normalize - Sasson includes both normalize.css and reset.css for you to choose, including an HTML5-friendly CSS Reset, cross-browser styling compatibility improvements and other tweaks & best practices from HTML5Boilerplate
- File watcher - See changes happen in real time. Sasson will automagically update your browser whenever you modify your stylesheets (or any other file) without a page refresh.
- Lightweight - It *doesn't* give you a pile of CSS rules you will have to override.
- Adaptive grid - in your settings you may choose width, # of columns, gutter width, we (well, Sass) do the math.
- Ready made sub-theme. just copy, rename, and start theming. even better - use one line of drush to do that.
- HTML5 support in oldIEs (IE 6-8) via HTML5shiv.
- HTML5 doctype and meta content-type.
- Search form uses the new input type="search" attribute.
- WAI-ARIA accessibility roles added to primary elements.
- Many extra body and node classes for easy theming.
- Responsive menus (via jqueryMobileDropdown).
- Google web-fonts support, right from your theme settings.
- Draggable overlay image you can lay over your HTML for easy visual comparison with your design.
- Grid background "image", for easy element aligning, made with CSS3 and SASS to fit every grid you can imagine.
- Bi-directionality support for RTL and LTR (Right-To-Left and Left-To-Right).
- Bad way - Extract the theme in your sites/all/themes/ directory, enable it and start hacking
- Good way -
- Extract the theme in your sites/all/themes/ directory
- Copy SUBTHEME into its own folder in your themes directory
- Rename at least your folder and .info file
- Enable your sub-theme and start hacking
- Even better - you can use drush to create your sub-theme(s) -
drush sns "My theme"- see this comment for more info
- Full On - is a full-width sub-theme for Sasson and a great example of how you can override stuff from Sasson.
- Plato - is a beautiful sub-theme for Sasson and the theme for the OpenideaL project.
Sasson v3.x is now available for download !
- Compass compiler - The new release uses the original Compass compiler, that means you should have Compass installed.
gridlayout system - meet Gridy SalsaSusy 2, a new simple and powerful layout system.
Upgrade from v2.x to v3.x - not supported ATM, it should be possible (read this) but we won't test it before 3.x is ready for production use. if you have a running site using v2.x - you're good, stick with it.
Help will be most welcome:
- Testing the new v3.x
- Documentation - there's a page on the documentation section but there is still a lot of place for improvements, especially for the upcoming v3.x.
- Any open issue in the Issue queue.
Sasson was started as 965 but have since evolved into new areas.
most of the ideas here came from many super talented developers, credit is left where credit is due.
Thanks perelman nir for the name and raz konforti for making it work so amazingly good.
The bugs are mine.