Skip to content

Commit

Permalink
Aliases (#478)
Browse files Browse the repository at this point in the history
* revert prefixing of default API, add prefix file
* remove unnecessary arguments
* shift => unshift
* Reimplement aliases to both Stylus and SCSS.
  • Loading branch information
x1024 authored and pixeldesu committed Jun 23, 2016
1 parent 4658a59 commit c90a33b
Show file tree
Hide file tree
Showing 4 changed files with 93 additions and 0 deletions.
67 changes: 67 additions & 0 deletions scss/jeet/_aliases.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
@mixin column($args...) {
@include j-column($args...);
}

@function column-width($args...) {
@return j-column-width($args...);
}

@function column-gutter($args...) {
@return j-column-gutter($args...);
}

@mixin span($args...) {
@include j-span($args...);
}

@mixin shift($args...) {
@include j-shift($args...);
}

@mixin unshift() {
@include j-unshift();
}

@mixin edit($args...) {
@include j-edit($args...);
}

@mixin center($args...) {
@include j-center($args...);
}

@mixin uncenter() {
@include j-uncenter();
}

@mixin stack($args...) {
@include j-stack($args...);
}

@mixin unstack() {
@include j-unstack();
}

@mixin align($args...) {
@include j-align($args...);
}

@mixin cf() {
@include j-cf();
}

@mixin col($args...) {
@include column($args...);
}

@mixin debug() {
@include edit;
}

@function cw($args...) {
@return column-width($args...);
}

@function cg($args...) {
@return column-gutter($args...);
}
1 change: 1 addition & 0 deletions scss/jeet/_jeet.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
@import '_settings';
@import '_functions';
@import '_grid';
@import '_aliases';
24 changes: 24 additions & 0 deletions stylus/jeet/_aliases.styl
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
/**
Aliases
*/
column = j-column
column-width = j-column-width
column-gutter = j-column-gutter
edit = j-edit
span = j-span
shift = j-shift
unshift = j-shift
center = j-center

This comment has been minimized.

Copy link
@lpirola

lpirola Jun 24, 2016

this alias is replacing center value in text-align when try to align an element. Anyone else found this bug? I read some issues talking about that but this issues are old.

uncenter = j-uncenter
stack = j-stack
unstack = j-unstack
align = j-align
cf = j-cf

/**
Alias shortcuts
*/
col = column
cw = column-width
cg = column-gutter
debug = edit
1 change: 1 addition & 0 deletions stylus/jeet/_jeet.styl
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
@import '_settings'
@import '_functions'
@import '_grid'
@import '_aliases'

7 comments on commit c90a33b

@andersonaguiar
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change causes problem with text-align center in personal project, for example.

@x1024
Copy link
Contributor Author

@x1024 x1024 commented on c90a33b Jun 23, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please provide me with a test case that reproduces the issue?

@pixeldesu
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

He is probably using a center() mixin to center text.

@x1024
Copy link
Contributor Author

@x1024 x1024 commented on c90a33b Jun 23, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The center() mixin is called the same thing now as it was 24 hours ago:
https://github.com/mojotech/jeet/blob/v6.1.2/stylus/jeet/_grid.styl

@zenopopovici
Copy link

@zenopopovici zenopopovici commented on c90a33b Jun 23, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@x1024 every center in my project is replaced with j-center.

@zenopopovici
Copy link

@zenopopovici zenopopovici commented on c90a33b Jun 23, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

&.-background-split {
   position: relative;

    &-teal-red {
        background-image: url("../images/svg/background-split-teal-red.svg");
        background-position: top center;
        background-size: cover;
        background-repeat: no-repeat;

        +below($tablet) {
            background-image: none;
        }
    }
}

.-background-split-teal-red {
  background-image: url("../images/svg/background-split-teal-red.svg");
  background-position: top j-center;
  background-size: cover;
  background-repeat: no-repeat;
}

@x1024
Copy link
Contributor Author

@x1024 x1024 commented on c90a33b Jun 23, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please take a look at #482
I tested the stylus code, and it seems to work.

Please sign in to comment.