Stack Overflow
Stack Overflow

Questions tagged [susy]

Susy is a (now deprecated) design-agnostic set of tools for creating powerful, custom layouts.

Web:
Susy was a responsive layout engine for Sass, before flexbox and CSS grid were available. Susy is now deprecated, and will not receive updates. If you need help moving off Susy, or learning the latest in web layout, we offer training and consulting to help bring you up-to-date.

Github:
Susy is a design-agnostic set of tools for creating powerful, custom layouts. We didn't want another grid system full of rules and restrictions — we wanted a power tool for building our own damn systems. Version Three is trimmed down to it's most basic components — functions that can be used to build any grid system.

Susy is Deprecated. It should no longer be used on new projects, and will no longer be receiving any updates.

Web: www.oddbird.net/susy/
Github: https://github.com/oddbird/susy

207 questions
2
votes
1 answer

Passing arguments from a mixin to a content block

This open issue in the Sass queue seems to imply passing arguments to @content is not a feature yet, but Susy 2 seems to be able to do this. Tracking down how it's done is a bit of a rabbit hole though and I haven't figured it out yet. Perhaps…
krisbulman
  • 525
  • 6
  • 12
2
votes
0 answers

Overwrite SUSY grid gutter for nested elements

I am currently using SUSY to create a responsive grid system for the website I'm working on. My grid.scss file looks a bit like this: @for $i from 1 to $noOfGridColumns+1 { .desktop-#{$i}{ @include span ($i of $noOfGridColumns); …
James Howell
  • 1,392
  • 5
  • 24
  • 42
2
votes
1 answer

What happened with gutter function/mixin in Susy 2?

This's my susy config $susy: ( flow: ltr, math: fluid, output: float, gutter-position: right, container: 1000px, container-position: center, columns: 12, gutters: .15, column-width: false, global-box-sizing:…
Lamp27
  • 23
  • 2
2
votes
1 answer

Can't get susy to use gutter in 'px' while in math:static mode

I want to create a fixed non-flexible very damn static grid of 1200px. So I figured out, I need 90px for column-width, 12 columnts, 10px of gutter and 1200px of max-width. Well.. the following are my settings and it gives me an error "invalid null…
Manas N
  • 23
  • 6
2
votes
1 answer

Susy 2.0 span not working as expected

I have a fairly simple issue that I can't seem to figure out. Positioning spans at certain columns does not seem to have any effect. header { .fullheight { @include backImage('../images/img_hero_brightspace-homepage.png'); @include…
byrdr
  • 5,197
  • 12
  • 48
  • 78
2
votes
1 answer

Sass Susy gallery: element that spans two columns

I need to make some elements of susy's gallery mixin span two columns, the problem is as shown in the picture it does not push the other elements after it, even though I tried to do that manually. How could this be done. The link to the code…
theatropos1994
  • 155
  • 3
  • 10
2
votes
1 answer

Susy grid: position element by location not working

Trying to figure out Susy and am having trouble positioning elements by location. ‘first’ and ‘last’ work as expected, but using the number of a specific column doesn't. Where am I going wrong? .number { @include span(4 at 5); } see demo:…
pixeloco
  • 255
  • 3
  • 16
2
votes
1 answer

How to get Susy Sass location working and align an element to a central column

I have a three column grid and using the +span function works well to define columns. So if I want an element to span one column I do: +span(1 of 3) and two: +span(2 of 3) etc.. I would now like a an element to span one column but at position 2,…
Rupert
  • 1,629
  • 11
  • 23
2
votes
2 answers

Using susy with Jekyll

Is it possible to use Susy with Jekyll? If so, how? I tried adding 'susy' to my Gemfile and bundle install'ing, then adding susy to my gems array in config.yml: // _config.yml ... gems: - 'jekyll-compass' - 'susy' and following the instructions…
Sam Selikoff
  • 12,366
  • 13
  • 58
  • 104
2
votes
0 answers

Bleed variable amount outside of grid on one side only

I am using susy2 for a project and I would like to include an image that bleeds outside of grid only on the left side and then spans 7 columns within the grid. The problem is, I do not think I can just use bleed because the amount to bleed is not…
dingus
  • 31
  • 2
2
votes
3 answers

Is there any way to run susy or singularity with libsass?

I like susy, I like Singularity. Is there a way to make those two work with libsass or if not are there any grid frameworks like the two which I can use with libsass (using node-sass in my case)?
hugo der hungrige
  • 12,382
  • 9
  • 57
  • 84
1
vote
1 answer

Error: no mixin named transition with Susy in Woocommerce

I'm compiling Woocommerce's Storefront theme using Gulp and Sass and came across an error with one of the mixins: Error in plugin "sass" Message: storefront/assets/css/woocommerce/woocommerce.scss Error: no mixin named transition on line…
Bartek
  • 21
  • 4
1
vote
1 answer

Susy grid with webpack and sass-loader

I'm pretty new to Node and i'm trying to use Susy grid but get this error ERROR in ./node_modules/css-loader!./node_modules/sass-loader/lib/loader.js!./scss/waterbottle.scss Module build failed: @include gallery(1 of 2); ^ No…
judehall
  • 884
  • 12
  • 27
1
vote
1 answer

Susy 'context-slice of `12` can not be determined based on grid-columns `12`'

I have tried to install susy with npm and gulp, but get this error Error in plugin 'sass' Message: node_modules\susy\sass\susy_utilities.scss Error: [susy-normalize-columns] context-slice of 12 can not be determined based on grid-columns…
alibaba
  • 33
  • 4
1
vote
1 answer

Susy change flow from rtl to ltr if a class exists

I need the $susy variable to change from rtl to ltr if an ar class exists in body. I need to do it to support multi lingual on my site,below is the code for the same .page-container { background-color: red; @include container($susy); …
Novice
  • 458
  • 1
  • 6
  • 21
1
2
3
…
13 14