Giter Club home page Giter Club logo

sass's Introduction

Sass

@SassCSS on Twitter    stackoverflow    Gitter

Sass makes CSS fun again. Sass is an extension of CSS, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a plugin for your build system.

$font-stack: Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  li { @include border-radius(10px); }

  a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
  }
}

Install Sass

You can install Sass on Windows, Mac, or Linux by downloading the package for your operating system from GitHub and adding it to your PATH. That's all—there are no external dependencies and nothing else you need to install.

If you use Node.js, you can also install Sass using npm by running

npm install -g sass

However, please note that this will install the pure JavaScript implementation of Sass, which runs somewhat slower than the other options listed here. But it has the same interface, so it'll be easy to swap in another implementation later if you need a bit more speed!

See the Sass website for more ways to install Sass.

Once you have Sass installed, you can run the sass executable to compile .sass and .scss files to .css files. For example:

sass source/stylesheets/index.scss build/stylesheets/index.css

Learn Sass

Check out the Sass website for a guide on how to learn Sass!

This Repository

This repository isn't an implementation of Sass. Those live in sass/dart-sass and sass/libsass. Instead, it contains:

  • spec/, which contains specifications for language features.
  • proposal/, which contains in-progress proposals for changes to the language.
  • accepted/, which contains proposals that have been accepted and are either implemented or in the process of being implemented.

Note that this doesn't contain a full specification of Sass. Instead, feature specifications are written as needed when a new feature is being designed or when an implementor needs additional clarity about how something is supposed to work. This means many of the specs in spec/ only cover small portions of the features in question.

Versioning Policy

The proposals in this repository are versioned, to make it easy to track changes over time and to refer to older versions. Every version has a Git tag of the form proposal.<name>.draft-<version>. A new version should be created for each batch of changes.

Every version has a major version, and they may have a minor version as well (indicated <major>.<minor>). The minor version should be incremented for changes that don't affect the intended semantics of the proposal; otherwise, the major version should be incremented.

sass's People

Contributors

adamhooper avatar ahmdtalat avatar asottile avatar awjin avatar bramus avatar codemacabre avatar connorskees avatar dependabot[bot] avatar duncansmart avatar dvdherron avatar goodwine avatar jamesnw avatar jathak avatar jerivas avatar jgerigmeyer avatar jlosito avatar larsgrefer avatar mirisuzanne avatar nex3 avatar nschonni avatar ntkme avatar pamelalozano16 avatar rafer45 avatar stof avatar teresapartidas avatar xnuk avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sass's Issues

Change the default location for Sass stylesheets in the Sass::Plugin

The current default is bad for two reasons:

  1. The sass stylesheets are source code and shouldn't be directly served by the webserver.
  2. The sass generates to a folder that contains the source files, making it overly difficult to force a recompile by removing the output.

Compass has changed this default to "app/stylesheets" since its inception. I think this should be the default for Sass in a Rails app and maybe just the "sass" directory at the project root otherwise.

For backwards compatibility, the public/stylesheets/sass directory should be still be supported with a deprecation warning if it is found.

sass master problem

not completely sure if it's sass or compass problem, but...
Gemfile:

gem 'rails',                 :git => 'git://github.com/rails/rails.git'
gem 'arel',                  :git => 'git://github.com/rails/arel.git'
gem 'rack',                  :git => 'git://github.com/rack/rack.git'
gem 'haml',                  :git => 'git://github.com/nex3/haml.git'
gem 'sass',                  :git => 'git://github.com/nex3/sass.git'
gem 'compass',               :git => 'git://github.com/slbug/compass.git', :branch => 'master'

(using my compass fork just because of fixed gemspec to work with haml 3.1)

config/compass.rb

project_type = :rails
project_path = Compass::AppIntegration::Rails.root
http_path = "/"
css_dir = "public/stylesheets"
sass_dir = "app/stylesheets"
environment = Compass::AppIntegration::Rails.env

Problem: sass not generating css files. i removed everything from public/stylesheets and next browser refreshes gives

ActionController::RoutingError (No route matches "/stylesheets/screen.css"):

downgrading sass version to '3.1.0.alpha.32' helps. everything works.

some problems with @import using sass edge + rails edge

I've created test app - https://github.com/slbug/sasstest
just start it and try to open http://localhost:3000/stylesheets/screen.css

you will see issue - undefined method `map' for "stylesheets":String

/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/lookup_context.rb:126:in `normalize_name'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/lookup_context.rb:111:in `args_for_lookup'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/lookup_context.rb:87:in `find_all'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/importers/rails.rb:60:in `find_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/importers/rails.rb:54:in `find_'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/importers/rails.rb:23:in `find_relative'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/import_node.rb:45:in `import'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/import_node.rb:25:in `imported_file'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/import_node.rb:34:in `css_import?'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/engine.rb:294:in `block in _dependencies'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/node.rb:163:in `each'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/node.rb:164:in `block in each'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/node.rb:164:in `each'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/tree/node.rb:164:in `each'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/engine.rb:293:in `grep'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/engine.rb:293:in `_dependencies'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/engine.rb:282:in `dependencies'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/sass-3ee1e35e2dfa/lib/sass/plugin/rails.rb:53:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/template.rb:278:in `compile'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/template.rb:214:in `compile!'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/template.rb:138:in `block in render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications.rb:54:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/template.rb:137:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:64:in `block (2 levels) in render_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/abstract_renderer.rb:34:in `block in instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications.rb:52:in `block in instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications/instrumenter.rb:21:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications.rb:52:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/abstract_renderer.rb:34:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:63:in `block in render_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:71:in `render_with_layout'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:62:in `render_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:18:in `block in render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/abstract_renderer.rb:23:in `wrap_formats'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/renderer/template_renderer.rb:16:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/rendering.rb:99:in `_render_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_view/rendering.rb:27:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/haml-87c0810609d3/lib/haml/helpers/action_view_mods.rb:13:in `render_with_haml'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/rendering.rb:128:in `_render_template'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/rendering.rb:122:in `render_to_body'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/renderers.rb:29:in `render_to_body'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/compatibility.rb:46:in `render_to_body'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/rendering.rb:115:in `render_to_string'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/rendering.rb:106:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/rendering.rb:16:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:40:in `block (2 levels) in render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/core_ext/benchmark.rb:5:in `block in ms'
/home/bug/.rvm/rubies/ruby-1.9.2-p136/lib/ruby/1.9.1/benchmark.rb:309:in `realtime'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/core_ext/benchmark.rb:5:in `ms'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:40:in `block in render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:78:in `cleanup_view_runtime'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/railties/controller_runtime.rb:15:in `cleanup_view_runtime'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:39:in `render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/implicit_render.rb:10:in `default_render'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/implicit_render.rb:5:in `send_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/base.rb:150:in `process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/rendering.rb:10:in `process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/callbacks.rb:18:in `block in process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/callbacks.rb:428:in `_run__1612961810420319057__process_action__4496386423255590499__callbacks'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/callbacks.rb:402:in `_run_process_action_callbacks'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/callbacks.rb:93:in `run_callbacks'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/callbacks.rb:17:in `process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:30:in `block in process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications.rb:52:in `block in instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications/instrumenter.rb:21:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/notifications.rb:52:in `instrument'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/instrumentation.rb:29:in `process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/rescue.rb:17:in `process_action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/base.rb:119:in `process'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/abstract_controller/rendering.rb:39:in `process'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal.rb:144:in `dispatch'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal/rack_delegation.rb:14:in `dispatch'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_controller/metal.rb:183:in `block in action'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/routing/route_set.rb:62:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/routing/route_set.rb:62:in `dispatch'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/routing/route_set.rb:27:in `call'
rack-mount (0.6.13) lib/rack/mount/route_set.rb:148:in `block in call'
rack-mount (0.6.13) lib/rack/mount/code_generation.rb:93:in `block in recognize'
rack-mount (0.6.13) lib/rack/mount/code_generation.rb:68:in `optimized_each'
rack-mount (0.6.13) lib/rack/mount/code_generation.rb:92:in `recognize'
rack-mount (0.6.13) lib/rack/mount/route_set.rb:139:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/routing/route_set.rb:520:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/best_standards_support.rb:17:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/etag.rb:23:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/conditionalget.rb:25:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/head.rb:14:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/methodoverride.rb:24:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/params_parser.rb:21:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/flash.rb:182:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/session/abstract/id.rb:192:in `context'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/session/abstract/id.rb:187:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/cookies.rb:305:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/query_cache.rb:32:in `block in call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/connection_adapters/abstract/query_cache.rb:26:in `cache'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/query_cache.rb:12:in `cache'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/query_cache.rb:31:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activerecord/lib/active_record/connection_adapters/abstract/connection_pool.rb:352:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/callbacks.rb:29:in `block in call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/callbacks.rb:408:in `_run_call_callbacks'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/callbacks.rb:28:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/reloader.rb:68:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/sendfile.rb:102:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/remote_ip.rb:48:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/show_exceptions.rb:47:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/railties/lib/rails/rack/logger.rb:13:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/runtime.rb:17:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/activesupport/lib/active_support/cache/strategy/local_cache.rb:72:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/lock.rb:34:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/actionpack/lib/action_dispatch/middleware/static.rb:60:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/railties/lib/rails/engine.rb:414:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/railties/lib/rails/railtie/configurable.rb:28:in `method_missing'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rails-199d1abeb290/railties/lib/rails/rack/log_tailer.rb:14:in `call'
/home/bug/.rvm/gems/ruby-1.9.2-p136/bundler/gems/rack-812ac75b327c/lib/rack/handler/webrick.rb:52:in `service'
/home/bug/.rvm/rubies/ruby-1.9.2-p136/lib/ruby/1.9.1/webrick/httpserver.rb:111:in `service'
/home/bug/.rvm/rubies/ruby-1.9.2-p136/lib/ruby/1.9.1/webrick/httpserver.rb:70:in `run'
/home/bug/.rvm/rubies/ruby-1.9.2-p136/lib/ruby/1.9.1/webrick/server.rb:183:in `block in start_thread'

it fails only when using @import

Special handling for nesting under *

Currently in Sass

*, a  
  &.foo
    color: red

Becomes:

*.foo, a.foo {
  color: red; }

But the asterisk is implied by .foo so sass can optimize this to:

.foo, a.foo {
  color: red; }

CSS3 Gradients indented syntax

is it possible to use multiple lines for the CSS3 gradient syntax? Also it would be useful for other CSS3 syntaxes, like multiple borders, box-shadows, text-shadows, backgrounds etc. Maybe some symbol to indicate a newline, possible commenting out the newline:

background-image: -webkit-gradient(linear, center top, center bottom,//
  from(black),//
  color-stop(33.333%, blue),//
  color-stop(66.666%, green),//
  to(red)//
)
background-image: -moz-linear-gradient(  ...

CSS @import directives

If a CSS @import is specified anywhere except the start of a document, it should be moved to the before the first selector or else it will be ignored by the browsers.

flexible indentation for generated CSS

I'm currently working at a shop that requires 4-space indented CSS, regardless of what's being used to work on, edit, or generate it. I took a stab at making this an option in SASS, and am curious what would be necessary for making this into an officially accepted patch. In particular, I want to make sure I'm going about this the right way.

ttilley@76881d3

Mystery space character when parent selector is a number

When I do this:

=mixin($prefix: ".elem")
  #{$prefix}
    $suffix: 1
    &#{$suffix}
      width: 20px
.some_class
  +mixin

I get this:

.some_class .elem 1  {width: 20px;}

Note the space between .elem and the number 1, which should not be there.

If I change $suffix to $suffix: T, I get this, as expected:

.some_class .elemT {width: 20px;} 

Sass 3.0

Would it be possible to push an empty sass 3.0 gem that simply depends on haml 3.0? That way we could already use it as dependency.

@charset in imported files

Sass needs to handle the case where @charset is specified in an imported file by moving the @charset directive to the start of the document and normalizing different charsets across all imported files.

sass-convert bug with /**/ comments

when converting from .scss to .sass i noticed that lines like this:

.highlight .c { color: #999988; font-style: italic } /* Comment */

were converted to

.highlight .c
  color: #999988
  font-style: italic

/* Comment

this is with sass-convert run as

sass-convert file.scss file.sass

version 3.0.25

Directives should allow interpolation

I want to create an SCSS mixin which makes me some @-webkit-keyframe sections. I can do the following:

@mixin animate($name) {
    @-webkit-keyframes foo {
        0% { color: red; }
        100% { color: blue; }
     }
}

This works fine. However, as I want the $name variable to be inserted as the animation name, I replace the second line with:

@-webkit-keyframes $name {

Sass doesn't understand this and gives a parse error:

Invalid CSS after "...bkit-keyframes ": expected "}", was "$name {"

including an image path in a mixin?

I'm trying to write a simple mixin that I can use to place an dropshadow image into, the mixin that isn't working is this:

@mixin dropshadow($img,$padding:30) {
    padding-bottom: $padding+px;
    background:{
        image: url(../images/+$img);
        position: center bottom;
        repeat: no-repeat;
    }
}

This doesn't work and I get this error

error scss/style.scss (Line 309: Invalid CSS after " image: url(": expected ")", was "../images/+$img);")

Any ideas on how I can do this?

RubyInline incompatibility

Heya,
In the process of upgrading my app to Rails 3, I've updated to Sass 3.1.0.alpha.19, and can no longer get it to boot. I get :
lib/sass/plugin/rails.rb:19: undefined method `reverse_merge!' for nil:NilClass

  • instead.

Turns out that RubyInline defines "attr_reader :options" on the Module object. This then prevents Sass::Plugin's method_missing magic from forwarding Sass::Plugin.options to the compiler, and it just returns nil instead.

Any thoughts on a workaround?

scss parse error

Consider the following SCSS file:

$var: true and
      false;
@debug "Should be false: #{$var}";

You'd expect the output to be:

Line 3 DEBUG: Should be false: false

But instead you get:

Line 3 DEBUG: Should be false: true and false

Removing the newline from the assignment expression yields the correct behavior.

Need more math and number support in SASS

In order to target IE-specific fixes with handy mixins, it is necessary to do some simple math that is not supported currently in SASS. For my purposes I've recently needed to do the following things:

  • remove units (I think I can just divide the units away: 200px/1px = 200)
  • remove the beginning hash from a color (#ffffff -> ffffff)
  • use sine, cosine, tangent functions for calculating angles
  • get a hex number from a decimal number
      @mixin ie-text-shadow($x, $y, $radius:1px, $color: #000000) {
          // TODO: use sine/cosine to get the angle from the x and y
          //$angle: arctan($x/$y);
          $filter: Shadow(Color=#{$color}, Direction=#{$angle}, Strength=#{$radius/1px});
          .ielt8 & {
              filter: $filter;
          }
          .ie8 & {
              -ms-filter: quote($filter);
          }
      }
      @mixin ie-background-rgba($color: #ffffff, $alpha:1) {
          // TODO: convert the $alpha into a hex
          //$color: ($color) + hex($alpha);
          $filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$color}',EndColorStr='#{$color}');
          .ielt8 & {
              background: none;
              filter: $filter;
          }
          .ie8 & {
              background: none;
              -ms-filter: quote($filter);
          }
      }

make --watch work with symlinks

It appears that if I symlink a folder with sass files in it into that folder that I'm watching, changes aren't detected. It would be great if they could be!

Suggestion: @import .scss files that aren't prefixed with an underscore as if they did.

The ability to import files without compiling them using the _ prefix is quite useful, but it would be nice not have to separate my settings/mixins out from the main CSS. It would be nice to be able to put everything relevant to a single stylesheet in one file, and have the ability to import it with or without including the compiled css in the parent file. Something like @borrow or what ever term is most appropriate.

FSSM patched to work on Rubinius

The version of 'fssm' included with Sass doesn't on Rubinius because it causes a StackError. Version 0.2.2 of fssm, which was just released, does work. However, Sass has fssm vendored at a specific commit, rather than including the gem in the gemspec, so I still can't use Sass easily. Can you update your vendored version of fssm, or include it in the gemspec instead?

Parser error for unquote() after !important

I found an edge case where the latest pre-release (3.1.0.alpha.252) seems to have a parsing error:

test.sass:

h1
  color: red !important unquote("/* hello */")

Compiling with sass --trace test.sass results in

/home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:589:in `+': nil can't be coerced into Fixnum (TypeError)
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:589:in `parse_property'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:573:in `parse_property_or_rule'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:554:in `parse_line'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:447:in `build_tree'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:466:in `append_children'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:465:in `each'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:465:in `append_children'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:456:in `build_tree'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:449:in `each'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:449:in `build_tree'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:466:in `append_children'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:465:in `each'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:465:in `append_children'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:322:in `_to_tree'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:291:in `_render'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/engine.rb:238:in `render'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/exec.rb:316:in `process_result'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/exec.rb:41:in `parse'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/../lib/sass/../sass/exec.rb:21:in `parse!'
    from /home/pascal/.gem/ruby/1.8/gems/sass-3.1.0.alpha.252/bin/sass:8
    from /home/pascal/.gem/ruby/1.8/bin/sass:19:in `load'
    from /home/pascal/.gem/ruby/1.8/bin/sass:19

Allow comma-separated multiple values in a CSS property mixin to be nested

Note:
I originally posted this the Compas Issues but Scott Davis remarked that it was more of a Sass issue.

With the advent of multiple values in several CSS properties (text shadow, box shadow, background-images, etc) I find myself driven to nest each value in order to increase future legibility.

This seems adequate for Compass & Sass since we tend to write longer properties with SassScript and the new CSS3 mixins.

This:

+background-image(
  linear-gradient(
    darken(desaturate($blue, 15%), 20%),
    darken(desaturate($blue, 10%), 5%)
  )
)

+box-shadow(
  rgba(0,0,0,.4) -1px 0px 2px inset,
  rgba(0,0,0,.4) 1px 0px 2px inset,
  rgba(0,0,0,.5) 0 1px 4px inset,
  rgba(0,0,0,.5) 0 -1px 2px inset
)

is much more legible than this:

+background-image(linear-gradient(darken(desaturate($blue, 15%), 20%), darken(desaturate($blue, 10%), 5%)))
+box-shadow(rgba(0,0,0,.4) -1px 0px 2px inset, rgba(0,0,0,.4) 1px 0px 2px inset, rgba(0,0,0,.5) 0 1px 4px inset, rgba(0,0,0,.5) 0 -1px 2px inset)

What do you guys think?

rails master + sass

Sass broken since introducing sprockets in rails. Any require fails with error - can't load (load path - .). Do you plan to add sprockets support?

Growl notifications

It would be great to be able to have a Growl notification when SASS has updated the CSS (whilst running with --watch)

"Backwards nesting" of CSS hooks

One thing I love about CSS is nesting of styles but it makes for targeting browsers nearly impossible. Consider the following.

divParent {

color:red;
#divChild {
    -moz-transform:scale(1.05);
    &prepend(.ie8) {
        width:105%;
        height:105%;
        position:relative;
        top:-5px;
    }
}

}

Essentially, I'd like to be able to prepend specific CSS hooks (e.g. for IE or browsers that don't support a given CSS3 property) but I would have to do those in their own separate nested style tree. Are you following me here? If I'm not making myself clear and this looks interesting to you, shoot me an email at [email protected] and I'd be happy to talk about it further.

sass --quiet not so quiet

Hi,

When I deploy code I use:

sass --quiet --style compressed --update #{Rails.root}/app/stylesheets:#{Rails.root}/public/stylesheets/compiled

It doesn't appear to be quiet though, this is what I always see scrolling in my terminal:

** [out :: deployer@example] directory /srv/example.com/releases/20101104043502/public/stylesheets/compiled
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/actions.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/audit.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/avatar.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/base.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/busy.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/buttons.css
** [out :: deployer@example] create /srv/example.com/releases/20101104043502/public/stylesheets/compiled/calendar.css

[ etc. + 40 more sass scripts processed ]

sass --help says --quiet silences warnings. Which is unusual imo. Usually --quiet means
not to output anything, unless there is a warning or error. So the other way around.

Media queries

Hi,

I'd love to be able to use media queries.

@media screen and (min-width: 1024px){
  @import "mobile";
}

and

@import "mobile" screen and (min-width: 1024px);

After making some attempts, it doesn't seem to work. In case 1, I get the error 'Syntax error: Import directives may only be used at the root of a document.' and in case 2, nothing happen (which should be a shortcut to the case 1).

Thanks a lot for your help.

rails master + sass

Sass broken since introducing sprockets in rails. Any require fails with error - can't load (load path - .). Do you plan to add sprockets support?

@extend performance

Using @extend in SASS has resulted in massive selectors in CSS. One of my CSS selectors is 4000 characters long. Chrome has been crashing and I think it has to do this my use of @extend. Can you comment?

Haml::Util::ruby1_8? workaround for Unicode in IronRuby

EDIT: This seems to be a more overarching issue with Haml/Sass making incorrect assumptions about Unicode capabilities based on IronRuby 1.1.1 claiming to be Ruby 1.9. Hence the rename.

I ran across this error while upgrading a project on an older Haml/Sass, Rails, and IronRuby stack to the latest versions of each (3.0.23, 3.0.1, 1.1.1).

@import not working with absolute file paths

I am trying to import a sass file via absolute file path, but keep getting an error that the file doesn't exist or cannot be read. This does not happen prior to version 3.1.0.alpha.249, so for now I have version 3.1.0.alpha.221 in my Gemfile (this is a Rails app). I can see that the file does actually exist. I'd be happy to test patches if needed.

Options are nil when using sass as plugin in Rails 2.3.11

I'm trying to use bleeding edge sass with Rails 2.3.11 as a plugin. I'm not using haml, so I 've installed the sass 3.1.0.alpha.252 gem. When I try to use this in my rails project I get the following error:

You have a nil object when you didn't expect it!
You might have expected an instance of ActiveRecord::Base.
The error occurred while evaluating nil.[]
/home/graaff/projects/wvwo/kenniscafe.git/vendor/plugins/sass/rails/../lib/sass/../sass/plugin.rb:80:in update_stylesheets' /home/graaff/projects/wvwo/kenniscafe.git/vendor/plugins/sass/rails/../lib/sass/../sass/plugin.rb:54:incheck_for_updates'
/home/graaff/projects/wvwo/kenniscafe.git/vendor/plugins/sass/rails/../lib/sass/../sass/plugin/rack.rb:51:in `call'

It looks like the default options (and by extention the options) are never set up, and thus nil.

line spacing in css output

Hi, someone probably already asked thsi question, but after a bit of reasearch I haven't come to the solution yet.
is there a way to get rid of the line spaces between rules (for the output css) without having to nest elements one in another?

I mean, I get this:
.crowns_baron { background: url('/images/crowns.png?1296421758') 0 -27px; }

.crowns_count { background: url('/images/crowns.png?1296421758') 0 -55px; }

.crowns_count { background: url('/images/crowns.png?1296421758') 0 -55px; }

insead of this:
.crowns_baron { background: url('/images/crowns.png?1296421758') 0 -27px; }
.crowns_count { background: url('/images/crowns.png?1296421758') 0 -55px; }
.crowns_count { background: url('/images/crowns.png?1296421758') 0 -55px; }

thanks in advanced

Sass convert removes meaningful parentheses in expression

I just installed sass 3.0.21 and ran sass-convert over all my sass using the following command:

sass-convert --in-place --from sass2 <file>.sass

There was an issue when it converted the following:

:width #{!blueprint_container_size - (!padding + !padding) - 2px}

into this:

width: #{$blueprint_container_size - $padding + $padding - 2px}

Note the lack of parentheses changing the expression completely.

Not sure why sass-convert would arbitrarily remove parentheses here, as other expressions converted in the same run had correctly preserved parentheses.

Change equality operators

I think == is very programmery and out of place in a sass file.
is matches and, or, and not. Similarly is not should replace !=.

Example:

@if $border-style is dashed { ... }

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.