Designer News
Where the design community meets.
Lead Developer Front Joined over 9 years ago via an invitation from Chris F.
"Currently, Takana only supports OSX and Sublime Text 2 & 3."
Bon je suis plus à l'aise en français ;).
Le site pèse 11.9MB, d'où le temps de chargement. Peut-être essayer de réduire la qualité des mp4, ou les charger uniquement lorsqu'on est à la section précédente (par exemple charger le mp4 Invictus lorsqu'on est sur défi ingénieurs).
http://louisansa.com/project/defi-ingenieurs -> Ici j'ai chargé 12.3MB. Du coup par exemple je sais pas si c'est nécessaire de préloader les vidéos.
Mais à part ça c'est de l'excellent boulot. Un peu chargé en animations, mais c'est juste bandant.
Bravo.
This is really sick. Seriously. But too much time to load the content. http://louisansa.com/project/misc-animations -> I'm having some fps issues with the gifs, and I Have a 16gb core i7 Nvidia 770 Computer :/.
Hi.
Here how I understand it :
Flexible.gs is a 1 to 24 based columns grid. So when you use "xl-24-6", it means "For large screeen, this div have a 6/24 width (which mean 1/4 too)"
Look at the code of this : http://flexible.gs/example.html . You will understand.
If you're a designer learning to code, I recommand you webflow. Very powerful to design website with a good interface.
Hi,
Using Foundation with Sass and Bourbon, I'm doing it like that, better for maintenance in my opinion :
.class{ attr1: prop; attr2:prop; @media #{$medium-up} { attr1: prop; attr2:prop; } @media #{$large-up} { attr1: prop; attr2:prop; } }
Here is variables Foundation is using, if you don't use Foundation :
//Media Query Ranges $small-range: (0em, 40em); $medium-range: (40.063em, 64em); $large-range: (64.063em, 90em); $xlarge-range: (90.063em, 120em); $xxlarge-range: (120.063em); // RANGES // We use these functions to define ranges for various things, like media queries. @function lower-bound($range){ @if length($range) <= 0 { @return 0; } @return nth($range,1); } @function upper-bound($range) { @if length($range) < 2 { @return 999999999999; } @return nth($range, 2); } $screen: "only screen"; $landscape: "#{$screen} and (orientation: landscape)"; $portrait: "#{$screen} and (orientation: portrait)"; $small-up: $screen; $small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})"; $medium-up: "#{$screen} and (min-width:#{lower-bound($medium-range)})"; $medium-only: "#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})"; $large-up: "#{$screen} and (min-width:#{lower-bound($large-range)})"; $large-only: "#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})"; $xlarge-up: "#{$screen} and (min-width:#{lower-bound($xlarge-range)})"; $xlarge-only: "#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})"; $xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})"; $xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";
In the class itself :
.class{ property1:value; property2:value; @media{ //320px up; } @media{ //640px up; } }I just LOVE that trick to simulate a radial percentage. Good job !
Skyrim GTA :D Counter Strike Source :DD
Thanks, but, when I'm designing something, I don't want to have results thats some users don't.
To fix poor rendering on Chrome, especially when importing webfonts, place the svg declaration BEFORE the woff declaration in your css.
Chrome is more sexy using svg fonts.
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
By the way guys what do you think about the way that he create a module for every action for CRUD like "categories.bookmars.edit", I find that a little too much detailed