diff --git a/src/App.vue b/src/App.vue index db54902..bb93d14 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,14 +1,17 @@ @@ -18,13 +21,17 @@ flex-direction: column row-gap: 8px height: 100% + width: 100% font-family: Raleway, sans-serif font-style: normal font-feature-settings: 'pnum' on, 'lnum' on -webkit-font-smoothing: antialiased -moz-osx-font-smoothing: grayscale - background-color: #E9E9F6 + background-color: var(--bg-lavender-color) .pages-container display: flex flex: auto +body + margin: 0 + padding: 0 diff --git a/src/assets/css/variables.css b/src/assets/css/variables.css new file mode 100644 index 0000000..9e3cf07 --- /dev/null +++ b/src/assets/css/variables.css @@ -0,0 +1,7 @@ +:root { + --bg-lavender-color: #D7D9FF; + --bg-white-color: #F8F8FF; + --font-dark-blue-color: #252850; + --font-black-color: #090A15; + --btn-blue-color: #4169E1; +} \ No newline at end of file diff --git a/src/assets/icons/bell.svg b/src/assets/icons/bell.svg new file mode 100644 index 0000000..404718b --- /dev/null +++ b/src/assets/icons/bell.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/down-arrow-1.svg b/src/assets/icons/down-arrow-1.svg new file mode 100644 index 0000000..45cd26e --- /dev/null +++ b/src/assets/icons/down-arrow-1.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/down-arrow-2.svg b/src/assets/icons/down-arrow-2.svg new file mode 100644 index 0000000..089858b --- /dev/null +++ b/src/assets/icons/down-arrow-2.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/search.svg b/src/assets/icons/search.svg new file mode 100644 index 0000000..9a17652 --- /dev/null +++ b/src/assets/icons/search.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/images/avatar.png b/src/assets/images/avatar.png deleted file mode 100644 index 89bdee3..0000000 Binary files a/src/assets/images/avatar.png and /dev/null differ diff --git a/src/assets/images/avatar.svg b/src/assets/images/avatar.svg new file mode 100644 index 0000000..a429b0e --- /dev/null +++ b/src/assets/images/avatar.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg new file mode 100644 index 0000000..ea74ee9 --- /dev/null +++ b/src/assets/images/logo.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/homePageComponents/HeaderComponent.vue b/src/components/homePageComponents/HeaderComponent.vue index e69de29..904a036 100644 --- a/src/components/homePageComponents/HeaderComponent.vue +++ b/src/components/homePageComponents/HeaderComponent.vue @@ -0,0 +1,149 @@ + + + + + diff --git a/src/main.js b/src/main.js index 9faa34f..01617d4 100644 --- a/src/main.js +++ b/src/main.js @@ -2,5 +2,6 @@ import { createApp } from 'vue' import App from './App.vue' import router from "./router"; import './assets/sass/styles.sass' +import './assets/css/variables.css' createApp(App).use(router).mount('#app')