Share modal light UI simplification
authorRigel Kent <sendmemail@rigelk.eu>
Fri, 6 Mar 2020 14:05:19 +0000 (15:05 +0100)
committerRigel Kent <sendmemail@rigelk.eu>
Fri, 6 Mar 2020 14:05:19 +0000 (15:05 +0100)
client/src/app/videos/+video-watch/modal/video-share.component.html
client/src/app/videos/+video-watch/modal/video-share.component.scss
client/src/sass/include/_mixins.scss

index 593dd8529cad2ead0b3102424c1fd9c5666abd48..dd2dd34ab7d528adaee27584dab6ea565763d779 100644 (file)
           </div>
         </div>
 
-        <div (click)="isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role="button" class="advanced-filters-button"
-             [attr.aria-expanded]="!isAdvancedCustomizationCollapsed" aria-controls="collapseBasic">
-
-          <ng-container *ngIf="isAdvancedCustomizationCollapsed">
-            <span class="glyphicon glyphicon-menu-down"></span>
-
-            <ng-container i18n>
-              More customization
-            </ng-container>
-          </ng-container>
-
-          <ng-container *ngIf="!isAdvancedCustomizationCollapsed">
-            <span class="glyphicon glyphicon-menu-up"></span>
-
-            <ng-container i18n>
-              Less customization
-            </ng-container>
-          </ng-container>
-        </div>
-
         <div class="advanced-filters collapse-transition" [ngbCollapse]="isAdvancedCustomizationCollapsed">
           <div>
             <div class="form-group stop-at">
             </div>
           </ng-container>
         </div>
+
+        <div (click)="isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role="button" class="advanced-filters-button"
+             [attr.aria-expanded]="!isAdvancedCustomizationCollapsed" aria-controls="collapseBasic">
+
+          <ng-container *ngIf="isAdvancedCustomizationCollapsed">
+            <span class="glyphicon glyphicon-menu-down"></span>
+
+            <ng-container i18n>
+              More customization
+            </ng-container>
+          </ng-container>
+
+          <ng-container *ngIf="!isAdvancedCustomizationCollapsed">
+            <span class="glyphicon glyphicon-menu-up"></span>
+
+            <ng-container i18n>
+              Less customization
+            </ng-container>
+          </ng-container>
+        </div>
       </div>
     </div>
   </div>
 
-  <div class="modal-footer inputs">
-    <span i18n class="action-button action-button-cancel" (click)="hide()">Close</span>
-  </div>
-
 </ng-template>
index 8b5952da618d508af470656fd47b7793516c6b91..a5766d9838eed11cdd711fdfae5932c93fa18f90 100644 (file)
@@ -39,14 +39,12 @@ my-input-readonly-copy {
 
 .filters {
   margin-top: 30px;
-  padding-top: 30px;
-  border-top: 1px solid $separator-border-color;
 
   .advanced-filters-button {
     display: flex;
     justify-content: center;
     align-items: center;
-    margin-top: 30px;
+    margin-top: 20px;
     font-size: 16px;
     font-weight: $font-semibold;
     cursor: pointer;
index bafc82d7d7cfc21d3ad6b7f1d47619f4acbf5dd8..de9c9d6d6bcb0c231fd22d6ce864832ebd0c72f5 100644 (file)
 
   .links {
     margin-top: 0;
-    margin-bottom: 10px;
+    margin-bottom: 15px;
 
     a {
       margin-top: 0;