| | |
| | | margin-top: 20px; |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | a { |
| | | position: relative; |
| | | } |
| | | |
| | | a:hover:after { |
| | | left: 0; |
| | | width: 100%; |
| | | -webkit-transition: width 350ms; |
| | | -moz-transition: width 350ms; |
| | | -ms-transition: width 350ms; |
| | | -o-transition: width 350ms; |
| | | transition: width 350ms; |
| | | } |
| | | |
| | | a:after { |
| | | position: absolute; |
| | | bottom: -0.0625rem; |
| | | left: 100%; |
| | | width: 0; |
| | | border-bottom: 0.0625rem solid #30a9de; |
| | | content: ""; |
| | | -webkit-transition: width 350ms, left 350ms; |
| | | -moz-transition: width 350ms, left 350ms; |
| | | -ms-transition: width 350ms, left 350ms; |
| | | -o-transition: width 350ms, left 350ms; |
| | | transition: width 350ms, left 350ms; |
| | | } |
| | | .fade-enter-active, |
| | | .fade-leave-active { |
| | | transition: opacity .5s; |
| | | } |
| | | |
| | | .fade-enter, |
| | | .fade-leave-to { |
| | | opacity: 0; |
| | | } |
| | | </style> |