Skip to content

Instantly share code, notes, and snippets.

View anpleenko's full-sized avatar
🏠
Working from home

Alexander Anpleenko anpleenko

🏠
Working from home
View GitHub Profile
@anpleenko
anpleenko / susy_config.scss
Last active January 12, 2018 09:55
Susy config
$susy: (
flow: ltr, // сменить дефолтное навправление колонок, можно задавать переменной и менять для арабских сайтов
math: fluid, // можно использовать static для неадаптивных сайтов (если вы такие еще делаете)
output: float, // используйте outside для исправлениях некоторых багов
gutter-position: after, // возможны разные варианты, например, before и inside
container: auto, // укажите максимальную ширину в любых единицах, например, 60em
container-position: center, // если вы хотите сделать не по центру, то можно использовать left и right
columns: 12, // количество колонок
gutters: .25, // ширина пробельчика для каждой колонки
column-width: false, // ширина колонки задается только при math: static
@anpleenko
anpleenko / config.rb
Last active August 29, 2015 14:13
Compass config
#- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
# в указаниях путей к папкам проекта должен использоваться знак "/"
# например main/static/css
#- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
# папка куда складывать css
#- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
css_dir = "css"
@anpleenko
anpleenko / _sprite.scss
Last active August 29, 2015 14:13
_sprite.scss
@charset "UTF-8";
//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
// по умолчанию папка где находятся спрайты, для этого файла настроек
// располагается в img/sprite, и компилируются в папку img
// импортируем стандартную утилиту Compsass для работы со спрайтами
//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
@import "compass/utilities/sprites";
@anpleenko
anpleenko / liActualSize.js
Last active August 29, 2015 14:13
jQuery liActualSize v 2.0
/**
* jQuery liActualSize v 2.0
* http://mmmagnit.ks.ua
*
* Copyright 2012, Linnik Yura
* Free to use
*
* Augest 2012
*/
@anpleenko
anpleenko / _position_mixin.scss
Last active August 29, 2015 14:14
[SASS] Position mixin
// миксин для сокращенной записи позиции блоков
//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
// миксин принимает до 3 аргументов:
// - position (relative, static, fixed, absolute) - не обязательный аргумент
// - coordinates (положительные и отрицательные числа, none) - обязательно
// - z-index (положительные и отрицательные числа) - не обязательный аргумент
//- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
// пример использования:
// @include position(absolute, 32 auto 5 4);
// @include position(32 auto 5 4, 34);
@anpleenko
anpleenko / _function_color.scss
Last active August 29, 2015 14:14
_function_color.scss
@function opacity($color, $opacity){
@return transparentize($color, $opacity);
}
@function black($opacity){
@return rgba(0,0,0, $opacity);
};
@function white($opacity){
@return rgba(255,255,255, $opacity);
@anpleenko
anpleenko / compass.bat
Created February 4, 2015 19:08
compass.bat
:: создаем папки проекта
MD img img\sprite scss css css\fonts js js\min scss\meta
:: создаем файлы в главной папке
'>index.html
'>config.rb
:: создаем scss файлы
'>scss\style.scss
'>scss\meta\_mixin.scss
@anpleenko
anpleenko / _palette_color.scss
Last active August 29, 2015 14:15
_palette_color.scss
$_color-base-grey: rgb(229,231,234);
$palettes: (
purple: (
base: rgb(42,40,80),
light: rgb(51,46,140),
dark: rgb(40,38,65)
),
grey: (
base: $_color-base-grey,
@anpleenko
anpleenko / index.html
Created February 26, 2015 19:46
100% Client Side Image Resizing
<!doctype html>
<html>
<head>
<title>JavaScript Image Resample :: WebReflection</title>
</head>
<body>
<input id="width" type="text" value="320" />
<input id="height" type="text" />
<input id="file" type="file" />
<br /><span id="message"></span><br />
$('form').submit(function(){
event.preventDefault();
var fd = new FormData($('.employee-file-form')[0]);
var btn = $(this).find('.js-upload-field-employee');
btn.button('loading');
$.ajax({
url: '/api/v3/upload_field_employees/',
type: 'POST',
data: fd,
cache: false,