susy-sass

struggling with a nested flexbox grid

由 白昼怎懂夜的黑 提交于 2020-01-11 09:36:14
问题 i tried to achieve a grid like pattern with a negative margin based grid system (susy) and failed. I tried to use flexbox, but i am not sure if its really possible, i thought the best approach would be 2 columns (side A and B) and give the boxes (1) the flex height of 50% of boxes 2, but it somehow doesn't seem to work. this is as far as i got it working. .block { width: 100%; background: grey } .column { align-content: stretch; display: flex; flex-flow: column wrap; width: 50%; } .box_long {

susy 2.0 change columns at breakpoint

由 陌路散爱 提交于 2019-12-19 10:25:34
问题 I'm not using Compass I prefer to use Breakpoint.scss I'm on susy 2.0 I know there are lot of posts with this question but I'm having 0 luck finding any regarding Breakpoint.scss and Susy 2.0 on this topic. @import "susy"; @import "breakpoint"; $medium: 800px; $susy: ( columns: 6, gutters: 3/4, gutter-position: split ); @include breakpoint($medium) { $susy: layout(12 1/4 split); } body { @include container(show); @include breakpoint($medium) { @include container(show); } } Do I have to use

Susy2 Sass: Centering elements vertically inside grid columns?

由 时间秒杀一切 提交于 2019-12-11 11:40:30
问题 I'm having a bit of trouble with vertically centering elements inside of grid column. Typically I'd use table-cell for something like that, but I'm having problems due to the float nature of Susy. Everything I try seems to fall apart at some point. For instance if I wanted to center these elements vertically in their respective column how would I do that, assuming I am using the default grid settings. <div class="section"> <div class="col1">Some Text<br/>Some Text</div> <div class="col2"><img

Trying to setup Susy grid with Rails 4

由 眉间皱痕 提交于 2019-12-11 11:09:22
问题 I want to use susy with Rails 4. I added gem 'susy' to my gemfile. Then I run bundle install . Everything is fine and says the gem was installed. Now I restart my Rails server, and add @import "susy"; to application.css.scss (I'm using sprockets). I get the error File to import not found or unreadable: susy. Any ideas? 回答1: To the best of my understanding, Sass-Rails is still using an older version of Sass that does not support Susy 2. I hope they are working on an update, and have it

Include a grid framework in visual studio that seems to be linux only?

由 强颜欢笑 提交于 2019-12-10 20:49:23
问题 I use Visual Studio 2013 with Web Essentials extension for all my Sass/Scss work. Its great. I came across a tutorial on a grid framework that I really want to use called Susy. However the tutorials I seen on it are all using it on Linux or mac and in some sort of a ruby based environment. Even on the site link, I don't see instructions on getting it to work in VS2013. I tried extension manager and nuget package manager but to no avail. My only option seems to be to download the source and

Compiling SASS and SUSY with GULP

由 自闭症网瘾萝莉.ら 提交于 2019-12-05 05:02:38
问题 I am trying to get gulp to compile my sass and use the susy grid/framework. I'm having troubles finding any information about this online. I have included: "gulp-ruby-sass": "^0.7.1", into my package.json and installed everything. My gulp sass gulp task likes like so: gulp.task('sass', ['images'], function () { return gulp.src('src/sass/*.{sass, scss}') .pipe(sass({ bundleExec: true, sourcemap: true, sourcemapPath: '../sass' })) .on('error', handleErrors) .pipe(gulp.dest('build')); }); So I

Compiling SASS and SUSY with GULP

由 泄露秘密 提交于 2019-12-03 21:44:14
I am trying to get gulp to compile my sass and use the susy grid/framework. I'm having troubles finding any information about this online. I have included: "gulp-ruby-sass": "^0.7.1", into my package.json and installed everything. My gulp sass gulp task likes like so: gulp.task('sass', ['images'], function () { return gulp.src('src/sass/*.{sass, scss}') .pipe(sass({ bundleExec: true, sourcemap: true, sourcemapPath: '../sass' })) .on('error', handleErrors) .pipe(gulp.dest('build')); }); So I can't for the life of me work out how to include susy so it complies using gulp , I haven't looked and

struggling with a nested flexbox grid

由 牧云@^-^@ 提交于 2019-12-01 19:21:40
i tried to achieve a grid like pattern with a negative margin based grid system (susy) and failed. I tried to use flexbox, but i am not sure if its really possible, i thought the best approach would be 2 columns (side A and B) and give the boxes (1) the flex height of 50% of boxes 2, but it somehow doesn't seem to work. this is as far as i got it working. .block { width: 100%; background: grey } .column { align-content: stretch; display: flex; flex-flow: column wrap; width: 50%; } .box_long { background-color: pink; flex: 0 0 50%; padding: 20px; border: solid 1px black; } .box_small {

susy 2.0 change columns at breakpoint

由 |▌冷眼眸甩不掉的悲伤 提交于 2019-12-01 10:47:31
I'm not using Compass I prefer to use Breakpoint.scss I'm on susy 2.0 I know there are lot of posts with this question but I'm having 0 luck finding any regarding Breakpoint.scss and Susy 2.0 on this topic. @import "susy"; @import "breakpoint"; $medium: 800px; $susy: ( columns: 6, gutters: 3/4, gutter-position: split ); @include breakpoint($medium) { $susy: layout(12 1/4 split); } body { @include container(show); @include breakpoint($medium) { @include container(show); } } Do I have to use susy-breakpoint or can something like this be achieved? I want 6 columns at anything at/below 800px and

Compass taking too long to compile

由 别来无恙 提交于 2019-12-01 08:36:43
Since updated to the latest version of Compass it now takes 4.294s to compile. I need this version of compass due to needed susy Running "sass:dist" (sass) task Running "watch" task Completed in 4.294s at Tue Sep 30 2014 23:38:01 GMT+0200 (W. Europe Daylight Time) - Waiting...` // Running versions compass -v 1.0.1 susy -v 2.1.3 sass -v 3.4.4 I compile with grunt: sass: { dist: { options: { style: 'compressed', require: 'susy', compass: true }, files: { '<%= yeoman.css %>/style.css': '<%= yeoman.sass %>/style.scss' } } } How can I speed up the compile time? Is it something wrong with my config?
订阅 susy-sass