Skip to content

Instantly share code, notes, and snippets.

@kichMan
Created May 20, 2016 08:35
Show Gist options
  • Save kichMan/a6764296331186bd7767ad86792ebb42 to your computer and use it in GitHub Desktop.
Save kichMan/a6764296331186bd7767ad86792ebb42 to your computer and use it in GitHub Desktop.
Одноуровневые хлебные-крошки c флексом
.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;
}
}
<?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