alizhdanov

/* Base */
body {
    color: green;
    font-family: "Georgia", serif;
    font-size: 24px;
    line-height: 1.5;
}

[role="button"],
input[type="submit"],

alizhdanov

/* ----------------------------------------------------------------------------------------------------
Super Form Reset
A couple of things to watch out for:
- IE8: If a text input doesn't have padding on all sides or none the text won't be centered.
- The default border sizes on text inputs in all UAs seem to be slightly different. You're better off using custom borders.
- You NEED to set the font-size and family on all form elements
- Search inputs need to have their appearance reset and the box-sizing set to content-box to match other UAs
- You can style the upload button in webkit using ::-webkit-file-upload-button
- ::-webkit-file-upload-button selectors can't be used in the same selector as normal ones. FF and IE freak out.
- IE: You don't need to fake inline-block with labels and form controls in IE. They function as inline-block.

alizhdanov

$('select').each(function(){
        var $this = $(this), 
        	numberOfOptions = $(this).children('option').length;
      
        $this.addClass('select-hidden'); // скрываем селект
        $this.wrap('<div class="select"></div>'); // оборачиваем селект в див
        $this.after('<div class="select-styled"></div>'); // после селекта добавляем класс который иммитирует сам селект

        var $styledSelect = $this.next('div.select-styled'); // выбираем иммитирующий селект блок
        $styledSelect.text($this.children('option').eq(0).text()); // добавляем ему текст от первого option'a

alizhdanov

­
example:
  text­text­text­
thanks http://www.quirksmode.org/oddsandends/wbr.html

alizhdanov

text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;

alizhdanov

function isNumeric(n) {
  return !isNaN(parseFloat(n)) && isFinite(n);
}

alizhdanov

var scrollHeight = Math.max(
  document.body.scrollHeight, document.documentElement.scrollHeight,
  document.body.offsetHeight, document.documentElement.offsetHeight,
  document.body.clientHeight, document.documentElement.clientHeight
);

alizhdanov

function scrollTo(element, to, duration) {
  if (duration < 0) return;
  var difference = to - element.scrollTop;
  var perTick = difference / duration * 2;

	setTimeout(function() {
	    element.scrollTop = element.scrollTop + perTick;
	    scrollTo(element, to, duration - 2);
	}, 10);
}

alizhdanov

// single-line solution
$('body').css('background-position', 'center ' + (-window.pageYOffset / 8) + 'px');

// more advanced solution
$('.paralax').each(function() {
        var position = (-window.pageYOffset) + $(this).offset().top

        position = -(position / 8)

        if (position >= ($(this).height() + $(this).height() / 2)) {

alizhdanov

 gulp.task('images-webp', function () {
     return gulp.src('./public/assets/img/**/*.{jpg,png}')
         .pipe(webp())
         .pipe(gulp.dest('./public/assets/img/'))
         .pipe(gulp.dest('./public/assets/img/'));
 });
 
 gulp.task('images-webp-posts', function () {
     return gulp.src('./public/files/post/**/*.{jpg,png}')
         .pipe(webp())