The key thing is that your partials have to have the .css.scss extension - not the .scss extension as is shown on the Sass website (http://sass-lang.com/tutorial.html) explaining partial usage.
Here's an example of Sass used in my app:
assets/stylesheets/admin/meals.css.scss:
// Place all the styles related to the admin/meals controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/ @import "../partials/standard_list"; body { #meals_index { #meal_new_area { } ul#meal_list { @include standard_list(meal); } } }
assets/stylesheets/partials/_standard_list.css.scss:
@mixin standard_list($resource) { $light_green: #52D017; list-style-type: none; li { ul li { display: inline-block; } ul li.name { position: absolute; } ul li.controls { position: relative; margin-left: 300px; width: 200px; } ul##{$resource}_list_headers { li { font-weight: bold; } } ul.items_within_#{$resource} { li.name {} li.controls {} } ul:hover { background: $light_green; } } }
No comments:
Post a Comment
Please be considerate in what you say.