Skip to content

Instantly share code, notes, and snippets.

View JuanMaRuiz's full-sized avatar
💭
📚Learning

JuanMa Ruiz JuanMaRuiz

💭
📚Learning
9 followers · 21 following
View GitHub Profile
@JuanMaRuiz
JuanMaRuiz / bookmarklet.js
Last active December 27, 2015 00:18 — forked from LaboratorioEfe5/Access WP admin bookmarklet
javascript:(function(){host=window.location.hostname;window.open("http://"+host+"/wp-admin");})()
@JuanMaRuiz
JuanMaRuiz / comandos-git.md
Last active August 20, 2019 22:21
Comandos de git
@JuanMaRuiz
JuanMaRuiz / Scrollbar.css
Last active August 31, 2019 02:20
Customize the scrollbar of the web like Gmail with only css. [Chrome and Safari]
::-webkit-scrollbar {
background: transparent;
overflow: visible;
width: 17px;
}
::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2);
border: solid #fff;
}
@JuanMaRuiz
JuanMaRuiz / mobile-elements.md
Last active December 31, 2015 15:59
Several tips for a better mobile styling
@JuanMaRuiz
JuanMaRuiz / custom-input-file.css
Last active January 3, 2016 02:39
Without Javascript or jQuery it's possible customize the style for <input type="file" />. It's only available in -webkit. For more information and examples checkout: http://kcy.me/xfjd // http://kcy.me/xfje
.myClass::-webkit-file-upload-button {
visibility: hidden;
}
.myClass::before {
content: 'Select some files';
display: inline-block;
background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
border: 1px solid #999;
border-radius: 3px;
padding: 5px 8px;
@JuanMaRuiz
JuanMaRuiz / custom-select.css
Last active August 29, 2015 13:56
Custom select without background (well not really) but works properly on IE8.
/* For custom select without background (well not really) but works properly on IE8 */
.select-input {
height: 38px;
border-radius: 5px;
border: 1px solid #b3b3b3;
background: #fff url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBvbHlnb24gcG9pbnRzPSI4LDAgMyw2IDEzLDYiIGZpbGw9IiM0NDQiLz48cG9seWdvbiBwb2ludHM9IjgsMCAzLDYgMTMsNiIgZmlsbD0iIzQ0NCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTYsIDE1KSByb3RhdGUoLTE4MCkiLz48L3N2Zz4=);
font-size: 15px;
font-size: 1.071rem;
line-height: 1.25em;
padding: 0.5em 1.2em 0.5em 0; /* 8px */
@JuanMaRuiz
JuanMaRuiz / Gruntfile.js
Last active August 29, 2015 13:57
Gruntfile.js default configuration
module.exports = function(grunt) {
grunt.initConfig({
less: {
development: {
options: {
paths: ["./css"],
compress: false
},
files: {
@JuanMaRuiz
JuanMaRuiz / ie-version.js
Created April 30, 2014 10:47
Simple code for testing ie version with jQuery. Based on htm5 conditional headers.
/* $HTML-CONDITIONAL-HEADER
<!--[if lt IE 7 ]> <html class="ie ie6 no-js" lang="es"> <![endif]-->
<!--[if IE 7 ]> <html class="ie ie7 no-js" lang="es"> <![endif]-->
<!--[if IE 8 ]> <html class="ie ie8 no-js" lang="es"> <![endif]-->
<!--[if IE 9 ]> <html class="ie ie9 no-js" lang="es"> <![endif]-->
<!--[if gt IE 9]><!--><html class="no-js" lang="es"><!--<![endif]-->
<!-- the "no-js" class is for Modernizr. -->
*/
@JuanMaRuiz
JuanMaRuiz / css-techniques.md
Last active August 29, 2015 14:02
Some useful CSS3 techniques.

#Some CSS3 techniques

Shadow with CSS for png images

Extract from

If you want to create a shadow for a png image, no matter what form has. You can do it applying the css filter -webkit-filter.

Original image:

@JuanMaRuiz
JuanMaRuiz / add-option-to-dropdown.js
Last active August 29, 2015 14:11 — forked from paulund/add-option-to-dropdown.js
$("#selectBox").append('<option value="option6">option6</option>');