Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Convert] Error prompt #97

Open
claudchan opened this issue Sep 6, 2017 · 1 comment
Open

[Convert] Error prompt #97

claudchan opened this issue Sep 6, 2017 · 1 comment

Comments

@claudchan
Copy link

Hi,
I unable to convert these sass code:

@mixin breakpoint($min: 0, $max: 0) {
  $type: type-of($min);
  @if $type == string {
    @if $min == xxs {
      @media (max-width: 480px) { @content; }
    }
    @if $min == xs {
      @media (max-width: 767px) { @content; }
    }
    @else if $min == sm {
      @media (min-width: 768px) { @content; }
    }
    @else if $min == md {
      @media (min-width: 992px) { @content; }
    }
    @else if $min == lg {
      @media (min-width: 1200px) { @content; }
    }
  }
  @else if $type == number {
    $query: "all" !default;
    @if $min != 0 and $max != 0 { 
      $query: "(min-width: #{$min}) and (max-width: #{$max})"; 
    }
    @else if $min != 0 and $max == 0 { 
      $query: "(min-width: #{$min})"; 
    }
    @else if $min == 0 and $max != 0 { 
      $query: "(max-width: #{$max})"; 
    }
    @media #{$query} { 
      @content;
    }
  }
}
@claudchan
Copy link
Author

It should be converted into something looks like this:

breakpoint(min = 0, max = 0)
  type = typeof(min)
  if type == ident
    if min == xxs
      @media (max-width 480px)
        {block}
    if min == xs
      @media (max-width 767px)
        {block}
    else if min == sm
      @media (min-width 768px)
        {block}
    else if min == md
      @media (min-width 992px)
        {block}
    else if min == lg
      @media (min-width 1200px)
        {block}
  else
    query = "all"
    if min != 0 and max != 0
      query = "(min-width: "+min+") and (max-width: "+max+")"
    else if min != 0 and max == 0
      query = "(min-width: min)"
    else if min == 0 and max != 0
      query = "(max-width: "+max+")"
    @media query
      {block}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant