Themer's
will love
Drupal 8
About
twitter.com/digitaldonkey09
thorsten.krug@donkeymedia.eu
Drupal 8
- responsive Mobile First HTML5 by default
- Template Engine TWIG
- New CSS philosophy (SMACSS & BEM)
- ie8 not supported
- CSS classes not in Core
(but in Classy Theme) - jQuery 2.x / no JQuery
by default
Today ...
SMACSS
BEM
KSS
Limit yourself!
KSS
SMACSS
BEM
// Button
//
// Your standard button suitable for clicking.
//
// :hover - Highlights when hovering.
// :disabled - Dims the button when disabled.
// .primary - Indicates button is the primary action.
// .smaller - A little bit smaller now.
//
// Markup:
// <button class="button {{modifier_class}}">
//
// :hover - Highlight the button when hovered.
//
// Styleguide 1.1
.button {
...
&.primary {
...
}
&.smaller {
...
}
&:hover {
...
}
&:disabled {
...
}
}
Which template?
Demo
BrowserSync Demo Video
http://quick.as/az3sxrb
Features
- Based on Classy (The Drupal 8 core theme)
- Gulp based workflow
- Singularity.gs grid system (like in Omega4)
- libsass is "up to 4000% faster!"*
-
KSS-Stylguide for Documentation, Team-development and prototyping
- Loads of Examples to get started easily.
- Improved live reloading with browserSync
- SCSS-Lint
- Abstract class summary
* http://sassbreak.com/ruby-sass-libsass-differences/
of the Guru „Theme Workflow“
The project on Drupal
- Infos and links are in the README.md
- SessionPlease provide Feedback in the Issues
- And review the theme if you like it @
https://www.drupal.org/node/2618932
Feedback
twitter.com/digitaldonkey09
thorsten.krug@donkeymedia.eu
https://www.drupal.org/sandbox/digitaldonkey/2599668
Drupal 8 Guru Theme
By Thorsten Krug
Drupal 8 Guru Theme
Creating Drupal 8 Theme based on gulp with browSersync
- 1,963