compass-sass

Why does “compass watch” say it cannot load sass/script/node (LoadError)?

核能气质少年 提交于 2019-11-27 11:16:52
I'm having a problem with my compass watch command - it worked fine up until a few days ago. I have made no changes to my config files. I reinstalled Compass, used rvm to update Ruby. I checked my custom_require.rb file but I really don't know what to look for. It seems to be trying to load the file "sass/script/node" somewhere and from http://sass-lang.com/docs/yardoc/Sass/Script/Node.html I gather the filepath - but I have nothing there. /Users/sampurcell/.rvm/rubies/ruby-1.9.3-p194/lib/ruby/site_ruby/1.9.1/rubygems/custom_require.rb:60:in `require': cannot load such file -- sass/script/node

Sass/Compass - Convert Hex, RGB, or Named Color to RGBA

强颜欢笑 提交于 2019-11-27 09:48:47
问题 This may be Compass 101, but has anyone written a mixin which sets the alpha value of a color? Ideally, I would like the mixin to take any form of color definition, and apply transparency: @include set-alpha( red, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( #ff0000, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5); 回答1: Use the rgba function built into Sass Sets the opacity of a color. Examples: rgba(#102030, 0.5) =>

SASS : making underscore file names actually create css files

懵懂的女人 提交于 2019-11-27 09:36:23
By default SASS looks at the filename and determines whether to make a css file out of it. I'm wondering if there is a way to prevent this from happening. We're building a large website and lots of front-end developers are editing the css, but we only have one dev server. Sure some things you can see happen locally, but often you can only see the real rendered way on the server. So, when I push my compiled css file to the server, my co-workers' css gets clobbered until s/he commits and I do an svn:update, etc, etc. However, if we were working in different SASS file, and those css files were

Count number of selectors in a css file

a 夏天 提交于 2019-11-27 09:35:11
问题 is there an existing plugin/app/program/script/whatever that analyzes and counts the css selectors of a file? i want to check if the reason my css file is not working in IE is because my selector count is over 4095 (which im pretty sure is not) thanks! p.s. plus points if there's a haml/sass/compass solution 回答1: The following snippet can be run in the Firebug console in Firefox to count the total number of CSS selectors (not just CSS rules) and check whether it reaches the limit of 4095

Sass Keyframes animation mixin generating invalid CSS

流过昼夜 提交于 2019-11-27 07:46:10
问题 I have the following keyframes mixin, but it seems to be generated invalid CSS: @mixin keyframes($animationName) { @-webkit-keyframes $animationName { @content; } @-moz-keyframes $animationName { @content; } @-o-keyframes $animationName { @content; } @keyframes $animationName { @content; } } @include keyframes(icon-one) { 0% { opacity: 1; } 33% { opacity: 0; } 66% { opacity: 0; } 100% { opacity: 0; } } Here's the output: @-webkit-keyframes $animationName { 0% { opacity: 1; } 33% { opacity: 0;

Is there a SASS rule for outputting a descendant to the root?

烈酒焚心 提交于 2019-11-27 07:25:44
问题 Using SASS & Compass, can you still write in an indented descendant manner but add a rule/command so that the given descendant is written to another level e.g. root? So this: #example-id-1 { background: blue: #example-id-2 { background: red: #example-id-3 { background: yellow: } } } would normally output this: #example-id-1 { background: blue: } #example-id-1 #example-id-2 { background: red: } #example-id-1 #example-id-2 #example-id-3 { background: yellow: } but can a rule be applied to

Compass filter out -moz vendor prefix

生来就可爱ヽ(ⅴ<●) 提交于 2019-11-27 07:20:34
问题 Using Yeoman with generator-angular-fullstack for my project. The SCSS support is excellent however all my -moz prefixes are being filtered from the css result. I've looked at the compass docs regrading Vendor Prefixes. The doc suggested to override the defaults vars: $experimental-support-for-mozilla : true !default; $experimental-support-for-webkit : true !default; $support-for-original-webkit-gradients : true !default; $experimental-support-for-opera : true !default; $experimental-support

Customizing the output of Compass sprites

别来无恙 提交于 2019-11-27 07:11:48
问题 I have a top bar menu (that's based on Zurb's Foundation): This is the SCSS: .top-bar { .top-bar-section { ul { @import "menu-icons/*.png"; @include all-menu-icons-sprites; } } } Now, this does what expected, but the problem is that I want to style the a element inside each li elements (actually, I'd like to apply it to .top-bar.topbar-section.ul.li.a:before ). However, since the site is build in WordPress, and so the menu, I can only assign the class to the li element and I have no idea how

Sass negative variable value?

可紊 提交于 2019-11-27 07:01:58
I have a couple of scss selectors where I use the same amount positive and negative, as in: padding: 0 15px 15px; margin: 0 -15px 20px -15px; I'd prefer to use a variable for all the 15px amounts, but this does not work: $pad: 15px; padding: 0 $pad $pad; margin: 0 -$pad 20px -$pad; The margin amounts convert to positive numbers. Am I missing something? Try it like this margin: 0 (-$pad) 20px (-$pad); A more sane solution according to sass guidelines would be to interpolate variables like the following example: margin: 0 -#{$pad} 20px -#{$pad}; An example: https://www.sassmeister.com/gist

Sass/Compass compile into many locations

允我心安 提交于 2019-11-27 06:14:36
问题 I'm using Sass 3.1.10 with Compass 0.11.5. I need to compile my compass project into many diffrent locations (css_dir) due some structural reasons. Currently I compile all files for each path by hand. Is there a way to compile into many locations at the same time? my config.rb looks like this: http_path = "/" css_dir = "skin/main/css" #css_dir = "uc/main/css" #css_dir = "skin/abstract/css" #css_dir = "skin/ksv/css" sass_dir = "sass" images_dir = "images" javascripts_dir = "javascripts" output