aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/app/app.module.ts4
-rw-r--r--src/app/components/navbar/navbar.component.css43
-rw-r--r--src/app/components/navbar/navbar.component.html36
-rw-r--r--src/app/components/navbar/navbar.component.ts49
-rw-r--r--src/app/components/post/post.component.html4
-rw-r--r--src/assets/icons/tabler-icon-home.svg73
-rw-r--r--src/assets/icons/tabler-icon-logout.svg69
-rw-r--r--src/assets/icons/tabler-icon-message-circle.svg86
-rw-r--r--src/assets/icons/tabler-icon-search.svg74
-rw-r--r--src/assets/icons/tabler-icon-settings.svg71
-rw-r--r--src/assets/icons/tabler-icon-trending-up.svg69
-rw-r--r--src/styles.css28
12 files changed, 598 insertions, 8 deletions
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1bf44ad..f582bbc 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -25,6 +25,7 @@ import { CommentComponent } from './components/comment/comment.component';
import { CommentPageComponent } from './components/comment-page/comment-page.component';
import { PostAttachmentComponent } from './components/post-attachment/post-attachment.component';
import { RouterModule } from '@angular/router';
+import { NavbarComponent } from './components/navbar/navbar.component';
@NgModule({
declarations: [
@@ -43,7 +44,8 @@ import { RouterModule } from '@angular/router';
AdminPanelPageComponent,
CommentComponent,
CommentPageComponent,
- PostAttachmentComponent
+ PostAttachmentComponent,
+ NavbarComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'serverApp' }),
diff --git a/src/app/components/navbar/navbar.component.css b/src/app/components/navbar/navbar.component.css
new file mode 100644
index 0000000..58ec821
--- /dev/null
+++ b/src/app/components/navbar/navbar.component.css
@@ -0,0 +1,43 @@
+#navbar {
+ width: 100%;
+ background-color: var(--card-bg);
+}
+
+#nav-contents {
+ max-width: var(--max-width);
+ margin: 0 auto;
+ box-sizing: border-box;
+}
+
+#nav-contents img {
+ height: 1.9em;
+ width: 1.9em;
+}
+
+@media screen and (max-width: 30rem) {
+ #nav-username {
+ display: none;
+ }
+
+ #navbar {
+ font-size: 0.8em;
+ }
+}
+
+#nav-profile-picture {
+ padding: 0.1em;
+}
+
+#nav-profile-picture img {
+ height: 1.8em;
+ width: 1.8em;
+}
+
+.nav-item {
+ margin-left: 0.2em;
+ padding: 0 0.1em;
+}
+
+.nav-item:first-child {
+ margin-left: 0;
+}
diff --git a/src/app/components/navbar/navbar.component.html b/src/app/components/navbar/navbar.component.html
new file mode 100644
index 0000000..2d386aa
--- /dev/null
+++ b/src/app/components/navbar/navbar.component.html
@@ -0,0 +1,36 @@
+<nav id="navbar">
+ <div id="nav-contents" class="flex-row padding-smaller flex-center-align-items">
+ <div id="nav-profile-picture" class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" (click)="goToProfile()">
+ <img class="round-image" [src]="user.profilePictureURL">
+ </div>
+ <div id="nav-username" class="font-size-dot9 nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" (click)="goToProfile()">
+ <div class="padding-small">
+ Konstantin
+ </div>
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" (click)="goToFeed()">
+ <img src="/assets/icons/tabler-icon-home.svg">
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" style="display: none">
+ <!-- Trending functionality isn't implemented yet! -->
+ <img src="/assets/icons/tabler-icon-trending-up.svg">
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" style="display: none">
+ <!-- Chat functionality isn't implemented yet! -->
+ <img src="/assets/icons/tabler-icon-message-circle.svg">
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" style="display: none">
+ <!-- Search functionality isn't implemented yet! -->
+ <img src="/assets/icons/tabler-icon-search.svg">
+ </div>
+ <div class="flexible">
+ <!-- This element serves as a spacer -->
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" (click)="goToSettings()">
+ <img src="/assets/icons/tabler-icon-settings.svg">
+ </div>
+ <div class="nav-item flex-col border-radius-small light-hover hover-half-opacity click-effect" (click)="logout()">
+ <img src="/assets/icons/tabler-icon-logout.svg">
+ </div>
+ </div>
+</nav>
diff --git a/src/app/components/navbar/navbar.component.ts b/src/app/components/navbar/navbar.component.ts
new file mode 100644
index 0000000..4af7a8a
--- /dev/null
+++ b/src/app/components/navbar/navbar.component.ts
@@ -0,0 +1,49 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { TokenService } from 'src/app/services/token.service';
+import { UserService } from 'src/app/services/user.service';
+import { User } from 'src/models/identity/user.model';
+
+@Component({
+ selector: 'app-navbar',
+ templateUrl: './navbar.component.html',
+ styleUrls: ['./navbar.component.css']
+})
+export class NavbarComponent implements OnInit {
+ public user: User;
+
+ constructor(private _router: Router, private _userService: UserService, private _tokenService: TokenService)
+ { }
+
+ ngOnInit(): void {
+ if (!this._tokenService.getTokenFromSessionStorage()) {
+ this._router.navigate(['/login']);
+ return;
+ }
+
+ this.user = this._userService.getDefaultUser();
+
+ this._userService.getUserFromSessionStorageRequest().subscribe({
+ next: (res: object) => {
+ Object.assign(this.user, res);
+ },
+ });
+ }
+
+ goToProfile(): void {
+ this._router.navigate(['/profile/' + this.user.userName]);
+ }
+
+ goToFeed(): void {
+ this._router.navigate(['/']);
+ }
+
+ goToSettings(): void {
+ this._router.navigate(['/profile/' + this.user.userName + '/settings']);
+ }
+
+ logout(): void {
+ this._tokenService.logoutUserFromSessionStorage();
+ this._router.navigate(['/login']);
+ }
+}
diff --git a/src/app/components/post/post.component.html b/src/app/components/post/post.component.html
index a4acfe6..4d9fc64 100644
--- a/src/app/components/post/post.component.html
+++ b/src/app/components/post/post.component.html
@@ -36,11 +36,11 @@
</summary>
</section>
<section class="flex-row flexible-children justify-children-center">
- <button class="small-padding lighter-hover click-effect border-radius-smaller" (click)="goToPostPage()">
+ <button class="padding-small lighter-hover click-effect border-radius-smaller" (click)="goToPostPage()">
<img src="/assets/icons/tabler-icon-message-2.svg">
&nbsp;Comment
</button>
- <button class="small-padding lighter-hover click-effect border-radius-smaller" (click)="goToPostPage()">
+ <button class="padding-small lighter-hover click-effect border-radius-smaller" (click)="goToPostPage()">
<img src="/assets/icons/tabler-icon-link.svg">
&nbsp;Share
</button>
diff --git a/src/assets/icons/tabler-icon-home.svg b/src/assets/icons/tabler-icon-home.svg
new file mode 100644
index 0000000..3578ddb
--- /dev/null
+++ b/src/assets/icons/tabler-icon-home.svg
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-home"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg10"
+ sodipodi:docname="tabler-icon-home.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata16">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs14" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview12"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg10" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <polyline
+ points="5 12 3 12 12 3 21 12 19 12"
+ id="polyline4"
+ style="stroke:#ffeede" />
+ <path
+ d="m 5,12 v 7 a 2,2 0 0 0 2,2 h 10 a 2,2 0 0 0 2,-2 v -7"
+ id="path6"
+ style="stroke:#ffeede" />
+ <path
+ d="m 9,21 v -6 a 2,2 0 0 1 2,-2 h 2 a 2,2 0 0 1 2,2 v 6"
+ id="path8"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/assets/icons/tabler-icon-logout.svg b/src/assets/icons/tabler-icon-logout.svg
new file mode 100644
index 0000000..c311628
--- /dev/null
+++ b/src/assets/icons/tabler-icon-logout.svg
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-logout"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg8"
+ sodipodi:docname="tabler-icon-logout.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata14">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs12" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview10"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg8" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <path
+ d="M 14,8 V 6 A 2,2 0 0 0 12,4 H 5 A 2,2 0 0 0 3,6 v 12 a 2,2 0 0 0 2,2 h 7 a 2,2 0 0 0 2,-2 v -2"
+ id="path4"
+ style="stroke:#ffeede" />
+ <path
+ d="M 7,12 H 21 L 18,9 m 0,6 3,-3"
+ id="path6"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/assets/icons/tabler-icon-message-circle.svg b/src/assets/icons/tabler-icon-message-circle.svg
new file mode 100644
index 0000000..fc999bd
--- /dev/null
+++ b/src/assets/icons/tabler-icon-message-circle.svg
@@ -0,0 +1,86 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-message-circle"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg12"
+ sodipodi:docname="tabler-icon-message-circle.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata18">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs16" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview14"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg12" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <path
+ d="M 3,20 4.3,16.1 A 9,8 0 1 1 7.7,19 L 3,20"
+ id="path4"
+ style="stroke:#ffeede" />
+ <line
+ x1="12"
+ y1="12"
+ x2="12"
+ y2="12.01"
+ id="line6"
+ style="stroke:#ffeede" />
+ <line
+ x1="8"
+ y1="12"
+ x2="8"
+ y2="12.01"
+ id="line8"
+ style="stroke:#ffeede" />
+ <line
+ x1="16"
+ y1="12"
+ x2="16"
+ y2="12.01"
+ id="line10"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/assets/icons/tabler-icon-search.svg b/src/assets/icons/tabler-icon-search.svg
new file mode 100644
index 0000000..abbd480
--- /dev/null
+++ b/src/assets/icons/tabler-icon-search.svg
@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-search"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg8"
+ sodipodi:docname="tabler-icon-search.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata14">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs12" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview10"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg8" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <circle
+ cx="10"
+ cy="10"
+ r="7"
+ id="circle4"
+ style="stroke:#ffeede" />
+ <line
+ x1="21"
+ y1="21"
+ x2="15"
+ y2="15"
+ id="line6"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/assets/icons/tabler-icon-settings.svg b/src/assets/icons/tabler-icon-settings.svg
new file mode 100644
index 0000000..c133334
--- /dev/null
+++ b/src/assets/icons/tabler-icon-settings.svg
@@ -0,0 +1,71 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-settings"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg8"
+ sodipodi:docname="tabler-icon-settings.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata14">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs12" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview10"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg8" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <path
+ d="m 10.325,4.317 c 0.426,-1.756 2.924,-1.756 3.35,0 a 1.724,1.724 0 0 0 2.573,1.066 c 1.543,-0.94 3.31,0.826 2.37,2.37 a 1.724,1.724 0 0 0 1.065,2.572 c 1.756,0.426 1.756,2.924 0,3.35 a 1.724,1.724 0 0 0 -1.066,2.573 c 0.94,1.543 -0.826,3.31 -2.37,2.37 a 1.724,1.724 0 0 0 -2.572,1.065 c -0.426,1.756 -2.924,1.756 -3.35,0 A 1.724,1.724 0 0 0 7.752,18.617 c -1.543,0.94 -3.31,-0.826 -2.37,-2.37 A 1.724,1.724 0 0 0 4.317,13.675 c -1.756,-0.426 -1.756,-2.924 0,-3.35 A 1.724,1.724 0 0 0 5.383,7.752 c -0.94,-1.543 0.826,-3.31 2.37,-2.37 1,0.608 2.296,0.07 2.572,-1.065 z"
+ id="path4"
+ style="stroke:#ffeede" />
+ <circle
+ cx="12"
+ cy="12"
+ r="3"
+ id="circle6"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/assets/icons/tabler-icon-trending-up.svg b/src/assets/icons/tabler-icon-trending-up.svg
new file mode 100644
index 0000000..c40ee92
--- /dev/null
+++ b/src/assets/icons/tabler-icon-trending-up.svg
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ class="icon icon-tabler icon-tabler-trending-up"
+ width="24"
+ height="24"
+ viewBox="0 0 24 24"
+ stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ version="1.1"
+ id="svg8"
+ sodipodi:docname="tabler-icon-trending-up.svg"
+ inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+ <metadata
+ id="metadata14">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs12" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="1920"
+ inkscape:window-height="1053"
+ id="namedview10"
+ showgrid="false"
+ inkscape:zoom="37.541667"
+ inkscape:cx="12"
+ inkscape:cy="12"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg8" />
+ <path
+ stroke="none"
+ d="M0 0h24v24H0z"
+ fill="none"
+ id="path2" />
+ <polyline
+ points="3 17 9 11 13 15 21 7"
+ id="polyline4"
+ style="stroke:#ffeede" />
+ <polyline
+ points="14 7 21 7 21 14"
+ id="polyline6"
+ style="stroke:#ffeede" />
+</svg>
diff --git a/src/styles.css b/src/styles.css
index b187391..75fe905 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -201,10 +201,22 @@ input[type=file]::file-selector-button {
/* General padding */
-.small-padding {
+.padding-normal {
+ padding: 0.4em;
+}
+
+.padding-smaller {
+ padding: 0.3em;
+}
+
+.padding-small {
padding: 0.2em;
}
+.padding-tiny {
+ padding: 0.1em;
+}
+
/* Cards */
.card {
@@ -218,18 +230,24 @@ input[type=file]::file-selector-button {
/* Effects */
-.lighter-hover:hover {
+.lighter-hover:hover, .light-hover:hover, .hover-half-opacity:hover {
cursor: pointer;
+}
+
+.lighter-hover:hover {
background: #424242;
}
-.click-effect:active {
- transform: scale(0.9);
+.light-hover:hover {
+ background: #696969;
}
.hover-half-opacity:hover {
opacity: 0.5;
- cursor: pointer;
+}
+
+.click-effect:active {
+ transform: scale(0.9);
}
/* Inputs, the type found in login and register */