diff --git a/.codesandbox/workspace.json b/.codesandbox/workspace.json new file mode 100644 index 0000000..c332bc5 --- /dev/null +++ b/.codesandbox/workspace.json @@ -0,0 +1,24 @@ +{ + "preview": [ + { + "views": [ + { + "id": "codesandbox.browser" + }, + { + "id": "codesandbox.tests" + } + ] + }, + { + "views": [ + { + "id": "codesandbox.problems" + }, + { + "id": "codesandbox.console" + } + ] + } + ] +} \ No newline at end of file diff --git a/package.json b/package.json index d8c1ac2..6838d20 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "login-si-register", + "name": "global-interceptor", "version": "0.1.0", "private": true, "scripts": { @@ -46,5 +46,5 @@ "not ie <= 8" ], "keywords": [], - "description": "rutele si componenete empty" + "description": "" } \ No newline at end of file diff --git a/public/components/bar/bar.css b/public/components/bar/bar.css new file mode 100644 index 0000000..7580e56 --- /dev/null +++ b/public/components/bar/bar.css @@ -0,0 +1,42 @@ +.dashboard_bar { + background: #f2f2f2; + padding: 15px 50px; + vertical-align: middle; + margin: 0 auto; + max-width: 960px; +} + +@media screen and (max-width: 500px) { + .column { + flex: 50%; + } +} + +.name { + display: block; + font-family: "Roboto"; + color: black; + font-size: 40px; + font-weight: normal; + font-style: normal; +} +.button { + background: #2ea1f8; + padding: 15px 32px 14px 32px; + margin: 25px 10px 25px 10px; + text-decoration: none; + font-weight: normal; + font-style: normal; + font-family: "Roboto"; + font-size: 16px; + border-radius: 5px; + line-height: 28px; + color: #ffffff; +} +.button:hover { + background-color: #4ab1ff; +} +.bar_create_note { + display: flex; + justify-content: space-around; +} diff --git a/public/components/bar/bar.html b/public/components/bar/bar.html new file mode 100644 index 0000000..91bb0ad --- /dev/null +++ b/public/components/bar/bar.html @@ -0,0 +1,26 @@ + + + + + + Template + + + + + +
+
+

Dashboard

+ NEW NOTE +
+
+ + + diff --git a/public/components/login/login.css b/public/components/login/login.css new file mode 100644 index 0000000..d66ca32 --- /dev/null +++ b/public/components/login/login.css @@ -0,0 +1,70 @@ +body { + background-color: #f2f2f2; +} + +.login-card { + display: flex; + flex-direction: column; + align-items: center; + justify-items: center; + width: 352px; + height: 338px; + margin: auto; + margin-top: 150px; + + background-color: #ffffff; + box-shadow: 0px 2px 27px rgba(230, 230, 230, 0.501961); + border-radius: 10px; +} + +img { + width: 132px; + height: 52px; + justify-items: center; + margin-top: 36px; + margin-bottom: 19px; +} + +input { + background: #ffffff; + border: 1px solid #dfdfdf; + box-sizing: border-box; + border-radius: 4px; + margin-bottom: 19px; + height: 54px; + width: 270px; + font-family: Roboto; + font-style: normal; + font-weight: normal; + padding-left: 10px; +} + +.buttons a { + display: inline-block; + text-decoration: none; + font-family: Roboto; + font-style: normal; + font-weight: normal; + margin-top: 14px; +} + +.buttons a:hover { + text-decoration: underline; +} + +.buton-login { + font-size: 16px; + line-height: 28px; + color: white; + background-color: #2ea1f8; + border-radius: 5px; + margin-right: 27px; + padding: 7px 45px 7px 45px; +} + +.buton-register { + font-size: 16px; + line-height: 16px; + color: #2ea1f8; + margin-left: 27px; +} diff --git a/public/components/login/login.html b/public/components/login/login.html new file mode 100644 index 0000000..270c043 --- /dev/null +++ b/public/components/login/login.html @@ -0,0 +1,32 @@ + + + + + Template Vechi + + + + + + + +
+ + + +
+ + REGISTER +
+
+ + diff --git a/public/components/note/notita.css b/public/components/note/notita.css new file mode 100644 index 0000000..c83e0ac --- /dev/null +++ b/public/components/note/notita.css @@ -0,0 +1,111 @@ +@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap"); +.container-note { + max-width: 960px; + margin: 0 auto; +} +.note { + padding-top: 30px; +} +.header { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 56px; + line-height: 64px; +} +.paragraph { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; +} +.container-note img { + width: 938px; + height: 624px; + left: 251px; + top: 672px; +} + +.container-note a { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; + text-decoration: none; + color: #208afa; +} +.container-note a:hover { + color: #208afa; + text-decoration: underline; +} + +.list { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; +} + +.header3 { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 26px; + line-height: 30px; + color: #393939; +} + +.header2 { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 32px; + line-height: 36px; + color: #393939; +} + +.paragraph2 { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; + color: #393939; +} +@media only screen and (max-width: 960px) { + .note div img { + margin-left: 0; + margin-right:0; + } +@media only screen and (max-width: 960px) { + .note { + font-size: 14px; + } + .note h1, + .note h2, + .note h3, + .note p, + .note ul { + margin-bottom: 1em; + margin-top: 0; + } + .note h2, + .note h3 { + font-weight: bold; + } + + .note h1 { + font-size: 2em; + } + + .note h2 { + font-size: 1.5em; + } + + .note h3 { + font-size: 1.25em; + } +} diff --git a/public/components/note/notita.html b/public/components/note/notita.html new file mode 100644 index 0000000..ce92552 --- /dev/null +++ b/public/components/note/notita.html @@ -0,0 +1,74 @@ + + + + + Template + + + + + + + +
+

You have a nice heart

+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean rutrum + tempor mi id volutpat. Sed semper, neque ac ullamcorper varius, tellus + velit auctor metus, in commodo diam nibh quis libero. Donec blandit + nunc felis, eget pharetra purus tincidunt a. Duis vitae orci eleifend, + cursus purus sed, imperdiet massa. Duis mattis dolor sem, convallis + placerat tellus ornare eget. Duis in ultricies massa. Duis nec auctor + sem. +

+
+
+ +
+

You have a nice heart

+
+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos + odio quaerat expedita corporis rem odit architecto accusantium + possimus perspiciatis eveniet totam optio facere, est incidunt, omnis + ut deleniti? Minus, placeat. +

+
+ +
HTML
+
CSS Basics
+
CSS Advanced

+
+ +
+

You have a nice heart

+
+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Id atque, + enim officia adipisci impedit accusantium blanditiis doloremque! Eius + cum recusandae quas vel quae aliquid cumque fugiat et distinctio! + Placeat, fugiat. +

+
+
+ + diff --git a/public/components/template/dashboard/dashboard.css b/public/components/template/dashboard/dashboard.css new file mode 100644 index 0000000..82da751 --- /dev/null +++ b/public/components/template/dashboard/dashboard.css @@ -0,0 +1,56 @@ +@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap"); +h1 { + font-family: "Roboto"; + color: black; + font-size: 40px; +} + +.buton { + background-color: #3393ff; + padding: 20px; + margin: 25px 10px 25px 10px; + font-weight: bold; + text-decoration: none; + font-family: "Roboto"; + font-size: 15px; + border-radius: 5px; + color: black; +} + +.buton:hover { + background-color: white; +} + +.flex1 { + display: flex; + justify-content: space-between; +} + +.flexxx { + display: inline-grid; + grid-template-columns: auto auto auto; + background-color: #2196f3; + padding: 10px; +} + +.flex2 { + padding: 20px; + font-size: 30px; + text-align: center; + border: 1px solid rgba(255, 255, 255, 0.8); +} + +.flex3 { + padding: 20px; + font-size: 30px; + text-align: center; + text-decoration: none; + border: 1px solid rgba(255, 255, 255, 0.8); +} + +.flex4 { + padding: 20px; + font-size: 30px; + text-align: center; + border: 1px solid rgba(255, 255, 255, 0.8); +} diff --git a/public/components/template/dashboard/dashboard.html b/public/components/template/dashboard/dashboard.html new file mode 100644 index 0000000..be6b398 --- /dev/null +++ b/public/components/template/dashboard/dashboard.html @@ -0,0 +1,42 @@ + + + + + Template + + + + + + + +
+

Dashboard

+ New notes +
+
+
+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim magnam + deserunt rerum sit tenetur adipisci eius, tempore magni voluptatem. Ex + totam nihil molestiae tempora doloremque sapiente aperiam ratione, + beatae repellat? +

+
+
+ Facebook +
+
+ +
+
+ + diff --git a/public/components/template/notita/notita.css b/public/components/template/notita/notita.css new file mode 100644 index 0000000..9f252ba --- /dev/null +++ b/public/components/template/notita/notita.css @@ -0,0 +1,51 @@ +@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap"); + +.container-note { + max-width: 960px; +} +.container-note h1 { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 56px; + line-height: 64px; +} +.container-note p { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; +} +.container-note img { + width: 938px; + height: 624px; + left: 251px; + top: 672px; +} + +.container-note h2 { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 32px; + line-height: 36px; +} + +.container-note a { + font-family: Roboto; + font-style: normal; + font-weight: normal; + font-size: 21px; + line-height: 36px; + text-decoration: none; + color: #208afa; +} +.container-note a:hover { + color: black; +} + +ul { + font-family: "Roboto"; + font-size: 15px; +} diff --git a/public/components/template/notita/notita.html b/public/components/template/notita/notita.html new file mode 100644 index 0000000..e28856f --- /dev/null +++ b/public/components/template/notita/notita.html @@ -0,0 +1,49 @@ + + + + + Template + + + + + + + +
+

You have a nice heart

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean rutrum + tempor mi id volutpat. Sed semper, neque ac ullamcorper varius, tellus + velit auctor metus, in commodo diam nibh quis libero. Donec blandit nunc + felis, eget pharetra purus tincidunt a. Duis vitae orci eleifend, cursus + purus sed, imperdiet massa. Duis mattis dolor sem, convallis placerat + tellus ornare eget. Duis in ultricies massa. Duis nec auctor sem. +

+ + + +

You have a nice heart

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos + odio quaerat expedita corporis rem odit architecto accusantium possimus + perspiciatis eveniet totam optio facere, est incidunt, omnis ut + deleniti? Minus, placeat. +

+ HTML + +
+ + diff --git a/src/App.vue b/src/App.vue index 19dd0e4..c91af6d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,6 +1,7 @@ diff --git a/src/Dashboard.vue b/src/Dashboard.vue index b7cfda8..e592c29 100644 --- a/src/Dashboard.vue +++ b/src/Dashboard.vue @@ -1,10 +1,13 @@ diff --git a/src/Landing.vue b/src/Landing.vue new file mode 100644 index 0000000..726d904 --- /dev/null +++ b/src/Landing.vue @@ -0,0 +1,20 @@ + + + + + \ No newline at end of file diff --git a/src/Login.vue b/src/Login.vue index bd1d596..8aba486 100644 --- a/src/Login.vue +++ b/src/Login.vue @@ -5,6 +5,7 @@ diff --git a/src/Settings.vue b/src/Settings.vue new file mode 100644 index 0000000..e596069 --- /dev/null +++ b/src/Settings.vue @@ -0,0 +1,21 @@ + + + + + \ No newline at end of file diff --git a/src/components/Header.vue b/src/components/Header.vue new file mode 100644 index 0000000..3af20e1 --- /dev/null +++ b/src/components/Header.vue @@ -0,0 +1,12 @@ + + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js index 4c75193..e12dd43 100644 --- a/src/main.js +++ b/src/main.js @@ -6,9 +6,24 @@ import Login from "./Login.vue"; import Register from "./Register.vue"; import Dashboard from "./Dashboard"; import Notes from "./Notes"; +import Axios from "axios"; Vue.config.productionTip = false; +Axios.interceptors.request.use( + function (config) { + const token = localStorage.getItem("NOTES_AUTH"); + + if (token) { + config.headers["Authorization"] = "Token " + token; + } + + return config; + }, + function (error) { + console.log(error); + } +); Vue.use(VueRouter); const routes = [