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.

Sign up for GitHub

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

Jump to bottom

ember fix #281

Closed
wants to merge 2 commits into from
Closed

ember fix #281

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fd62994
ember fix
tyleriguchi Aug 11, 2014
5bb14ee
Update README.md
tyleriguchi Aug 11, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

[Jeet](http://jeet.gs) is the most advanced, yet intuitive, grid system on the market today. You can think of it like the spiritual successor to [Semantic.gs](http://semantic.gs/).

This is a fork of jeet addressing an issue with using jeet with ember. Ember surrounds elements with script tags causing the first / last / nth child selectors to break. The fix changes to of-type but this means different elements won't flow correctly. Use with caution.

By making use of the power of pre-processors, we can now pass real fractions (or float numbers) as context that generates a percentage based width and gutter for grids. We're able to do this while maintaining a consistently sized infinitely nestable gutter.

Check out [this presentation](http://corysimmons.github.io/presentations/jeet-5) to learn more about what sets Jeet above other grid systems, then enjoy one of Jeet's many pre-processor flavors:
Expand Down
19 changes: 9 additions & 10 deletions scss/jeet/_grid.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,26 +26,26 @@
margin-#{$side}: $margin_l * 1%;
margin-#{opposite-direction($side)}: $margin_r * 1%;
@if $uncycle != 0 {
&:nth-child(#{$uncycle}n) {
&:nth-of-type(#{$uncycle}n) {
margin-#{opposite-direction($side)}: $margin_r * 1%;
float: $side;
}

&:nth-child(#{$uncycle}n + 1) {
&:nth-of-type(#{$uncycle}n + 1) {
clear: none;
}
}
@if $cycle != 0 {
&:nth-child(#{$cycle}n) {
&:nth-of-type(#{$cycle}n) {
margin-#{opposite-direction($side)}: $margin_last * 1%;
float: opposite-direction($side);
}

&:nth-child(#{$cycle}n + 1) {
&:nth-of-type(#{$cycle}n + 1) {
clear: both;
}
} @else {
&:last-child {
&:last-of-type {
margin-#{opposite-direction($side)}: $margin_last * 1%;
}
}
Expand Down Expand Up @@ -139,10 +139,10 @@
width: 100%;
margin-left: auto;
margin-right: auto;
&:first-child {
&:first-of-type {
margin-#{$side}: auto;
}
&:last-child {
&:last-of-type {
margin-#{opposite-direction($side)}: auto;
}
@if $pad != 0 {
Expand All @@ -168,10 +168,10 @@
width: auto;
margin-left: 0;
margin-right: 0;
&:first-child {
&:first-of-type {
margin-#{$side}: 0;
}
&:last-child {
&:last-of-type {
margin-#{opposite-direction($side)}: 0;
}
@if ($jeet-layout-direction == RTL) {
Expand Down Expand Up @@ -218,4 +218,3 @@
-o-#{$name}: #{$arguments};
#{$name}: #{$arguments};
}

26 changes: 13 additions & 13 deletions stylus/jeet/_grid.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,19 +22,19 @@ column(ratios = 1, offset = 0, cycle = 0, uncycle = 0, gutter = jeet.gutter)
margin-{side}: (margin_l)%
margin-{opposite-position(side)}: (margin_r)%
if uncycle != 0
&:nth-child({uncycle}n)
&:nth-of-type({uncycle}n)
margin-{opposite-position(side)}: (margin_r)%
float: side
&:nth-child({uncycle}n + 1)
&:nth-of-type({uncycle}n + 1)
clear: none
if cycle != 0
&:nth-child({cycle}n)
&:nth-of-type({cycle}n)
margin-{opposite-position(side)}: (margin_last)%
float: opposite-position(side)
&:nth-child({cycle}n + 1)
&:nth-of-type({cycle}n + 1)
clear: both
else
&:last-child
&:last-of-type
margin-{opposite-position(side)}: (margin_last)%

col = column
Expand All @@ -60,14 +60,14 @@ span(ratio = 1, offset = 0, cycle = 0, uncycle = 0)
margin-{side}: (margin_l)%
margin-{opposite-position(side)}: (margin_r)%
if uncycle != 0
&:nth-child({uncycle}n)
&:nth-of-type({uncycle}n)
float: side
&:nth-child({uncycle}n + 1)
&:nth-of-type({uncycle}n + 1)
clear: none
if cycle != 0
&:nth-child({cycle}n)
&:nth-of-type({cycle}n)
float: opposite-position(side)
&:nth-child({cycle}n + 1)
&:nth-of-type({cycle}n + 1)
clear: both

// Source Ordering
Expand Down Expand Up @@ -120,9 +120,9 @@ stack(pad = 0, align = false)
width: 100%
margin-left: auto
margin-right: auto
&:first-child
&:first-of-type
margin-{side}: auto
&:last-child
&:last-of-type
margin-{opposite-position(side)}: auto
if pad != 0
padding-left: pad
Expand All @@ -141,9 +141,9 @@ unstack()
width: auto
margin-left: 0
margin-right: 0
&:first-child
&:first-of-type
margin-{side}: 0
&:last-child
&:last-of-type
margin-{opposite-position(side)}: 0
if (jeet.layout-direction == RTL)
text-align: right
Expand Down