44 lines
1.4 KiB
Vue
44 lines
1.4 KiB
Vue
<template>
|
|
<div>
|
|
<BaseInput placeholder="Search">
|
|
<svg version="1.1" class="search__icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 52.966 52.966" style="enable-background:new 0 0 52.966 52.966;" xml:space="preserve">
|
|
<path d="M51.704,51.273L36.845,35.82c3.79-3.801,6.138-9.041,6.138-14.82c0-11.58-9.42-21-21-21s-21,9.42-21,21s9.42,21,21,21
|
|
c5.083,0,9.748-1.817,13.384-4.832l14.895,15.491c0.196,0.205,0.458,0.307,0.721,0.307c0.25,0,0.499-0.093,0.693-0.279
|
|
C52.074,52.304,52.086,51.671,51.704,51.273z M21.983,40c-10.477,0-19-8.523-19-19s8.523-19,19-19s19,8.523,19,19
|
|
S32.459,40,21.983,40z"/>
|
|
<g></g>
|
|
</svg>
|
|
</BaseInput>
|
|
|
|
<Notification :BadgeNumber="5"></Notification>
|
|
|
|
<Profile></Profile>
|
|
|
|
<History></History>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import BaseInput from '../components/BaseInput'
|
|
import Notification from '../components/Notification'
|
|
import Profile from '../components/Profile'
|
|
import History from '../components/History'
|
|
|
|
export default {
|
|
name: 'ActionBar',
|
|
components: { BaseInput, Notification, Profile, History }
|
|
}
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
div
|
|
display: flex
|
|
padding: 1rem 2.5rem
|
|
align-items: center
|
|
|
|
@media(max-width: 1000px)
|
|
div
|
|
flex-wrap: wrap
|
|
</style>
|
|
|