Created
May 20, 2016 08:35
-
-
Save kichMan/a6764296331186bd7767ad86792ebb42 to your computer and use it in GitHub Desktop.
Одноуровневые хлебные-крошки c флексом
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.module_bread_crumbs { | |
position: relative; | |
box-sizing: border-box; | |
font: normal 11px Tahoma, sans-serif; | |
padding-bottom: 5px; | |
display: -webkit-flex; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-flex-direction: row; | |
-ms-flex-direction: row; | |
flex-direction: row; | |
-webkit-flex-wrap: nowrap; | |
-ms-flex-wrap: none; | |
flex-wrap: nowrap; | |
-webkit-align-items: center; | |
-ms-flex-align: center; | |
align-items: center; | |
&-item { | |
position: relative; | |
box-sizing: border-box; | |
padding: 0 5px 0 0; | |
line-height: 2; | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto; | |
white-space: nowrap; | |
overflow: hidden; | |
text-overflow: ellipsis; | |
&:before { | |
position: relative; | |
box-sizing: border-box; | |
content: ' '; | |
color: #ccc; | |
font: bold 20px Utkonos; | |
display: inline; | |
vertical-align: bottom; | |
} | |
a { | |
overflow: hidden; | |
text-overflow: ellipsis; | |
white-space: nowrap; | |
color: #333; | |
text-decoration: none; | |
&:hover { | |
color: #33935b; | |
text-decoration: none; | |
} | |
} | |
&_loop { | |
-webkit-flex: 0 1 auto; | |
-ms-flex: 0 1 auto; | |
flex: 0 1 auto; | |
&:before { | |
content: '> '; | |
} | |
} | |
//Первый из цикла всегда показывать целиком (Обычно это Каталог) | |
&:nth-of-type(3) { | |
-webkit-flex: 0 0 auto; | |
-ms-flex: 0 0 auto; | |
flex: 0 0 auto; | |
} | |
} | |
&-signature { | |
color: #777; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?xml version="1.0" encoding="UTF-8"?> | |
<xsl:transform version="1.0" | |
xmlns:base="lib.base" | |
exclude-result-prefixes="base" | |
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> | |
<xsl:template name="module_bread_crumbs"> | |
<xsl:variable name="path" select="$data/path/path" /> | |
<xsl:variable name="is_visibility" select="not($controller_name='login')" /> | |
<xsl:if test="$is_visibility"> | |
<div class="module_bread_crumbs"> | |
<div class="module_bread_crumbs-signature module_bread_crumbs-item">Вы здесь:</div> | |
<div class="module_bread_crumbs-item"> | |
<a href="/" title="" class="module_bread_crumbs-main">Главная</a> | |
</div> | |
<xsl:apply-templates select="$path/path_item[position() > 1 and title != '']" mode="module_bread_crumbs-item" /> | |
</div> | |
</xsl:if> | |
</xsl:template> | |
<xsl:template match="path_item" mode="module_bread_crumbs-item"> | |
<div class="module_bread_crumbs-item module_bread_crumbs-item_loop"> | |
<a href="{url}" title=""> | |
<xsl:value-of select="title" disable-output-escaping="yes" /> | |
</a> | |
</div> | |
</xsl:template> | |
</xsl:transform> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment