A progressive mobile first theme with modular scale typography and powerful grid-based layout engine.
- HTML 5
- Responsive design (mobile-first) with configurable breakpoints. Defaults to 768, 960 and 1152px
- Typography using modular scale.
- Web accessibility optimized with ARIA roles
- Bulletproof flexible grid system with 24 columns (units) as default.
- Configurable grid
- Configurable number of columns in the grid
- Configurable gutter width
- Comes with its own special font "Noceda Font Pro", a light, elegant and open sans-serif font built in with 304 Gwikons (Groundwork icons)
- Supports both sidebars
- 17 regions with a special "Aside" region visible only in nodes.
- Optimized typography for all standard elements
- Block source ordering per region
- Powerful layout engine provides unlimited layout possibilities
- Collection of preset CSS classes
- LESS CSS enhanced with loads of Drupal-specific mixins and bundles.
- HTML5 polyfill to support older browsers
- and many more.
Naken is the default starter theme of Groundwork 2.x. It is actually the same theme when you generate a Groundwork custom theme via Drush or followed the manual instructions on creating a sub-theme of Groundwork. Use it if you can't be bothered to generate your own Groundwork custom theme, want to start right away, or you need a starter theme to include on your installation profile or distribution.
Before you start...
- Install (and configure) Drupal.
- Install the LESS module and the LESSPHP library.
Installation via Drush
- Download the Groundwork Front-end Framework and Naken:
drush dl groundwork naken
- Enable and set your new theme naken as default:
drush en naken --yes && drush vset theme_default naken
Manual installation
- Download the Groundwork Front-end Framework 2.x and Naken
- Extract the downloaded files and place both Groundwork and Naken folders in your Drupal installation. For example:
- sites/all/themes/groundwork
- sites/all/themes/naken
- Edit app-settings.css.less found inside the custom directory of Naken, and define the location of the theme.
For example (default): @themeDirectory: sites/all/themes/naken; - In the browser, log in as admin in your Drupal installation and go to Administration > Appearance > List: http://example.com/admin/appearance/list. Click the "Enable and set default" link on your new custom theme.
Recommended Modules
If you wish to use presentation classes on your markup instead of separating style with content, you may use:
- Block Class
Add classes to any block through the block's configuration interface. - Menu Attributes
Specify additional attributes for menu items such as id and class.
Help
Please visit http://groundwork.noceda.me/docs for full documentation.
Credits
Development of the Groundwork project is sponsored by Noceda Media Lab.