Dmitry Pashkovets ciases

## git-zip-changed-files.md

      
              1 file
            
          
              2 forks
            
          
              5 comments
            
          
              10 stars
            
          
                ciases
                / git-zip-changed-files.md
            
            
              Last active
              March 23, 2024 16:37
            
              
                Git: zip changed files + diff
              
          
    GIT: zip changed files + diff

Create zip archive with changed files

git archive -o update.zip HEAD $(git diff --name-only <starting SHA> HEAD)
or


## touch-device-detect.js
if (!("ontouchstart" in document.documentElement)) {
    document.documentElement.className += " no-touch";
}

## readme.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                ciases
                / readme.md
            
            
              Created
              April 11, 2016 14:03
            
              
                Bootstrap Sass Installation and Customization
              
          
    Bootstrap Sass Installation and Customization


run bower install bootstrap-sass inside project root
copy _variables.scss to sass forder, rename it to _customVariables.scss
add imports to main.scss:

@import "customVariables";
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap";

  
## parallax-scroll.js
// https://bolt.cm/

// MAKE TOPIMAGE SCROLL SLOWER FOR PARALLAX EFFECT
$(window).scroll(function () {
    $('header').css('backgroundPosition', '0px ' + (posTop() / 2) + 'px');
});

// FIX FOR SCROLLPOS IN ALL BROWSERS
function posTop() {
    return typeof window.pageYOffset != 'undefined' ? window.pageYOffset: document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop? document.body.scrollTop:0;

## gulpfile.js
'use strict';

var gulp = require('gulp');
var less = require('gulp-less');
var sourcemaps = require('gulp-sourcemaps');
var browserSync = require('browser-sync').create();
var rigger = require('gulp-rigger');
var autoprefixer = require('gulp-autoprefixer');

// variant 1: without `return`

## gulpfile.js
// Usage:
// $ npm install gulp browser-sync --save-dev
// $ gulp serve

'use strict';

var gulp = require('gulp');
var browserSync = require('browser-sync').create();

gulp.task('serve', function() {

## button.html
<style>
.btn-file {
  position: relative;
  overflow: hidden;
}
.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;

## convert.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                ciases
                / convert.md
            
            
              Last active
              September 2, 2016 08:56
            
              
                Use ImageMagick to create optimised and progressive JPGs
              
          
    Use ImageMagick to create optimised and progressive JPGs

Use the following command to optimise a JPG and make it progressive:
$ convert -strip -interlace Plane -quality 80 input-file.jpg output-file.jpg
Batch all the images in a folder like this:
$ for i in source/images/backgrounds/*.jpg; do convert -strip -interlace Plane -quality 80 $i $i; done

  
## svg-animation.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>

  <style>

    .path {

## image-optimization.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                ciases
                / image-optimization.md
            
            
              Created
              January 25, 2017 08:32
            
              
                Image optimization tools (online, offline)
              
          
    There are also online tools which can help you optimize your pictures with loss of quality, by performing safe automatic tasks:

Yahoo! Smush.it is the most well-know: http://www.smushit.com/ysmush.it/
Kraken is another which at times can give better results, and has Firefox and Chrome extensions: http://kraken.io/
Image Optimizer enables you to also change the size of the file: http://www.imageoptimizer.net/

If you are at ease with command line tools, you can use these:

Pngnq: converts 24-bit PNG files into 6 to 8-bit ones, by only keeping the needed colors.
Download:
	if (!("ontouchstart" in document.documentElement)) {
	document.documentElement.className += " no-touch";
	}
	// https://bolt.cm/

	// MAKE TOPIMAGE SCROLL SLOWER FOR PARALLAX EFFECT
	$(window).scroll(function () {
	$('header').css('backgroundPosition', '0px ' + (posTop() / 2) + 'px');
	});

	// FIX FOR SCROLLPOS IN ALL BROWSERS
	function posTop() {
	return typeof window.pageYOffset != 'undefined' ? window.pageYOffset: document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop? document.body.scrollTop:0;
	'use strict';

	var gulp = require('gulp');
	var less = require('gulp-less');
	var sourcemaps = require('gulp-sourcemaps');
	var browserSync = require('browser-sync').create();
	var rigger = require('gulp-rigger');
	var autoprefixer = require('gulp-autoprefixer');

	// variant 1: without `return`
	// Usage:
	// $ npm install gulp browser-sync --save-dev
	// $ gulp serve

	'use strict';

	var gulp = require('gulp');
	var browserSync = require('browser-sync').create();

	gulp.task('serve', function() {
	<style>
	.btn-file {
	position: relative;
	overflow: hidden;
	}
	.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>JS Bin</title>

	<style>

	.path {