clovisdasilvaneto

<link rel="stylesheet" type="text/css" href="yourpath/all-animation.css" />
<script type="text/javascript" src="yourpath/jquery.js"></script>

clovisdasilvaneto

$(".anny-class").click(function(){
 $("#animation").addClass("journal");
});

clovisdasilvaneto

<div id="animation"></div>
<button class="anny-class">Trigger class, go!</button>

clovisdasilvaneto

$("#animation").removeClass("journal").addClass("four-rock"); 

clovisdasilvaneto

Como escrever seu CSS para projetos mobile-first

Rápido e fácil (Garanto!)

Desenvolver sites responsivos hoje em dia é requisito para desenvolvedores front-end, quando falamos em responsivo você logo lembra em Mobile-first mesmo nunca tendo feito um projeto usando a abordagem. A algum tempo venho lendo, estudando e testando o conceito mobile-first, mas na grande maioria os artigos e exemplos que vejo, abordam como desenvolver site ou aplicação web em relação a planejamento e design, não falam sobre codificação para o mobile-first, mas agora este artigo vai mostra a você como pensar seu código CSS para mobile.

Conceito Mobile-first para CSS

Quando você usa o conceito mobile-first para fazer seu estilo CSS significa dizer que os estilos são aplicados primeiro para dispositivos moveis, só então são aplicados substituições, estilo avançados e consultas de media queries para telas maiores. No mobile-first styling você utiliza a propriedade min-width nas consultas de media queries. “Nos exemplos vou

clovisdasilvaneto

- blog
---- index.js
---- package.json
---- src
     |---- index.md
     |---- blog
          |--- post-1.md
          |--- post-2.md
---- templates
      |-- index.hbt

clovisdasilvaneto

var samples = [{
  '000000000000080000000001': 1, //Order
  '000000000000080000000002': 0, //Column    1
  '000000000000080000000003': 0, //Section
},{
  '000000000000080000000001': 0, //Order
  '000000000000080000000002': 0, //Column    2
  '000000000000080000000003': 0, //Section
},{
  '000000000000080000000001': 0, //Order

clovisdasilvaneto

	Liferay.component(
			name,
			function() {

				var datepicker = new A.DatePicker({
					trigger: '#' + inputId,
					mask: '%d/%m/%Y',
					popover: {
						zIndex: 1
					},

clovisdasilvaneto

var gulp = require('gulp'),

    sass = require('gulp-sass')
,
    notify = require("gulp-notify")
,
    uglify = require('gulp-uglify'),
    concat = require('gulp-concat');

var config = {
    jsPath: './js/modules',
    jsCompressPath: './js/build/compress',

    sassPath: './scss',

clovisdasilvaneto

imageCDNService.upload(this.files[0]).then(function(data){
    $scope.pet.public_id = data.public_id;
    $scope.pet.image = data.url;

    $ionicLoading.hide();
})