CodeMyUI

Efficient Scroll Zoom

This method utilizes the Intersection Observer to zoom the image only when it is in view. This cuts down on the processing power required for this effect.

A Pen by Chris Weissenberger on CodePen.

License.

CodeMyUI

<div class="slider">
    <input type="range" min="1" max="100" value="50">
</div>

<!-- twitter / dribbble -->
<a class="dribbble" href="https://dribbble.com/shots/8424211-Smoke-Slider" target="_blank"><img src="https://dribbble.com/assets/logo-small-2x-9fe74d2ad7b25fba0f50168523c15fda4c35534f9ea0b1011179275383035439.png" alt=""></a>
<a class="twitter" target="_blank" href="https://twitter.com/aaroniker_me"><svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" viewBox="0 0 72 72"><path d="M67.812 16.141a26.246 26.246 0 0 1-7.519 2.06 13.134 13.134 0 0 0 5.756-7.244 26.127 26.127 0 0 1-8.313 3.176A13.075 13.075 0 0 0 48.182 10c-7.229 0-13.092 5.861-13.092 13.093 0 1.026.118 2.021.338 2.981-10.885-.548-20.528-5.757-26.987-13.679a13.048 13.048 0 0 0-1.771 6.581c0 4.542 2.312 8.551 5.824 10.898a13.048 13.048 0 0 1-5.93-1.638c-.002.055-.002.11-.002.162 0 6.345 4.513 11.638 10.504 12.84a13.177 13.177 0 0 1-3.449.457c-.846 0-1.667-.078-2.465-.231 1.667 5.2 6.499 8.986 12.23 9.09a26.276 26.276 0 0 1-16.26 5.

CodeMyUI

<div class="wrapper">
  <input type="checkbox">
  <div class="video">
    <video src="https://www.robmillsarchitects.com/files/land/city/RMA_Web_land_city_1.mp4" loop muted autoplay></video>
  </div>
  <div class="text">
    <span data-text="Watch the video"></span>
  </div>
</div>

CodeMyUI

<div class="container">
  
  <div class="range-slider">
    <span id="rs-bullet" class="rs-label">0</span>
    <input id="rs-range-line" class="rs-range" type="range" value="0" min="0" max="200">
    
  </div>
  
  <div class="box-minmax">
    <span>0</span><span>200</span>

CodeMyUI

<button>
  
<svg viewBox="0 0 242 109" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <g class="ears">
    <g class="ear-left">
      <ellipse class="ear-left-outer" transform="matrix(0.9391 -0.3436 0.3436 0.9391 -3.6062 17.8444)" cx="48.5" cy="19.1" rx="11.4" ry="13.8"/>
      <ellipse class="ear-left-inner" transform="matrix(0.9391 -0.3436 0.3436 0.9391 -3.8876 17.4659)" cx="47.3" cy="19.7" rx="7.3" ry="11.2"/>
    </g>
    <g class="ear-right">
      <ellipse class="ear-right-outer" transform="matrix(0.3436 -0.9391 0.9391 0.3436 106.5379 189.869)" cx="189.1" cy="18.7" rx="14.4" ry="11.9"/>

CodeMyUI

:ruby
  @items = [
    { :t => 'X-rays', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-xrays.png' },
    { :t => 'Worms', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-worms.png' },
    { :t => 'Aurora', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-aurora.png' },
    { :t => 'Angus', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-angus.png' },
    { :t => 'Huitzi', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-huitzi.png' },
    { :t => 'Dalí', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-dali.png' },
    { :t => 'The Bride', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-bride.png' },
    { :t => 'The Man', :i => 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/9473/i-man.png' },

CodeMyUI

div.container.positions
   h2 Job Openings
   ul
      li.pos-card#pos_1
         div.content
            div.title.new UI/UX Designer
            div.dept Design
            div.date June 4
            div.refer Refer
         ul.desc

CodeMyUI

<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
<h1>Tiny CSS3 breadcrumb</h1>
  
<ul class="breadcrumb">
  <li>
    <a href="#">
      <span class="icon icon-file"></span>
      <span class="text">file</span>
    </a>
  </li>

amamarul

Como hacer login con username en lugar de por email

El controlador App\Http\Controllers\Auth\LoginController implementa el trait AuthenticatesUsers y este es el encargado de realizar la validación del Login. El método validateLogin() valida el campo email por defecto pero este lo obtiene del método username() que retorna el campo email por eso si lo que queremos es validar el login por otro campo (En este ejemplo será el campo 'username') debemos:

1- En la migracion de la tabla users (2014_10_12_000000_create_users_table.php) agregar el campo username es importante que este sea de tipo unique

Schema::create('users', function (Blueprint $table) {
    $table->increments('id');
    $table->string('username')->unique();

$table->string('name');