css
Sass – colors
sass
funkcje kolorów w sass Darken & Lighten $color: #08baba $colorDarker: darken( $color, 20% ) $colorDark: darken( $color, 10% ) $colorLight: lighten( $color, 10% ) $colorLighter:...
less snippets
less
dodanie przeźroczystego koloru tła: .rgbaColorIn(@color, @opacity : 1){ @result: rgba( red(@color), green(@color), blue(@color), @opacity ); } .section { .rgbaColorIn(red, 50%);...
CSS Triangles
css
Trójkąty w css: .arrow-up { width: 0; height: 0; font-size: 0; line-height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent;...
Sass – mixin
sass
mixins - re-używalny kawałek kodu, aby nie powtarzać kodu - w myśl zasady Dont Repeat Yourself sass: @mixin warning { background-color: orange; color: #fff; &:hover {...
placeholder style i wartości
jQuery
taki sam placeholder dla każdego inputa w js: $(document).ready(function(){ $('form').find("input, input, textarea").each(function(ev) { if(!$(this).val()) {...
usunięcie defaultowych strzałek w select na IE
css form
aby usunąć defaultowe strzałki z elementu select w przeglądarce ie należy dodać w kodzie: select::-ms-expand { display:...
Nice form – stylizacja
css form
Wartość none dodana do pól formularza usuwa natywne formatowanie przeglądarki i pozwala na swobodne dodanie własnych styli dla wybranych elementów. -webkit-appearance:...
Waypoint
css
Dodanie fajnych animacji wjeżdżających bloków na stronie jest całkiem proste z wykorzystaniem Waypoints i Animate.css HTML: <div class="animated fade"...
Animacja i krzywe Bézier’a
css
parę fajnych narzędzi do zrozumienia i opracowania krzywej do animacji: cubic-bezier.com jasondavies.com/animated-bezier/...