Natknąłem się na ciekawy "framework" http://foundation.zurb.com/, nie bardzo wiem natomiast jak korzystać z plików sass, zainstalowałem ruby, potrafię to skompilować do css ale nie bardzo wiem jak ma to pomóc w utrzymaniu ładnego pliku css. Instalowałem całość zgodnie z opisem: http://foundation.zurb.com/docs/sass.html. Generalnie chciałem pokombinować z wyglądem buttonów. W folderze z projektem mam folder sass a w nim między innymi (app.sass) takie cudo:
Kod
// Global Foundation Settings
@import "settings";
// Comment out this import if you don't want to use normalize
@import "normalize";
// Comment out this import if you are customizing you imports below
@import "foundation";
// Import specific parts of Foundation by commenting the import "foundation"
// and uncommenting what you want below. You must uncomment the following if customizing
// @import "foundation/components/global"; // *always required
// @import "foundation/components/grid";
//
// Use this grid if you want to start using the new Foundation 5 grid early.
// It will change breakpoints to min-width: 640px and 1024px.
//
// @import "foundation/components/grid-5";
//
// @import "foundation/components/visibility";
// @import "foundation/components/block-grid";
// @import "foundation/components/type";
// @import "foundation/components/buttons";
// @import "foundation/components/forms"; // *requires components/buttons
// @import "foundation/components/custom-forms"; // *requires components/buttons, components/forms
// @import "foundation/components/button-groups"; // *requires components/buttons
// @import "foundation/components/dropdown-buttons"; // *requires components/buttons
// @import "foundation/components/split-buttons"; // *requires components/buttons
// @import "foundation/components/flex-video";
// @import "foundation/components/section";
// @import "foundation/components/top-bar"; // *requires components/grid
// @import "foundation/components/orbit";
// @import "foundation/components/reveal";
// @import "foundation/components/joyride";
// @import "foundation/components/clearing";
// @import "foundation/components/alert-boxes";
// @import "foundation/components/breadcrumbs";
// @import "foundation/components/keystrokes";
// @import "foundation/components/labels";
// @import "foundation/components/inline-lists";
// @import "foundation/components/pagination";
// @import "foundation/components/panels";
// @import "foundation/components/pricing-tables";
// @import "foundation/components/progress-bars";
// @import "foundation/components/side-nav";
// @import "foundation/components/sub-nav";
// @import "foundation/components/switch";
// @import "foundation/components/magellan";
// @import "foundation/components/tables";
// @import "foundation/components/thumbs";
// @import "foundation/components/tooltips";
// @import "foundation/components/dropdown";
@import "settings";
// Comment out this import if you don't want to use normalize
@import "normalize";
// Comment out this import if you are customizing you imports below
@import "foundation";
// Import specific parts of Foundation by commenting the import "foundation"
// and uncommenting what you want below. You must uncomment the following if customizing
// @import "foundation/components/global"; // *always required
// @import "foundation/components/grid";
//
// Use this grid if you want to start using the new Foundation 5 grid early.
// It will change breakpoints to min-width: 640px and 1024px.
//
// @import "foundation/components/grid-5";
//
// @import "foundation/components/visibility";
// @import "foundation/components/block-grid";
// @import "foundation/components/type";
// @import "foundation/components/buttons";
// @import "foundation/components/forms"; // *requires components/buttons
// @import "foundation/components/custom-forms"; // *requires components/buttons, components/forms
// @import "foundation/components/button-groups"; // *requires components/buttons
// @import "foundation/components/dropdown-buttons"; // *requires components/buttons
// @import "foundation/components/split-buttons"; // *requires components/buttons
// @import "foundation/components/flex-video";
// @import "foundation/components/section";
// @import "foundation/components/top-bar"; // *requires components/grid
// @import "foundation/components/orbit";
// @import "foundation/components/reveal";
// @import "foundation/components/joyride";
// @import "foundation/components/clearing";
// @import "foundation/components/alert-boxes";
// @import "foundation/components/breadcrumbs";
// @import "foundation/components/keystrokes";
// @import "foundation/components/labels";
// @import "foundation/components/inline-lists";
// @import "foundation/components/pagination";
// @import "foundation/components/panels";
// @import "foundation/components/pricing-tables";
// @import "foundation/components/progress-bars";
// @import "foundation/components/side-nav";
// @import "foundation/components/sub-nav";
// @import "foundation/components/switch";
// @import "foundation/components/magellan";
// @import "foundation/components/tables";
// @import "foundation/components/thumbs";
// @import "foundation/components/tooltips";
// @import "foundation/components/dropdown";
Nie wiem za bardzo co edytować, co kompilować żeby dostać zamierzony efekt - ktoś pomoże?