JMT Alimentation Animal
Project version : 1.0.3

Nav Breadcrumb 

<nav class="nav-breadcrumb">
    <p>
        <span>
         <span>
            <a href="#">Nos produits</a>
            <i class="icon icon--chevron-right-red"></i>
            <span>
               <a href="#">Chiens</a>
               <i class="icon icon--chevron-right-red"></i>
               <span>
                  <a href="#"> Alimentations</a>
                  <i class="icon icon--chevron-right-red"></i>
                  <span class="breadcrumb_last" aria-current="page">Croquettes</span>
        </span>
        </span>
        </span>
        </span>
    </p>
</nav>
 
<nav class="nav-breadcrumb">
   <p>
      <span>
         <span>
            <a href="#">Nos produits</a>
            <i class="icon icon--chevron-right-red"></i>
            <span>
               <a href="#">Chiens</a>
               <i class="icon icon--chevron-right-red"></i>
               <span>
                  <a href="#"> Alimentations</a>
                  <i class="icon icon--chevron-right-red"></i>
                  <span class="breadcrumb_last" aria-current="page">Croquettes</span>
               </span>
            </span>
         </span>
      </span>
   </p>
</nav>
 
/* No context defined for this component. */
  • Content: 
    .nav-breadcrumb {

   font-size: rem(16);

   > p { line-height: 1 }

   a {
      vertical-align: middle;
      color: $c-red;
      transition: .3s ease;

      &:hover, &:focus {
         color: darken($c-red, 10%);
         text-decoration-color: transparent;
      }
   }

   span.breadcrumb_last { vertical-align: middle }

   .icon::after { 
      min-width: 6px;
      min-height: 10px;
   }
}
  • URL: /components/raw/nav-breadcrumb/nav-breadcrumb.scss
  • Filesystem Path: components/06-components/01-navs/05-nav-breadcrumb/nav-breadcrumb.scss
  • Size: 401 Bytes

There are no notes for this item.