Question

有一个非常奇怪的断点问题。

Screen.scss包含最基本的断点示例：

@import "breakpoint";

  $high-tide: 500px;

  .johnny-utah {
    color: blue;
    @include breakpoint($high-tide) {
      content: 'Whoa.';
    }
  }

这会编译为：

  .johnny-utah {
      color: blue; 
  }

似乎断点没有返回任何东西。以前曾经工作过。

在OS X.10上运行Compass 1.0.1，Breakpoint 2.5.0和SASS 3.4.3。

我的config.rb没什么特别的：

# Require any additional compass plugins here.
require 'breakpoint'

# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts"
fonts_dir = "fonts"

output_style = :nested

# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true

# To disable debugging comments that display the original location of your selectors. Uncomment:
# line_comments = false
color_output = true


# If you prefer the indented syntax, you might want to regenerate this
# project again passing --syntax sass, or you can uncomment this:
# preferred_syntax = :sass
# and then run:
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
preferred_syntax = :scss

Answer 1

没关系，这是我有史以来最愚蠢的错误！

这是一个古老的项目，当时我认为我正在使用Breakpoint，但没有......我使用了自己的mixin，名为_breakpoint.scss，看起来像这样：

@mixin breakpoint($breakpoint) {
  @if $breakpoint == tablet {
    @media only screen and (min-width: 768px) { @content; }
  }

  @if $breakpoint == desktop {
    @media only screen and (min-width: 1024px) { @content; }
  }

  @else if $breakpoint == big_desktop {
    @media only screen and (min-width: 1280px) { @content; }    
  }
}

这就是输出什么的原因..

断点不输出任何内容

1 个答案: