سؤال

Wondering if it's possible to use two classes in blade, look at comment here. One of the class is linked to check if it's active and the other is for the icon.

 <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li> <a class='home' {{HTML::linkRoute('hvertime','Forside')}} </a> </li>
          HERE // <li <a class='home' @if($aktiv == 'hvertredjetime'){{ "class='active'" }}@endif>{{HTML::linkRoute('hvertredjetime','Måling')}} </a></li>
            <li @if($aktiv == 'gjoremal'){{ "class='active'" }}@endif>{{HTML::linkRoute('gjoremal','Daglige Oppgaver')}} </li>
            <li @if($aktiv == 'dagvakt'){{ "class='active'" }}@endif>{{HTML::linkRoute('dagvakt','Dagvakt')}}</li>
            <li @if($aktiv == 'kveldsvakt'){{ "class='active'" }}@endif>{{HTML::linkRoute('kveldsvakt','Kveldsvakt')}}</li>
            <li @if($aktiv == 'kontrollcm'){{ "class='active'" }}@endif>{{HTML::linkRoute('kontrollcm','Kontroll CM')}}</li>
            <li @if($aktiv == 'sok'){{ "class='active'" }}@endif>{{HTML::linkRoute('sok','Søk')}}</li>  
              {{--  <li @if($aktiv == 'diagrammer'){{ "class='active'" }}@endif>{{HTML::linkRoute('diagrammer','Diagrammer')}}</li>  --}} 
              {{--  <li @if($aktiv == 'rapport'){{ "class='active'" }}@endif>{{HTML::linkRoute('rapport','Rapport')}}</li>  --}} 

          </ul>

css.

.navbar-default .navbar-nav>.active>a:before,
.navbar-nav>li>a:before {
    background-repeat: no-repeat;
    background-position: 0 top;
    content: "";
    display: inline-block;
    height: 29px;
    margin-right: 10px;
    vertical-align: middle;
    width: 29px;
}

.navbar-default .navbar-nav>.active>a.home:before,
.navbar-nav>li>a.home:before { background-image: url('http://i.imgur.com/j2s9NKB.png'); }

.navbar-default .navbar-nav>.active>a.home:before,
.navbar-nav>li>a.home:before { background-image: url('http://i.imgur.com/j2s9NKB.png'); }
هل كانت مفيدة؟

المحلول

you can use checks in blade within the double braces like this and add additional classes according to variable values.

<div class="navbar-collapse collapse">
  <ul class="nav navbar-nav">
    <li>
      <a class='home'>{{ HTML::linkRoute('hvertime','Forside') }}</a>
    </li>
    <li class='{{ ($aktiv == 'hvertredjetime') ? 'active' : '' }}'>
      <a class='home'>{{HTML::linkRoute('hvertredjetime','Måling')}}</a>
    </li>
    ...
  </ul>
</div>

also see http://www.php.net/manual/en/language.operators.comparison.php for the ternary operators.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top