Skip to content

Instantly share code, notes, and snippets.

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] {
@shrekuu
shrekuu / dabblet.css
Created April 30, 2015 09:19 — forked from LeaVerou/dabblet.css
Typing animation with pure CSS.
/**
* Typing animation with pure CSS.
* Works best in browsers supporting the ch unit.
*/
@keyframes typing { from { width: 0; } }
@keyframes blink-caret { 50% { border-color: transparent; } }
h1 {
font: bold 200% Consolas, Monaco, monospace;
@shrekuu
shrekuu / install-go-lang-2.sh
Last active April 6, 2016 11:43
mac install go lang
#!/usr/bin/env sh
# As of 20130519, go 1.1 has been released.
# The proccess of the gist should be OK for go 1.1 .
# magic pause
function pause(){
read -p "$*"
}
@shrekuu
shrekuu / ip_in_range.php
Created December 10, 2015 04:56 — forked from tott/ip_in_range.php
php check if IP is in given network range
/**
* Check if a given ip is in a network
* @param string $ip IP to check in IPV4 format eg. 127.0.0.1
* @param string $range IP/CIDR netmask eg. 127.0.0.0/24, also 127.0.0.1 is accepted and /32 assumed
* @return boolean true if the ip is in this range / false if not.
*/
function ip_in_range( $ip, $range ) {
if ( strpos( $range, '/' ) == false ) {
$range .= '/32';
}
# Thanks to this post:
# http://blog.ikato.com/post/15675823000/how-to-install-consolas-font-on-mac-os-x
$ brew install cabextract
$ cd ~/Downloads
$ mkdir consolas
$ cd consolas
$ curl -O http://download.microsoft.com/download/f/5/a/f5a3df76-d856-4a61-a6bd-722f52a5be26/PowerPointViewer.exe
$ cabextract PowerPointViewer.exe
$ cabextract ppviewer.cab
@shrekuu
shrekuu / gradient.js
Last active May 11, 2017 10:21 — forked from siamak/gradient.js
Steps in Gradient
/**
* GradientArray • Steps gradient.
* @author Siamak Mokhtari <[email protected]>
* @date 06/21/16.
*/
class GradientArray {
// Convert a hex color to an RGB array e.g. [r,g,b]
// Accepts the following formats: FFF, FFFFFF, #FFF, #FFFFFF
hexToRgb(hex) {
let r, g, b, parts;
@shrekuu
shrekuu / form.html
Created May 11, 2017 10:27 — forked from siamak/form.html
Image Validator (Dimension) with javascript.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<h3>Image Validator: </h3>
@shrekuu
shrekuu / default
Created September 19, 2017 05:51 — forked from dtomasi/default
Brew Nginx PHP7
server {
listen 80;
server_name localhost;
root /Users/YOUR_USERNAME/Sites;
access_log /Library/Logs/default.access.log main;
location / {
include /usr/local/etc/nginx/conf.d/php-fpm;
}
@shrekuu
shrekuu / jenkins_ci_on_ubuntu.md
Created November 2, 2017 08:32 — forked from ostinelli/jenkins_ci_on_ubuntu.md
Setup Jenkins CI on Ubuntu.

Jenkins CI

Instructions on how to setup a secured Jenkins CI.

Install Jenkins

$ wget -q -O - https://jenkins-ci.org/debian/jenkins-ci.org.key | sudo apt-key add -
$ sudo sh -c 'echo deb http://pkg.jenkins-ci.org/debian binary/ > /etc/apt/sources.list$ .d/jenkins.list'
$ sudo apt-get update
$ sudo apt-get install jenkins
@shrekuu
shrekuu / nginx.conf
Created November 3, 2017 07:08 — forked from ashleydw/nginx.conf
Laravel nginx conf file
server {
listen 80 default_server;
server_name example.com www.example.com;
access_log /srv/www/example.com/logs/access.log;
error_log /srv/www/example.com/logs/error.log;
root /srv/www/example.com/public;
index index.php index.html;