I want to make a star rating display. Here is my code.
<?php $rate = 4; ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star_border</i>
I want to make it: for example if $rate = 3 show 3x star, 2x star_border.
if $rate = 4 show 4x star, 1x star_border
Here is my too long code. I want shorter and more practical.
<?php $rate = 1;?>
<?php if ($rate == 1): ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<?php elseif ($rate == 2): ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<?php elseif ($rate == 3): ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star_border</i>
<i class="material-icons md-18">star_border</i>
<?php elseif ($rate == 4): ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star_border</i>
<?php elseif ($rate == 5): ?>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<i class="material-icons md-18">star</i>
<?php endif;?>
This should serve you well.
<?php
$rate = 3;
for ($x = 0; $x < $rate; $x++) {
echo '<i class="material-icons md-18">star</i>';
}
for ($x = 0; $x < 5-$rate; $x++) {
echo '<i class="material-icons md-18">star_border</i>';
}
?>
You echo as many starts as your rating says. And then you echo star borders as many as needed.
Related
Hello I am trying to put a carousel in my modal. everything was working fine until I put it. can someone please tell me what's wrong?
gallery.html
{% for photo in gallery %}
×
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item">
<img src="{{photo.imageURL}}" alt="First slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
please change below photo url path
<img src="{{photo.image.url}}" alt="First slide">
I have a simple navigation bar:
<div class="sidebar content-box" style="display: block;">
<ul class="nav">
<li class="submenu">
<a href="index.php">
<i a href="index.php" class="glyphicon glyphicon-edit"></i> Idmancilar
<span class="caret pull-right" href="index.php"></span>
</a>
<ul>
<li>Qeydiyyat sorgulari</li>
</ul>
</li>
<li><i class="glyphicon glyphicon-edit"></i>Mesqciler</li>
<li><i class="glyphicon glyphicon-edit"></i> Klublar</li>
<li><i class="glyphicon glyphicon-edit"></i>Yarislar</li>
<li><i class="glyphicon glyphicon-edit"></i> Qeydiyyat sorgulari</li>
<li><i class="glyphicon glyphicon-edit"></i> Logout</li>
</ul>
</div>
</div>
When I open the submenu the player_requests is opened, but from there I can not navifate back to the parent index.php page. When I click on element the span and submenu are opened again and no redirection to the required index.php page.
The problem is likely due to the fact that you have invalid HTML.Only the <a>, <area>, <base> and <link> tags can have the href attribute.
Both <i a href="index.php" ... > and <span ... href="index.php"> are invalid.
You'll need to remove href from both your <i> and your <span> tags,as can be seen in the following:
<div class="sidebar content-box" style="display: block;">
<ul class="nav">
<li class="submenu">
<a href="index.php">
<i class="glyphicon glyphicon-edit"></i> Idmancilar
<span class="caret pull-right"></span>
</a>
<ul>
<li>Qeydiyyat sorgulari</li>
</ul>
</li>
<li><i class="glyphicon glyphicon-edit"></i>Mesqciler</li>
<li><i class="glyphicon glyphicon-edit"></i> Klublar</li>
<li><i class="glyphicon glyphicon-edit"></i>Yarislar</li>
<li><i class="glyphicon glyphicon-edit"></i> Qeydiyyat sorgulari</li>
<li><i class="glyphicon glyphicon-edit"></i> Logout</li>
</ul>
</div>
I am developing a new theme from default one.
I notice that:
<?php echo $language; ?>
Generates:
<div class="pull-left">
<form action="http://192.168.0.1/opencart/index.php?route=common/currency/currency" method="post" enctype="multipart/form-data" id="form-currency">
<div class="btn-group open">
<button class="btn btn-link dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
<strong>$</strong>
<span class="hidden-xs hidden-sm hidden-md">Currency</span> <i class="fa fa-caret-down"></i></button><div class="dropdown-backdrop"></div>
<ul class="dropdown-menu">
<li><button class="currency-select btn btn-link btn-block" type="button" name="EUR">€ Euro</button></li>
<li><button class="currency-select btn btn-link btn-block" type="button" name="GBP">£ Pound Sterling</button></li>
<li><button class="currency-select btn btn-link btn-block" type="button" name="USD">$ US Dollar</button></li>
</ul>
</div>
<input type="hidden" name="code" value="">
<input type="hidden" name="redirect" value="http://192.168.0.1/opencart/index.php?route=common/home">
</form>
</div>
But my template uses:
<li> <span class="dropdown-title">Currency :</span>
<ul>
<li><a class="active" href="#">USD</a></li>
<li>AUD</li>
<li>EUR</li>
</ul>
</li>
What shall be done to adapt echo $language to the new template needs?
You can change its html markup by editing this file:
catalog\view\theme\default\template\common\language.tpl
Or if you have that file in your theme:
catalog\view\theme\{YOUR_THEME}\template\common\language.tpl
I have the following page: http://mindspyder.com/newline/my-account.html
And the following code on that page:
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item"> <a class="btn btn-primary btn-sm" href="#" role="button"><i class="fa fa-search-plus"></i> View</a> </li>
<li class="nav-item"> <span data-toggle="modal" data-target="#myModal"><a class="btn btn-primary btn-sm" href="#delete" role="tab" data-toggle="tab"><i class="fa fa-times"></i> Delete</a></span></li>
<li class="nav-item"> <a class="btn btn-primary btn-sm" href="#download" role="tab" data-toggle="tab">Settings</a> </li>
</ul>
<!-- /Nav tabs -->
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="review"></div>
<div role="tabpanel" class="tab-pane" id="edit"></div>
<div role="tabpanel" class="tab-pane" id="delete">hello</div>
<div role="tabpanel" class="tab-pane" id="download">
<p>
<form>
<p>
<label>
<input type="checkbox" name="CheckboxGroup1" value="Invoice" id="CheckboxGroup1_0">
Invoice</label>
<br>
<label>
<input type="checkbox" name="CheckboxGroup1" value="Establishment Kit" id="CheckboxGroup1_1">
Establishment Kit</label>
<br>
<label>
<input type="checkbox" name="CheckboxGroup1" value="Declaration of Custody Trust" id="CheckboxGroup1_2">
Declaration of Custody Trust</label>
<br>
<label>
<input type="checkbox" name="CheckboxGroup1" value="Trustee Minutes" id="CheckboxGroup1_3">
Trustee Minutes</label>
<br>
<label>
<input type="checkbox" name="CheckboxGroup1" value="Compliance Letter" id="CheckboxGroup1_4">
Compliance Letter</label>
<br>
</p>
</form>
</p>
<p>
<button type="button" class="btn btn-success btn-sm">Download Selected <i class="fa fa-arrow-down"></i></button>
</p>
</div>
</div>
<!-- /Tab panes -->
Now, if you go to the page and click the blue Delete button, everything works perfectly. Now if you click Cancel, and click on one of the other tabs, it still works as it should. The problem is you click Delete again, it doesn't switch back to the Delete tab when opening the modal, but leaves it on the previous tab.
What am I doing wrong?
I figured it out, by changing the nesting, so:
<span data-toggle="modal" data-target="#myModal"><a class="btn btn-primary btn-sm" href="#delete" role="tab" data-toggle="tab"><i class="fa fa-times"></i> Delete</a></span>
becomes:
<a class="btn btn-primary btn-sm" href="#delete" role="tab" data-toggle="tab"><span data-toggle="modal" data-target="#myModal"><i class="fa fa-times"></i> Delete</span></a>
and now it works as it should.
I´ve implemented the Foundation Off-Canvas Menu as a Multilevel Menu. When I use the original code example from the documentation, I´ve the problem, that the submenu isn´t working. It´s shown but it´s not formated (sub-levels not hidden) and the click event to open the submenu is also not triggered.
To me it looks like some parts are not compiled although I compile the whole foundation framework, not only specific modules.
Has anybody an idea where I can start searching? The other parts of the menu work great.
Here´s the HTML code:
<aside class="left-off-canvas-menu" aria-hidden="true">
<ul class="off-canvas-list">
<li><label>Navigationsmenü</label></li>
<li><i class="fa fa-shopping-cart"></i> Mein Warenkorb</li>
<li><i class="fa fa-arrow-right"></i> Zur Kasse</li>
<li><label>Mein Konto</label></li>
<li class="my-account">
<div class="avatar">
<img src="<?php echo "http://www.gravatar.com/avatar/" . md5( strtolower( trim( 'mail#mail.com' ) ) ) . "?s=100";?>" class="avatar" alt="Avatar" />
</div>
<div class="user">
<span class="title">John Doe</span>
<span class="email">email#email.com</span>
</div>
<div class="clearfix"></div>
<i class="fa fa-user"></i> Meine Daten ändern
</li>
<li><i class="fa fa-home"></i> Adressbuch bearbeiten</li>
<li><i class="fa fa-truck"></i> Meine Bestellungen</li>
<li><i class="fa fa-lock"></i> Passwort ändern</li>
<li><i class="fa fa-envelope"></i> E-Mail Adresse ändern</li>
<li><i class="fa fa-power-off"></i> Ausloggen</li>
<li><label>Produktkategorien</label></li>
<li class="has-submenu">Aktionen
<ul class="left-submenu">
<li class="back">Zurück</li>
<li><label>Level 1</label></li>
<li>Sonderangebote der Woche</li>
<li>Monatsaktionen</li>
<li>Spezialaktionen
<li>Maximal sparen</li>
</ul>
</li>
<li>Gutscheine</li>
<li class="has-submenu">Ernährung
<ul class="left-submenu">
<li class="back">Zurück</li>
<li><label>Level 1</label></li>
<li>Nahrungsergänzungsmittel</li>
<li>Vitamine & Mineralstoffe</li>
<li>Spezialnahrung
<li>Gesund abnehmen</li>
<li>Sportlernahrung</li>
</ul>
</li>
</ul>
</aside>
And that´s the SCSS file (app.scss):
#import "compass/css3/border-radius";
#import "compass/css3/box-shadow";
#import "settings";
#import "foundation";
Thanks,
Michael