Skip to content

Instantly share code, notes, and snippets.

View jupegarnica's full-sized avatar
🔍

Garn jupegarnica

🔍
View GitHub Profile
@jupegarnica
jupegarnica / layout-responsive-table.scss
Last active December 22, 2020 08:11
layout-responsive-table.scss
body {
display: grid;
height: 100vh;
grid-gap: 1rem;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
@jupegarnica
jupegarnica / index.html
Last active December 22, 2020 08:09
layout-sidebars.scss
<header><h1 contenteditable>Header.com</h1></header>
<div class="left-sidebar" contenteditable>Left Sidebar</div>
<main contenteditable></main>
<div class="right-sidebar" contenteditable>Right Sidebar</div>
<footer contenteditable>Footer Content — Header.com 2020</footer>
@jupegarnica
jupegarnica / layout-full_height.scss
Last active December 22, 2020 08:08
layout-full_height.scss
.main {
display: grid;
height: 100vh;
grid-template-rows: auto 1fr auto;
}
@jupegarnica
jupegarnica / layout-wrap.scss
Last active December 22, 2020 08:08
layout-wrap.scss
.parent {
display: flex;
flex-wrap: wrap;
}
.child {
// flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]
// If we don't want the items to stretch:
flex: 0 1 300px;
// If we do want the items to stretch:
@jupegarnica
jupegarnica / style.scss
Last active December 22, 2020 08:05
layout-center.css
.parent {
display: grid;
place-items: center;
}
@jupegarnica
jupegarnica / flappy.html
Created December 19, 2020 07:51 — forked from gullyn/flappy.html
Flappy bird in 205 bytes (improved!)
<body onload=z=c.getContext`2d`,setInterval(`c.width=W=150,Y<W&&P<Y&Y<P+E|9<p?z.fillText(S++${Y=`,9,9|z.fillRect(p`}*0,Y-=--M${Y+Y},P+E,9,W),P))):p=M=Y=S=6,p=p-6||(P=S%E,W)`,E=49) onclick=M=9><canvas id=c>
@jupegarnica
jupegarnica / custom-template.css
Created December 18, 2020 15:04
:root {
/* Colors */
--color-background: white;
--color-text: #333;
--color-text-muted: #777;
--color-border: #eee;
--color-primary: hsl(210, 70%, 50%);
--color-background-faded: #f2f2f2;
@jupegarnica
jupegarnica / reset.css
Created December 18, 2020 14:54
/**
* Resets
*
* Global resets to common HTML elements.
* Doesn't depend on any third party libraries.
* Inspired by Normalise.css and bootstrap/_reboot.scss
* Doesn't reset form and table because it's hard to set styles back in third-party libraries
*/
/* #region html and body */
@jupegarnica
jupegarnica / wait-async.ts
Created December 7, 2020 08:22
export const wait = (delay: number) =>
new Promise((res) => setTimeout(res, delay));
@jupegarnica
jupegarnica / move-and-rename.sh
Created December 2, 2020 07:53
#!/bin/bash
# FILES=./files/*
TARGET=./new # make sure that folder exists!
COUNTER=1 # if you want to start from 0, just put 0 there
for f in $(ls -t files/*)
do
echo "Processing $f file..."
mv -i $f $TARGET/$COUNTER"___"${f##*/}
let "COUNTER++"