michaelhabib / boltcms-theme-foundation

Foundation 6 : A Bolt CMS Theme using Foundation 6 CSS

Using This Theme

• Check template files for now ! — theme.yml

Internals

== ToDo / Goals: * Workflow ? Separate header, body & footer sections into separate .twig templates. Separate foundation components in separate .twig templates. ** Create one or more designs per section & component mentioned above.

• Twig Template inheritance and hierarchy

  • each page inherits as following:

  • TemplateName.twig > _master.twig > includes/_master_layout.twig

  • for each include template, look for

    • 'template_name.contenttypeSlug_entrySlug.twig'

    • 'template_name.contenttypeSlug.twig'

    • 'template_name.twig'

• Move all dependency management to npm & remove bower

• Create template files for pages with foundation6 support

  • Check out existing twig & foundation templates:

    • https://github.com/bobdenotter/bolt-foundation-theme

    • https://github.com/thampe/ZurbInkBundle

• Feature list & Add-ons

  • Ability to define page columns/layout in theme.yml

  • Ability to define thirdparty requirements in theme.yml

    • or check https://docs.bolt.cm/3.4/extensions/intermediate/web-assets#

    • and use a bundle for includes https://docs.bolt.cm/3.4/extensions/bundled/quick-start

    • For example, define jquery & foundation js & css urls in theme.yml instead of in template files.

  • Add icons support

    • http://zocial.smcllns.com/

    • foundation icons

  • Add web fonts ( google or any other)

    • consider : HiGoogleFonts , js google font selector

  • Add wow.js (animate on scroll)

• Markup validation check

• Accessibility check

  • more blocks:

    • header_top, header_bottom,

    • main_top, main_bottom,

    • aside_top, aside_bottom,

    • page_top, page_bottom,

    • footer_top, footer_bottom,

== Problems & Bugs: * Navigation animation : start slide down animation on mobile from behind the title-bar . * Foundation CSS : Find out why foundation.css & foundation.js from bower package are not working as expected! * How to keep page content centered on full with page? ** Answer: wrap MAIN content in a .container by default; and add .container class to .content-wrapper when full width/ no sidebar.

== Changelog:

=== v0.1.0 * updated grunt.js with: * option to copy zurb-foundation-6-prebuilt/css/foundation.css to /THEME/css/froundation.prebuilt.css/foundation.css

== Credits: * Used alot of code from https://github.com/bobdenotter/bolt-foundation-theme