Skip to content

Instantly share code, notes, and snippets.

@SvenPam
SvenPam / demo.cs
Created June 14, 2016 14:24
POST Multiple Images
[HttpPost]
public async Task<JsonResult> MyAction(IEnumerable<HttpPostedFileBase> files)
{
// Do stuff
...
return new JsonResult() { Data = 'Ok' };
}
@SvenPam
SvenPam / demo-output.css
Created July 8, 2016 11:26
Demoing the use of SASS loops to create a gradient coloured list.
li:nth-child(1) {
background-color: #92cc00; }
li:nth-child(2) {
background-color: #6d9900; }
li:nth-child(3) {
background-color: #496600; }
li:nth-child(4) {
@SvenPam
SvenPam / module-pattern-w-jquery.js
Last active January 25, 2017 15:21
Module Design Pattern for JS...because I always forget the template.
'use strict';
// Module description
var module = (function ($) {
function privateFunction()
return {
publicFunction: function () {
privateFunction();
}
}
@SvenPam
SvenPam / gulpfile.js
Created May 18, 2018 10:28
Gulp Tasks
/// <binding ProjectOpened='watch' />
/******************************************************
* PATTERN LAB NODE
* EDITION-NODE-GULP
* The gulp wrapper around patternlab-node core, providing tasks to interact with the core library and move supporting frontend assets.
******************************************************/
const
fs = require('fs'),
gulp = require('gulp'),
path = require('path'),
*,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:rgba(0,0,0,0)}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,system-ui,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:1.75rem}p{margin-top:0;margin-bottom:1.8rem}abbr[data-original-title],abbr[title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd
@SvenPam
SvenPam / font-face.css
Created November 18, 2018 21:00
Font Face Ordering
@font-face {
font-family: 'my-font';
src: url('regular.woff2') format('woff2'), url('regular.woff') format('woff'), url('regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@SvenPam
SvenPam / font-min.js
Last active November 19, 2018 11:49
Gulp Font Minification
// $ comes from using gulp-load-plugins.
gulp.task('assets:font', function () {
return gulp.src(`${paths.source.fonts}/**/*.ttf`)
.pipe($.changed('./'))
.pipe($.fontmin({
text: "1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`abcdefghijklmnopqrstuvwxyz{|}\/~¡¢£¤¥¦§¨©ª«¬®¯°±²³´µ·¸¹º»¼½¾¿ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÚÛÜÝÞßàáâãäåæçèéêëìíîïðñòóôõö÷øùúûüýþÿĀāĂ㥹ĆćĈĉĊċČčĎďĐđĒēĔĕĖėĘęĚěĜĝĞğĠġĢģĤĥĦħĨĩĪīĬĭĮįİıIJijĴĵĶķĸĹĺĻļĽľĿŀŁłŃńŅņŇňʼnŊŋŌōŎŏŐőŒœŔŕŖŗŘřŚśŜŝŞşŠšŢţŤťŦŧŨũŪūŬŭŮůŰűŲųŴŵŶŷŸŹźŻżŽž,“”‘’", //Basic Latin & Latin Extended
hinting: false,
quiet: false
}))
.pipe($.ttf2woff2())
@SvenPam
SvenPam / font-minification-webpack.js
Last active November 19, 2018 09:21
Font Minifification - Webpack
let fontmin = new Fontmin()
.use(
Fontmin.glyph({
text: `1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_'abcdefghijklmnopqrstuvwxyz?&{|}\/~¡¢£¤¥¦§¨©ª«¬®¯°±²³´µ·¸¹º»¼½¾¿ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÚÛÜÝÞßàáâãäåæçèéêëìíîïðñòóôõö÷øùúûüýþÿĀāĂ㥹ĆćĈĉĊċČčĎďĐđĒēĔĕĖėĘęĚěĜĝĞğĠġĢģĤĥĦħĨĩĪīĬĭĮįİıIJijĴĵĶķĸĹĺĻļĽľĿŀŁłŃńŅņŇňʼnŊŋŌōŎŏŐőŒœŔŕŖŗŘřŚśŜŝŞşŠšŢţŤťŦŧŨũŪūŬŭŮůŰűŲųŴŵŶŷŸŹźŻżŽž,“”‘’`
})
)
.use(ttf2woff2())
.use(Fontmin.ttf2woff())
.src(`${plConfig.paths.source.fonts}/**/*.ttf`)
.dest(plConfig.paths.public.fonts);
@SvenPam
SvenPam / svg-sprite-gulp.js
Last active November 19, 2018 11:49
SVG Sprites - Gulp
// $ comes from using gulp-load-plugins.
gulp.task('assets:sprites', function () {
return gulp.src(`${paths.source.images}/icon/**/*.svg`)
.pipe($.changed('./'))
.pipe($.svgSprite({
shape: {
spacing: {
padding: 2
}
},
@SvenPam
SvenPam / bem-sass.scss
Created November 20, 2018 22:11
SASS & BEM
$blockName: 'product';
.#{$blockName} {
//...
&__price {
// ...
&--dicount {
// ...
}