/themes/iugo/pages/work-detail.htm
HTML | 207 lines | 192 code | 3 blank | 12 comment | 0 complexity | 014af42a4e64486b4592127ffc74ebd6 MD5 | raw file
Possible License(s): MIT
- title = "Detalle"
- url = "/work/:slug"
- layout = "default"
- meta_title = "Laravel - UX/UI - Branding"
- is_hidden = 0
- ==
- <?php
- use Iugo\Proyectos\Models\Projects;
- function onStart()
- {
- $this['project'] = Projects::where('slug', '=', $this->param('slug'))->first();
- // Se me ocurrio de esta forma
- // filtrar los trabajos realizados por categorias
- // aprovechar y hacer dinamico el activo en el menu
- $category = $this['project']['category'];
- $value = ucfirst($category);
- $this['active'] = $value;
- $this['canonical'] = '/?cat='.$category;
- }
- ?>
- ==
- {% put styles %}
- <title>IUGO | {{ project.name }}</title>
- <link rel="canonical" href="{{'home'|page}}/work/{{project.slug}}">
- <meta property="og:type" content="article">
- <meta property="og:title" content="{{ project.name }}">
- <meta property="og:url" content="{{'home'|page}}/work/{{project.slug}}">
- <meta property="og:description" content="{{ project.text }}">
- <meta property="article:published_time" content="">
- <meta name="twitter:title" content="{{ project.name }}">
- <meta name="twitter:description" content="{{ project.text }}">
- <meta name="description" content="{{ project.text }}">
- <meta name="twitter:image" content="{{ asset('/img/logo/logo.png') }}">
- <meta property="og:image" content="{{ asset('/img/logo/logo.png') }}">
- <meta property="og:image:type" content="image/png">
- <meta property="og:image:width" content="300">
- <meta property="og:image:height" content="300">
- <meta itemprop="name" content="IUGO | {{ project.name }}">
- <meta itemprop="description" content="{{ project.text }}">
- <meta itemprop="image" content="{{ asset('/img/logo/logo.png') }}">
- {% endput %}
- <!-- begin header -->
- {% partial "header" %}
- <!-- end header -->
- <!-- begin hero -->
- <div class="hero">
- <div class="hero__bg" style="background-image: url({{ 'assets/images/pexels-photo.jpg'|theme }})" data-paroller-factor="0.1" data-paroller-type="foreground"></div>
- <div class="hero__inner inner">
- <h1 class="hero__title title-bigger">work</h1>
- </div>
- </div>
- <!-- end hero -->
- <!-- begin navigation -->
- <div class="navigation">
- <div class="navigation__inner inner">
- <div class="navigation__out js-navigation-out">
- <div class="navigation__current js-navigation-current">
- <span class="js-navigation-current-text"></span>
- <svg class="icon icon-arrow-right ">
- <use xlink:href="{{'assets/images/sprite.svg#icon-arrow-right'|theme}}"></use>
- </svg>
- </div>
- <div class="navigation__wrap js-navigation-wrap">
- <a href="{{'work'|page}}" class="navigation__btn">
- <svg class="icon icon-arrow-left ">
- <use xlink:href="{{'assets/images/sprite.svg#icon-arrow-left'|theme}}"></use>
- </svg>
- back
- </a>
- <ul class="navigation__list">
- <li class="navigation__item {{ active == 'work' ? 'is-active' : '' }}">
- <a class="navigation__link" href="{{'work'|page}}">Latest </a>
- </li>
- <li class="navigation__item {{ active == 'E-commerce' ? 'is-active' : '' }}">
- <a class="navigation__link" href="{{'work'|page}}?cat={{ 'E-commerce'|lower }}">e-Commerce</a>
- </li>
- <li class="navigation__item {{ active == 'Interfaces' ? 'is-active' : '' }}">
- <a class="navigation__link" href="{{'work'|page}}?cat={{ 'Interfaces'|lower }}">Interfaces</a>
- </li>
- <li class="navigation__item {{ active == 'Software' ? 'is-active' : '' }}">
- <a class="navigation__link" href="{{'work'|page}}?cat={{ 'Software'|lower }}">Software</a>
- </li>
- <li class="navigation__item {{ active == 'Branding' ? 'is-active' : '' }}">
- <a class="navigation__link" href="{{'work'|page}}?cat={{ 'Branding'|lower }}">Branding</a>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- <!-- end navigation -->
- <div class="project-details">
- <div class="sm-section" data-anim-parent>
- <div class="inner sm-section__inner">
- <div class="details">
- <div class="details__figure" data-anim-from="bottom">
- <img src="{{project.image|media}}" alt="IUGO | {{ project.name }}">
- </div>
- <div class="details__content">
- <div class="details__header" data-anim-from="bottom">
- <!-- <div class="details__label">EL PAÍS</div> -->
- <div class="details__title">{{ project.name }}</div>
- </div>
- <div class="details__description" data-anim-from="bottom">
- <p>
- {{ project.text }}
- </p>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="sm-section" data-anim-parent>
- <div class="inner sm-section__inner">
- <div class="sm-info">
- <div class="sm-info__figures" data-anim-from="bottom">
- <div class="sm-info__row">
- <img src="{{project.block1_image|media}}" style="width: 100%;" alt="IUGO | {{ project.name }}">
- <!-- <div class="sm-info__img" style="background-image: url({{project.block1_image|media}});"></div> -->
- </div>
- </div>
- <div class="sm-info__content" data-anim-from="bottom">
- <div class="sm-info__title">
- {{ project.block1_title }}
- </div>
- <div class="sm-info__description">
- <p>
- {{ project.block1_text }}
- </p>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="sm-section" data-anim-parent>
- <div class="inner sm-section__inner">
- <div class="sm-info sm-info_right">
- <div class="sm-info__figures" data-anim-from="bottom">
- <div class="sm-info__images">
- <img src="{{project.block2_image|media}}" style="width: 100%;" alt="IUGO | {{ project.name }}">
- <!-- <div class="sm-info__image sm-info__image_sm">
- <img src="{{project.block2_image|media}}" alt="IUGO | {{ project.name }}">
- </div> -->
- </div>
- </div>
- <div class="sm-info__content" data-anim-from="bottom">
- <div class="sm-info__title">
- {{ project.block2_title }}
- </div>
- <div class="sm-info__description">
- <p>
- {{ project.block2_text }}
- </p>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="sm-banner" data-anim-parent>
- <div class="sm-banner__img" data-anim-from>
- <div class="sm-banner__img-in" style="background-image: url({{project.block3_image|media}})"></div>
- </div>
- <div class="inner sm-banner__inner">
- <div class="sm-banner__content" data-anim-from="bottom">
- <div class="sm-banner__title">
- {{ project.block3_title }}
- </div>
- <div class="sm-info__description">
- <p>
- {{ project.block3_text }}
- </p>
- </div>
- </div>
- </div>
- </div>
- <!-- begin banner -->
- <div class="banner" style="background:{{ project.color }}" data-anim-parent>
- <div class="inner banner__inner">
- <div class="banner__content">
- <div class="banner__label" data-anim-from="bottom">
- {% if project.category == 'E-commerce' %}
- GOT AN
- {% else %}
- GOT A
- {% endif %}
- </div>
- <div class="banner__title " data-anim-from="bottom">
- {% if project.category == 'Interfaces' %}
- UI/UX PROJECT?
- {% elseif project.category == 'Software' %}
- SOFTWARE PROJECT?
- {% elseif project.category == 'E-commerce' %}
- E-COMMERCE PROJECT?
- {% else %}
- BRANDING PROJECT?
- {% endif %}
- </div>
- </div>
- <div class="banner__btn" data-anim-from="bottom">
- <a href="#0" class="btn btn_wide btn_lg btn_dark js-nav-contacts">DROP US A LINE</a>
- </div>
- </div>
- </div>