diff options
| author | Syndamia <kamen.d.mladenov@protonmail.com> | 2021-01-29 09:46:02 +0200 |
|---|---|---|
| committer | Syndamia <kamen.d.mladenov@protonmail.com> | 2021-01-29 09:46:02 +0200 |
| commit | ea699e1902c82f1afda500df10680274cc9fbb3a (patch) | |
| tree | 0089b36a0c509a03df18f5e800011ac011ff2871 /src/DevHive.Angular | |
| parent | 2b54d46311e7dca76575a5f6e4ce3267f7eee8bd (diff) | |
| download | DevHive-ea699e1902c82f1afda500df10680274cc9fbb3a.tar DevHive-ea699e1902c82f1afda500df10680274cc9fbb3a.tar.gz DevHive-ea699e1902c82f1afda500df10680274cc9fbb3a.zip | |
Made feed design more consistent with design of all other pages
Diffstat (limited to 'src/DevHive.Angular')
4 files changed, 9 insertions, 21 deletions
diff --git a/src/DevHive.Angular/src/app/components/feed/feed.component.css b/src/DevHive.Angular/src/app/components/feed/feed.component.css index bbb1668..e22693e 100644 --- a/src/DevHive.Angular/src/app/components/feed/feed.component.css +++ b/src/DevHive.Angular/src/app/components/feed/feed.component.css @@ -77,9 +77,10 @@ #top-bar { display: flex; - width: 95%; + width: 98%; margin: 0 auto; margin-bottom: .5em; + box-sizing: border-box; } #top-bar-profile-pic { @@ -100,9 +101,7 @@ margin: 0 auto; box-sizing: border-box; border: 2px solid var(--bg-color); - padding: .5em; border-radius: .6em; - box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px; } #top-bar-open-chat { @@ -110,11 +109,6 @@ display: none; } -#profile-bar, -#top-bar > * { - box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px; -} - /* Elements, that act as buttons */ #profile-bar > #profile-info:hover, diff --git a/src/DevHive.Angular/src/app/components/feed/feed.component.html b/src/DevHive.Angular/src/app/components/feed/feed.component.html index 4a93120..b82b189 100644 --- a/src/DevHive.Angular/src/app/components/feed/feed.component.html +++ b/src/DevHive.Angular/src/app/components/feed/feed.component.html @@ -1,9 +1,9 @@ <app-loading *ngIf="!dataArrived"></app-loading> <div id="feed-page" *ngIf="dataArrived"> - <nav id="profile-bar"> + <nav id="profile-bar" class="round-image rounded-border"> <div id="profile-info" (click)="goToProfile()"> - <img id="profile-bar-profile-pic" class="round-image" [src]="user.imageUrl" alt=""/> + <img id="profile-bar-profile-pic" [src]="user.imageUrl" alt=""/> <div id="profile-bar-name"> {{ user.firstName }} {{ user.lastName }} </div> @@ -15,7 +15,7 @@ <button class="submit-btn" (click)="logout()">Logout</button> </nav> <div id="feed-content"> - <nav id="top-bar"> + <nav id="top-bar" class="rounded-border"> <img id="top-bar-profile-pic" class="round-image" [src]="user.imageUrl" alt="" (click)="goToProfile()"> <input id="top-bar-create-post" type="text" placeholder="What's on your mind?"/> <a id="top-bar-open-chat" href=""> diff --git a/src/DevHive.Angular/src/app/components/post/post.component.css b/src/DevHive.Angular/src/app/components/post/post.component.css index 9de5a27..5395eb2 100644 --- a/src/DevHive.Angular/src/app/components/post/post.component.css +++ b/src/DevHive.Angular/src/app/components/post/post.component.css @@ -1,21 +1,15 @@ .post { display: flex; - width: 95%; + width: 98%; margin: .5em auto; box-sizing: border-box; - border: 2px solid var(--card-bg); padding: .5em; background-color: var(--card-bg); - border-radius: .6em; - box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; } - /* So the bottom shadow of the last element - * doesn't get cut off - */ -.post:nth-last-child(1) { - margin-bottom: 1.1em; +.post:first-child { + margin-top: 0; } hr { diff --git a/src/DevHive.Angular/src/app/components/post/post.component.html b/src/DevHive.Angular/src/app/components/post/post.component.html index a7acb0e..487b785 100644 --- a/src/DevHive.Angular/src/app/components/post/post.component.html +++ b/src/DevHive.Angular/src/app/components/post/post.component.html @@ -1,4 +1,4 @@ -<div class="post"> +<div class="post rounded-border"> <div class="content"> <div class="author"> <img class="round-image" [src]="user.imageUrl"> |