diff options
Diffstat (limited to 'client/src/app/shared/shared-main')
9 files changed, 29 insertions, 26 deletions
diff --git a/client/src/app/shared/shared-main/buttons/action-dropdown.component.scss b/client/src/app/shared/shared-main/buttons/action-dropdown.component.scss index 724a04efc..b9a4d46dc 100644 --- a/client/src/app/shared/shared-main/buttons/action-dropdown.component.scss +++ b/client/src/app/shared/shared-main/buttons/action-dropdown.component.scss | |||
@@ -8,6 +8,9 @@ | |||
8 | .action-button { | 8 | .action-button { |
9 | @include peertube-button; | 9 | @include peertube-button; |
10 | 10 | ||
11 | display: inline-block; | ||
12 | padding: 0 10px; | ||
13 | |||
11 | &.button-styled { | 14 | &.button-styled { |
12 | 15 | ||
13 | &.grey { | 16 | &.grey { |
@@ -18,14 +21,13 @@ | |||
18 | @include orange-button; | 21 | @include orange-button; |
19 | } | 22 | } |
20 | 23 | ||
21 | &:hover, &:active, &:focus { | 24 | &:hover, |
25 | &:active, | ||
26 | &:focus { | ||
22 | background-color: $grey-background-color; | 27 | background-color: $grey-background-color; |
23 | } | 28 | } |
24 | } | 29 | } |
25 | 30 | ||
26 | display: inline-block; | ||
27 | padding: 0 10px; | ||
28 | |||
29 | &::after { | 31 | &::after { |
30 | display: none; | 32 | display: none; |
31 | } | 33 | } |
@@ -64,7 +66,8 @@ | |||
64 | @include dropdown-with-icon-item; | 66 | @include dropdown-with-icon-item; |
65 | } | 67 | } |
66 | 68 | ||
67 | a, span { | 69 | a, |
70 | span { | ||
68 | display: block; | 71 | display: block; |
69 | width: 100%; | 72 | width: 100%; |
70 | } | 73 | } |
diff --git a/client/src/app/shared/shared-main/date/date-toggle.component.scss b/client/src/app/shared/shared-main/date/date-toggle.component.scss index 86700d1d4..b87f7c475 100644 --- a/client/src/app/shared/shared-main/date/date-toggle.component.scss +++ b/client/src/app/shared/shared-main/date/date-toggle.component.scss | |||
@@ -1,5 +1,5 @@ | |||
1 | .date-toggle { | 1 | .date-toggle { |
2 | &:hover { | 2 | &:hover { |
3 | cursor: default | 3 | cursor: default; |
4 | } | 4 | } |
5 | } | 5 | } |
diff --git a/client/src/app/shared/shared-main/feeds/feed.component.scss b/client/src/app/shared/shared-main/feeds/feed.component.scss index b655ee708..d39f31d70 100644 --- a/client/src/app/shared/shared-main/feeds/feed.component.scss +++ b/client/src/app/shared/shared-main/feeds/feed.component.scss | |||
@@ -5,14 +5,14 @@ | |||
5 | width: 100%; | 5 | width: 100%; |
6 | 6 | ||
7 | a { | 7 | a { |
8 | color: black; | 8 | color: #000; |
9 | display: block; | 9 | display: block; |
10 | } | 10 | } |
11 | } | 11 | } |
12 | 12 | ||
13 | my-global-icon { | 13 | my-global-icon { |
14 | @include apply-svg-color(pvar(--mainForegroundColor)); | ||
15 | |||
14 | cursor: pointer; | 16 | cursor: pointer; |
15 | width: 100%; | 17 | width: 100%; |
16 | |||
17 | @include apply-svg-color(pvar(--mainForegroundColor)) | ||
18 | } | 18 | } |
diff --git a/client/src/app/shared/shared-main/loaders/loader.component.scss b/client/src/app/shared/shared-main/loaders/loader.component.scss index ffac9c707..64138afe4 100644 --- a/client/src/app/shared/shared-main/loaders/loader.component.scss +++ b/client/src/app/shared/shared-main/loaders/loader.component.scss | |||
@@ -20,7 +20,7 @@ | |||
20 | border: 4px solid; | 20 | border: 4px solid; |
21 | border-radius: 50%; | 21 | border-radius: 50%; |
22 | animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; | 22 | animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; |
23 | border-color: #999999 transparent transparent transparent; | 23 | border-color: #999999 transparent transparent; |
24 | } | 24 | } |
25 | 25 | ||
26 | .loader div:nth-child(1) { | 26 | .loader div:nth-child(1) { |
diff --git a/client/src/app/shared/shared-main/misc/help.component.scss b/client/src/app/shared/shared-main/misc/help.component.scss index ccc91ffab..68d7ad48f 100644 --- a/client/src/app/shared/shared-main/misc/help.component.scss +++ b/client/src/app/shared/shared-main/misc/help.component.scss | |||
@@ -2,20 +2,19 @@ | |||
2 | @import '_mixins'; | 2 | @import '_mixins'; |
3 | 3 | ||
4 | .help-tooltip-button { | 4 | .help-tooltip-button { |
5 | cursor: pointer; | 5 | @include disable-outline; |
6 | border: none; | ||
7 | 6 | ||
7 | cursor: pointer; | ||
8 | border: 0; | ||
8 | margin: 5px; | 9 | margin: 5px; |
9 | 10 | ||
10 | my-global-icon { | 11 | my-global-icon { |
12 | @include apply-svg-color(pvar(--greyForegroundColor)); | ||
13 | |||
11 | width: 17px; | 14 | width: 17px; |
12 | position: relative; | 15 | position: relative; |
13 | top: -1px; | 16 | top: -1px; |
14 | |||
15 | @include apply-svg-color(pvar(--greyForegroundColor)) | ||
16 | } | 17 | } |
17 | |||
18 | @include disable-outline; | ||
19 | } | 18 | } |
20 | 19 | ||
21 | ::ng-deep { | 20 | ::ng-deep { |
diff --git a/client/src/app/shared/shared-main/misc/list-overflow.component.html b/client/src/app/shared/shared-main/misc/list-overflow.component.html index 986572801..b2e0982f1 100644 --- a/client/src/app/shared/shared-main/misc/list-overflow.component.html +++ b/client/src/app/shared/shared-main/misc/list-overflow.component.html | |||
@@ -2,19 +2,19 @@ | |||
2 | <span [id]="getId(id)" #itemsRendered *ngFor="let item of items; index as id"> | 2 | <span [id]="getId(id)" #itemsRendered *ngFor="let item of items; index as id"> |
3 | <ng-container *ngTemplateOutlet="itemTemplate; context: {item: item}"></ng-container> | 3 | <ng-container *ngTemplateOutlet="itemTemplate; context: {item: item}"></ng-container> |
4 | </span> | 4 | </span> |
5 | 5 | ||
6 | <ng-container *ngIf="isMenuDisplayed()"> | 6 | <ng-container *ngIf="isMenuDisplayed()"> |
7 | <button *ngIf="isInMobileView" class="btn btn-outline-secondary btn-sm list-overflow-menu" (click)="toggleModal()"> | 7 | <button *ngIf="isInMobileView" class="btn btn-outline-secondary btn-sm list-overflow-menu" (click)="toggleModal()"> |
8 | <span class="glyphicon glyphicon-chevron-down"></span> | 8 | <span class="glyphicon glyphicon-chevron-down"></span> |
9 | </button> | 9 | </button> |
10 | 10 | ||
11 | <div *ngIf="!isInMobileView" class="list-overflow-menu" ngbDropdown container="body" #dropdown="ngbDropdown" (mouseleave)="closeDropdownIfHovered(dropdown)" (mouseenter)="openDropdownOnHover(dropdown)"> | 11 | <div *ngIf="!isInMobileView" class="list-overflow-menu" ngbDropdown container="body" #dropdown="ngbDropdown" (mouseleave)="closeDropdownIfHovered(dropdown)" (mouseenter)="openDropdownOnHover(dropdown)"> |
12 | <button class="btn btn-outline-secondary btn-sm" [ngClass]="{ routeActive: active }" | 12 | <button class="btn btn-outline-secondary btn-sm" [ngClass]="{ 'route-active': active }" |
13 | ngbDropdownAnchor (click)="dropdownAnchorClicked(dropdown)" role="button" | 13 | ngbDropdownAnchor (click)="dropdownAnchorClicked(dropdown)" role="button" |
14 | > | 14 | > |
15 | <span class="glyphicon glyphicon-chevron-down"></span> | 15 | <span class="glyphicon glyphicon-chevron-down"></span> |
16 | </button> | 16 | </button> |
17 | 17 | ||
18 | <div ngbDropdownMenu> | 18 | <div ngbDropdownMenu> |
19 | <a *ngFor="let item of items | slice:showItemsUntilIndexExcluded:items.length" | 19 | <a *ngFor="let item of items | slice:showItemsUntilIndexExcluded:items.length" |
20 | [routerLink]="item.routerLink" routerLinkActive="active" class="dropdown-item"> | 20 | [routerLink]="item.routerLink" routerLinkActive="active" class="dropdown-item"> |
diff --git a/client/src/app/shared/shared-main/misc/list-overflow.component.scss b/client/src/app/shared/shared-main/misc/list-overflow.component.scss index 1ec044489..7e31d3850 100644 --- a/client/src/app/shared/shared-main/misc/list-overflow.component.scss +++ b/client/src/app/shared/shared-main/misc/list-overflow.component.scss | |||
@@ -15,13 +15,13 @@ | |||
15 | 15 | ||
16 | button { | 16 | button { |
17 | width: 30px; | 17 | width: 30px; |
18 | border: none; | 18 | border: 0; |
19 | 19 | ||
20 | &::after { | 20 | &::after { |
21 | display: none; | 21 | display: none; |
22 | } | 22 | } |
23 | 23 | ||
24 | &.routeActive { | 24 | &.route-active { |
25 | &::after { | 25 | &::after { |
26 | display: inherit; | 26 | display: inherit; |
27 | border: 2px solid pvar(--mainColor); | 27 | border: 2px solid pvar(--mainColor); |
@@ -36,7 +36,7 @@ button { | |||
36 | margin-top: 0 !important; | 36 | margin-top: 0 !important; |
37 | position: static; | 37 | position: static; |
38 | right: auto; | 38 | right: auto; |
39 | bottom: auto | 39 | bottom: auto; |
40 | } | 40 | } |
41 | 41 | ||
42 | .modal-body { | 42 | .modal-body { |
diff --git a/client/src/app/shared/shared-main/users/user-notifications.component.scss b/client/src/app/shared/shared-main/users/user-notifications.component.scss index fa9c55ec9..b69d4b5d6 100644 --- a/client/src/app/shared/shared-main/users/user-notifications.component.scss +++ b/client/src/app/shared/shared-main/users/user-notifications.component.scss | |||
@@ -21,11 +21,11 @@ | |||
21 | } | 21 | } |
22 | 22 | ||
23 | my-global-icon { | 23 | my-global-icon { |
24 | @include apply-svg-color(#333); | ||
25 | |||
24 | width: 24px; | 26 | width: 24px; |
25 | margin-right: 11px; | 27 | margin-right: 11px; |
26 | margin-left: 3px; | 28 | margin-left: 3px; |
27 | |||
28 | @include apply-svg-color(#333); | ||
29 | } | 29 | } |
30 | 30 | ||
31 | .avatar { | 31 | .avatar { |
diff --git a/client/src/app/shared/shared-main/users/user-quota.component.scss b/client/src/app/shared/shared-main/users/user-quota.component.scss index c670559d3..c06cafe29 100644 --- a/client/src/app/shared/shared-main/users/user-quota.component.scss +++ b/client/src/app/shared/shared-main/users/user-quota.component.scss | |||
@@ -11,7 +11,8 @@ label { | |||
11 | margin-right: 5px; | 11 | margin-right: 5px; |
12 | } | 12 | } |
13 | 13 | ||
14 | &, .progress { | 14 | &, |
15 | .progress { | ||
15 | width: 100% !important; | 16 | width: 100% !important; |
16 | } | 17 | } |
17 | 18 | ||