felipefialho

desenvolvedor front-end jr

Trendi

(região da berrini, são paulo - sp)

• regime: CLT
• escolaridade: segundo grau completo
• conhecimento necessário:
  • html (3)
• css (3)

felipefialho

Teste para projetos responsivos

##Problema Testar/verificar a disposição dos elementos de uma determinada página em determinadas resoluções de tela.

Solução

Executar captura de telas de acordo com os viewports definidos em um script, com a ajuda do PhantomJS.

Necessário ter o node e o npm instalados

felipefialho

0 info it worked if it ends with ok
1 verbose cli [ 'c:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Users\\Felipe\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'install' ]
2 info using npm@3.5.3
3 info using node@v5.11.1
4 silly loadCurrentTree Starting
5 silly install loadCurrentTree
6 silly install readLocalPackageData
7 silly install normalizeTree

felipefialho

// ==================================================
// Smooth Scroll
// ==================================================

function smoothScroll(el, to, duration) {

  'use strict';

  if (duration < 0) {
    return;

felipefialho

// ==================================================
// IE Checker
// ==================================================

function isIE(userAgent) {
  userAgent = userAgent || navigator.userAgent;
  return userAgent.indexOf('MSIE ') > -1 || userAgent.indexOf('Trident/') > -1 || userAgent.indexOf('Edge/') > -1;
}

felipefialho

<section class="place">
  <div class="place__container">
    <h1>Lugares vistos recentemente</h1>
    <p>Continue de onde parou</p>

    <a class="card" href="#">
      <div class="card__main">
        <img src="" alt=""> 
        <h2>Hospedado por Luciana</h2>
        <p>Rio de Janeiro</p>

felipefialho

// The molecule
.card
  h2 
  ...

  p
  ...

  .price
  ...

felipefialho

Select on sametime the first element but not if it is the last element

&:first-child:not(:last-child)

👺

felipefialho

Easier way to delete branch local and remote

$ git branch -d [the_branch]
$ git push origin :[the_branch]

👽

felipefialho

Hide dynamic element that break the layout when it is empty.

&:empty
  display none

!important, it can't have space on HTML

✌️