Skip to content

Instantly share code, notes, and snippets.

View JuanMaRuiz's full-sized avatar
💭
📚Learning

JuanMa Ruiz JuanMaRuiz

💭
📚Learning
11 followers · 21 following
View GitHub Profile
@JuanMaRuiz
JuanMaRuiz / server.js
Last active June 6, 2016 21:54
How to initialize a simple node server with express.
/* First all you need too install express as a dependency
* $ npm i express --save
* For more information about express visit http://expressjs.com/
*/
var express = require('express');
var app = express();
// __dirname + '/' refers to the folder you have created index.html
app.use('/', express.static(__dirname + '/'));
@JuanMaRuiz
JuanMaRuiz / path variable with sass
Created February 11, 2016 15:01
// The path for our ionicons font files, relative to the built CSS in www/css
$ionicons-font-path: "../lib/ionic/fonts" !default;
src:url("#{$ionicons-font-path}/ionicons.eot?v=#{$ionicons-version}");
@JuanMaRuiz
JuanMaRuiz / front-end-curriculum.md
Created January 22, 2016 20:06 — forked from stevekinney/front-end-curriculum.md
Front-end Curriculum Draft

Module 1

  • Semantic markup
  • HTML standards mode and quirks mode
  • HTML fundamentals
    • Classes and IDs
  • CSS fundamentals
    • Selectors
    • Resets and normalizers
    • The box model
@JuanMaRuiz
JuanMaRuiz / learning_resources.md
Last active May 9, 2018 19:15 — forked from nathansmith/web-design-development-learning-resources.md
Resources for learning web design & front-end development
@JuanMaRuiz
JuanMaRuiz / media-query-dpi.css
Last active May 1, 2021 14:17
Retina Display Media Query for high DPI aware devices. (1.3dpr, 1.5dpr, 2dpr, 3dpr)
/* Device pixel densities based on: */
/* - Test for CSS by @marcedwards from @bjango */
/* (http://bjango.com/articles/min-device-pixel-ratio/) */
/* - Retina Display Media Query */
/* (https://css-tricks.com/snippets/css/retina-display-media-query/)*/
/* 1.25 dpr */
@media
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi){
@JuanMaRuiz
JuanMaRuiz / .gitconfig
Last active August 29, 2015 14:14 — forked from oldlastman/.gitconfig
[alias]
co = checkout
pd = push origin develop
st = -p status
cm = commit
w = whatchanged
last = cat-file commit HEAD
lg = log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit
ls = show --pretty="format:" --name-only
alias = ! git config --get-regexp ^alias\\. | sed -e s/^alias\\.// -e s/\\ /\\ =\\ /
@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>');
@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 / 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 / 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: {