Skip to content

Instantly share code, notes, and snippets.

View theonesean's full-sized avatar

Sean Bailey theonesean

View GitHub Profile
@danilosetra
danilosetra / pseudo-elements.md
Created March 27, 2021 03:47 — forked from alwayrun/pseudo-elements.md
A CSS pseudo-element is used to style specified parts of an element. In some cases you can style native HTML controls with vendor specific pseudo-elements. Here you will find an list of cross browser specific pseudo-element selectors.

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;
}

video /deep/ input[type=range] {
@defenestrator
defenestrator / awesome_favorite_fizzbuzz.js
Last active May 17, 2022 04:45
Some Fizzbuzz for meditation
// This one is interesting because no previously checked condition is re-checked
// It is a self-executing function that contains a declarative function named fizzbuzz() and a for loop
// Too much fun
(function() {
function fizzbuzz(i) {
const test = (d, s, x) => i % d == 0 ? _ => s + x('') : x
const fizz = x => test(3, 'Fizz', x)
const buzz = x => test(5, 'Buzz', x)
console.log(fizz(buzz(x=>x))(i.toString()))
}
@defenestrator
defenestrator / package.json
Last active June 30, 2022 13:52
Laravel Tailwind and Svelte 3: simple configuration.
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
@ctkjose
ctkjose / readme.md
Last active March 15, 2024 14:10 — forked from WebReflection/jsc
JavaScriptCore for macOS and Linux

JSC

JSC is the JavaScript engine from Apple's JavaScriptCore (WebKit) as a console application that you can use to run script in the terminal.

For more info visit the JSC's webkit wiki page.

Adding a shortcut to JSC

Using jsc is simple, the one issue is that Apple keeps changing the location for jsc. To deal with this issue I just create a symbolic link to the binary:

@JoeyBurzynski
JoeyBurzynski / 55-bytes-of-css.md
Last active June 2, 2024 11:24
58 bytes of css to look great nearly everywhere

58 bytes of CSS to look great nearly everywhere

When making this website, i wanted a simple, reasonable way to make it look good on most displays. Not counting any minimization techniques, the following 58 bytes worked well for me:

main {
  max-width: 38rem;
  padding: 2rem;
  margin: auto;
}
@lopspower
lopspower / README.md
Last active June 15, 2024 11:53
Hexadecimal color code for transparency

Hexadecimal color code for transparency

Twitter

How to set transparency with hex value ?

For example, you want to set 40% alpha transparence to #000000 (black color), you need to add 66 like this #66000000.

Download This sample on Google Play Store

@d33pfri3d
d33pfri3d / statelist.html
Created August 25, 2012 19:44
Datalist of US States
<datalist id="statelist">
<option value="Alabama"></option>
<option value="Alaska"></option>
<option value="Arizona"></option>
<option value="Arkansas"></option>
<option value="California"></option>
<option value="Colorado"></option>
<option value="Connecticut"></option>
<option value="Delaware"></option>
<option value="District of Columbia"></option>