diff --git a/angular.json b/angular.json
index 5978d22a..107ca295 100644
--- a/angular.json
+++ b/angular.json
@@ -26,7 +26,8 @@
],
"stylePreprocessorOptions": {
"includePaths": [
- "./node_modules/bootstrap/scss"
+ "./src/sass",
+ "./node_modules/bootstrap/scss"
]
},
"scripts": [
diff --git a/src/app/components/left-side-bar/left-side-bar.component.html b/src/app/components/left-side-bar/left-side-bar.component.html
index 6d61b24b..9f4ff6c0 100644
--- a/src/app/components/left-side-bar/left-side-bar.component.html
+++ b/src/app/components/left-side-bar/left-side-bar.component.html
@@ -1,6 +1,6 @@
-
-
-
Toot!
+
+
@@ -10,14 +10,7 @@
-
-
-
\ No newline at end of file
diff --git a/src/app/components/left-side-bar/left-side-bar.component.scss b/src/app/components/left-side-bar/left-side-bar.component.scss
index 5083f67d..165f5896 100644
--- a/src/app/components/left-side-bar/left-side-bar.component.scss
+++ b/src/app/components/left-side-bar/left-side-bar.component.scss
@@ -1,55 +1,34 @@
-#mam-left-bar {
- width: 50px;
- height: calc(100%);
- background: green;
- background: #090b10;
-
- /*outline: 1px dotted red;*/
+@import "variables";
+.left-bar {
+ width: 50px;
+ height: calc(100%);
+ background: $color-secondary;
}
-#mam-create-toot {
- width: 50px;
-
- /* background-color: black; */
+.create-toot {
+ width: 50px;
+ &__link {
+ font-size: 0.8em;
+ margin: 0 0 0 10px;
+ }
}
- #mam-create-toot a {
- font-size: 0.8em;
- /* color: white; */
+.add-account {
+ width: 50px;
+ height: 30px;
+ padding-top: 7px;
+ &__link {
+ font-size: 2em;
+ height: 10px;
+ margin: 0 15px;
+ line-height: 0;
+ }
+}
+
+.left-bar-link {
+ color: $font-link-primary;
text-decoration: none;
- margin: 0 0 0 10px;
- }
-
-
-.mam-account-selector {
- width: 50px;
- padding-top: 4px;
-}
-
- .mam-account-selector a {
- margin-left: 4px;
- /*margin-top: 4px;*/
- }
-
- .mam-account-selector img {
- width: 40px;
- border-radius: 50%;
- }
-
-#mam-account-add {
- width: 50px;
- /*height: 50px;*/
-
- /* background-color: black; */
-}
-
-a {
- font-size: 2em;
- color: #595c67;
- text-decoration: none;
- margin: 10px 0 0 15px;
-}
-
-a:hover {
- color: #8f93a2;
-}
+ &:hover {
+ color: $font-link-primary-hover;
+ }
+}
\ No newline at end of file
diff --git a/src/sass/_variables.scss b/src/sass/_variables.scss
index 4c677a25..d40ae5bd 100644
--- a/src/sass/_variables.scss
+++ b/src/sass/_variables.scss
@@ -1,5 +1,9 @@
$font-color-primary: #e8eaf3;
+$font-link-primary: #595c67;
+$font-link-primary-hover: #8f93a2;
+
$color-primary: #141824;
+$color-secondary: #090b10;
$default-font-size: 15px;
\ No newline at end of file