Only one request, many bg images
A Pen by Sergio Forés on CodePen.
h1 { | |
@include type-setting(1); | |
font-weight: bold; | |
@include media(s2) { | |
@include type-setting(3); | |
} | |
@include media(s3) { | |
@include type-setting(4); | |
} | |
@include media(s5) { |
<script> | |
import { fade } from 'svelte/transition'; | |
import PageTitle from "../components/PageTitle.svelte"; | |
import Content from "../components/Content.svelte"; | |
import ContentArea from "../components/ContentArea.svelte"; | |
import Area from "../components/Area.svelte"; | |
import Banner from '../components/Banner.svelte'; | |
import BlockQuote from "../components/BlockQuote.svelte"; | |
import Cards from "../components/Cards.svelte"; | |
import Card from "../components/Card.svelte"; |
.site__header | |
.brand | |
a(href="#home") | |
svg(width='74', height='40', viewbox='0 0 74 40', xmlns='http://www.w3.org/2000/svg') | |
title Logo | |
g#Home(stroke='none', stroke-width='1', fill='none', fill-rule='evenodd') | |
g(transform='translate(-10 -5)', id='Brand/Logo', stroke='#111111') | |
path#decir(d='M47 25c0-10.493-8.059-19-18-19s-18 8.507-18 19h36z', stroke-width='1', stroke-linecap='square') | |
path#pensar(d='M83 25c0 10.493-8.059 19-18 19s-18-8.507-18-19h36z', stroke-width='1', fill='#111111', fill-rule='evenodd') | |
path#hacer(d='M47 25.5h36', stroke-width='3', stroke-linejoin='bevel') |
{ | |
"eneagrama": [ | |
"Dejar que la vida sea maestra, mejor que depender de los propios esquemas mentales de referencia.", | |
"Debe incorporar sus percepciones del mundo, identificándose con ellas en vez de observarlas tan sólo. No identificarse sólo con sus pensamientos, sino también con los objetos de los mismos.", | |
"Tiende a una necesidad neurótica por lo sublime, en lugar de por lo que hay, y una pasión por el conocimiento hermético.", | |
"Justificación personal: «sé, luego existo».", | |
"Comprende que no tiene que saber absolutamente todo antes de poder actuar: se aprende más actuando, siendo capaz de resolver problemas en la medida que surjan.", | |
"Aprende que es capaz de aportar algo valioso a los demás. Sus pensamientos adquieren expresión a través de la acción y el liderazgo. Muestra a los demás cómo hacer lo que sólo él sabe hacer. El valor práctico de sus ideas es incalculable.", | |
"Refugiado en su mente, anhela descubrir el por qué de las cosas, entendiendo cómo funciona el mundo en gen |
Only one request, many bg images
A Pen by Sergio Forés on CodePen.
// ---- | |
// Sass (v3.4.12) | |
// Compass (v1.0.3) | |
// ---- | |
$image-path: "../img/"; | |
/** | |
* Tracking double lists that you want to line up? |
// ---- | |
// Sass (v3.4.12) | |
// Compass (v1.0.3) | |
// ---- | |
$image-path: "../img/"; | |
$list: chia amaranto spiroulina camucamu canamo maca lucuma stevia quinoa alfalfa quinoa trigoverde algarroba cardomariano linodorado fresa coco gymtonic delifiber brainshake andeanprotein macuchino royalbreakfast; | |
@each $producto in $list { | |
.cpt-#{$producto} { | |
background-image: url(#{$image-path}bg-#{$producto}.svg); |
http://t0theme.sergiofores.net/pagina-ejemplo/ | |
<?php elseif(get_row_layout() == "posts_carrousel"): //Layout Carrusel ?> | |
<div class="row"> | |
<h3 class="h1"><?php the_sub_field("title"); ?></h3> | |
<h3><?php the_sub_field("description"); ?></h3> |
<?php | |
/** | |
* Extended Walker class for use with the | |
* Twitter Bootstrap toolkit Dropdown menus in Wordpress. | |
* Edited to support n-levels submenu. | |
* @author johnmegahan https://gist.github.com/1597994, Emanuele 'Tex' Tessore https://gist.github.com/3765640 | |
*/ | |
class BootstrapNavMenuWalker extends Walker_Nav_Menu { |
In this document I am using Sass's SCSS syntax. You can choose to use the indented syntax in sass, if you prefer it, it has no functional differences from the SCSS syntax.
For Less, I'm using the JavaScript version because this is what they suggest on the website. The ruby version may be different.