Rotate the chevron in the breadcrumb

This commit is contained in:
Oliver Davies 2019-06-15 20:35:41 +01:00
parent c8b5ddd3f8
commit e45099c132
2 changed files with 4 additions and 1 deletions

View file

@ -3,7 +3,7 @@
<ul class="flex spaced-x-1"> <ul class="flex spaced-x-1">
<li class="flex items-center spaced-x-1"> <li class="flex items-center spaced-x-1">
<router-link :to="{ name: 'projects' }" class="font-semibold text-white opacity-75">Projects</router-link> <router-link :to="{ name: 'projects' }" class="font-semibold text-white opacity-75">Projects</router-link>
<svg class="h-6 w-6 fill-current text-white opacity-75" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M6.9 9.9c0-.3.1-.5.3-.7.4-.4 1-.4 1.4 0l3.5 3.5 3.5-3.5c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-4.2 4.2c-.4.4-1 .4-1.4 0l-4.2-4.2c-.2-.2-.3-.4-.3-.7z"/></svg> <svg class="h-6 w-6 fill-current text-white opacity-75 -rotate-90" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M6.9 9.9c0-.3.1-.5.3-.7.4-.4 1-.4 1.4 0l3.5 3.5 3.5-3.5c.4-.4 1-.4 1.4 0 .4.4.4 1 0 1.4l-4.2 4.2c-.4.4-1 .4-1.4 0l-4.2-4.2c-.2-.2-.3-.4-.3-.7z"/></svg>
</li> </li>
<li class="flex items-center font-semibold" v-text="title"></li> <li class="flex items-center font-semibold" v-text="title"></li>
</ul> </ul>

View file

@ -3,6 +3,9 @@ const { fontFamily, spacing } = require('tailwindcss/defaultTheme')
module.exports = { module.exports = {
theme: { theme: {
rotate: {
'-90': '-90deg'
},
extend: { extend: {
colors: { colors: {
charade: '#2a293c', charade: '#2a293c',