Skip to content

Instantly share code, notes, and snippets.

@alextea
Last active May 25, 2017 14:39
Show Gist options
  • Save alextea/20bef0a49bc60936887872ec4adefd82 to your computer and use it in GitHub Desktop.
Save alextea/20bef0a49bc60936887872ec4adefd82 to your computer and use it in GitHub Desktop.
<div class="grid-row">
<div class="available-languages">
<ul>
<li class="translation">
<span>English</span>
</li>
<li class="translation last">
<a lang="cy" hreflang="cy" href="/dechrau">Cymraeg</a>
</li>
</ul>
</div>
</div>
.available-languages {
@include grid-column(1 / 3, tablet, right);
ul {
@extend %contain-floats;
list-style: none;
padding: $gutter-half 0 $gutter-one-third;
border-bottom: 1px solid $border-colour;
li {
float: left;
display: block;
border-right: 1px solid $border-colour;
padding: 0 $gutter-one-third 0 0;
height: 16px;
margin: 3px $gutter-one-third 2px 0;
&.last {
border-right: 0;
}
a,
span {
display: block;
margin-top: -1px;
@include core-16;
}
.direction-rtl & {
direction: rtl;
float: right;
text-align: start;
border-left: 1px solid $border-colour;
border-right: 0;
margin: 3px 0 2px $gutter-one-third;
padding: 0 0 0 $gutter-one-third;
&.last {
border-left: 0;
}
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment