compass-sass | 易学教程

Sass: Dealing with the IE 4095 selectors per stylesheet restriction

阅读更多关于 Sass: Dealing with the IE 4095 selectors per stylesheet restriction

问题 Note: This question refers to a Rails project with Sass & Compass. Using the Rails Asset Pipeline? Then have a look at this question. We are developing a big application with many use cases and many individually styled pages, partly for multiple contexts. Which simply means a lot of style information. With the newest section of our application, we have broken Internet Explorer's limit of 4095 selectors per stylesheet. (Want a proof of this limitation? http://marc.baffl.co.uk/browser_bugs/css

Susy: Creating a grid for given screen widths (breakpoint px values) and not knowing the width of a single column (a non-content-first approach)

阅读更多关于 Susy: Creating a grid for given screen widths (breakpoint px values) and not knowing the width of a single column (a non-content-first approach)

I'm using Susy . I failed leveraging the content-first approach and decided to go window-px-widths-first At first i tried the content-first approach to grids, but soon i found my site behaving unexpectedly on different devices. It would display a mobile layout where i wanted a tablet layout, etc. I ended up adjusting em values of Susy settings for them to match certain screen widths (px values). The code got ugly and i realized that i wasn't actually using the content-first approach any more. Here's a static snapshot of the homepage of a site that i created using this faulty approach and a

Susy: How to extend content box to cover grid-padding as well?

阅读更多关于 Susy: How to extend content box to cover grid-padding as well?

问题 I just started to play with Susy. I have a 12 column grid that has grid-padding on it. Now i want the header of my page to span the whole grid including the grid-padding. What I'm doing right now is calculating the overall width and then setting a negative margin on the header. That's feels rather hacky to me... Is there a cleaner way to do it? $total-columns : 12; $column-width : 3.5em; $gutter-width : 1.25em; $grid-padding : 2em; $total-width: ( $total-columns * ($column-width + $gutter

Best way to auto compile compass-style SASS via maven

阅读更多关于 Best way to auto compile compass-style SASS via maven

referring to SASS implementation for Java? : What is the best way to auto-compile compass-style.org stylesheets in maven goal compile respectively package? I would not like to ship too many self-compiled libraries nor do I want to dynamically ship compiled files via filters like https://code.google.com/p/sass-java ( https://github.com/darrinholst/sass-java ) Any alternatives than hooking up shellscripts / ant scripts which requires installed ruby and compass on the client? What is the detailed difference between SASS and Compass Stylesheets, any problems with "sass-tools" when regularly using

Chrome DevTools save CSS changes directly to SASS file

阅读更多关于 Chrome DevTools save CSS changes directly to SASS file

问题 Is it possible to have style changes done directly in the "Styles" panel not only persisted to the .css but also to the corresponding .scss file? I have CSS source maps for every file and that works fine - I can jump right into the .scss file when I Ctrl-Click a property. I can edit the .scss file then and it reloads correctly (compass task in the background), but unfortunately everything I change directly in the Styles panel is persisted only to the compiled .css file. As soon as I change a

rails + compass: advantages vs using haml + blueprint directly

阅读更多关于 rails + compass: advantages vs using haml + blueprint directly

问题 I've got some experience using haml (+sass) on rails projects. I recently started using them with blueprintcss - the only thing I did was transform blueprint.css into a sass file, and started coding from there. I even have a rails generator that includes all this by default. It seems that Compass does what I do, and other things. I'm trying to understand what those other things are - but the documentation/tutorials weren't very clear. These are my conclusions: Compass comes with built-in sass

How do I output compressed CSS from Compass?

阅读更多关于 How do I output compressed CSS from Compass?

问题 How do I configure compass to output smaller or compressed CSS files? I tried compass -s compressed but that didn't work. 回答1: In your config.rb file: output_style = :compressed More at http://compass-style.org/help/documentation/configuration-reference/. 回答2: Did you try with the full name of the argument in command line ? compass watch --output-style=compressed 回答3: i use the following terminal command compass compile -e production --force reference: http://compass-style.org/help/tutorials

What is workflow in Yeoman to work with Sass files?

阅读更多关于 What is workflow in Yeoman to work with Sass files?

问题 I try to use yeoman but I don't know how to use my own sass files with it. With grunt server Sass files are watched and compiled into .tmp/styles/ But there is no reference to the compiled stylesheet, except <link rel="stylesheet" href="styles/main.css"> So, what is the recommended way to use the compiled sass files in index.html during development? E.g. grunt server , if I change my style app/styles/my.sass into .tmp/styles/my.css , this is overwritten and it is outside the server (localhost

How to use compass in phpstorm?

阅读更多关于 How to use compass in phpstorm?

问题 I'm aware of this question: How to add Compass syntax support to Jetbrains PhpStorm? but it doesn't help. I just opted for copying the files over, much easier in my project. But phpstorm still complains about compass. Without compass it compiles scss using ruby 1.9.3 without problems. Is my set up correct? EDIT : This is for PhpStorm 6- Compass is supported in PhpStorm 7+ 回答1: First of all, the question that you had linked is about enabling support for Compass-style imports, and it is a

Grunt task output then calling grunt-notify

阅读更多关于 Grunt task output then calling grunt-notify

Grunt notify: https://github.com/dylang/grunt-notify is great. However, it seems a bit limited. As far as I can tell all my messages need to be pre-generated. So the first question is how can I generate notifications? Next, It seems that grunt notify triggers based on error or success of some task. I guess based on std in/out/err? The problem where this breaks down is if some task doesn't use these. grunt compass doesn't use stderr if there are compile errors. So how can I run grunt notify when it has an error? This then leads to the next question. How can I grab the console output or stderr