Migrate to bootstrap 5

[github/Chocobozzz/PeerTube.git] / client / src / app / +my-library / my-history / my-history.component.scss

diff --git a/client/src/app/+my-library/my-history/my-history.component.scss b/client/src/app/+my-library/my-history/my-history.component.scss
index af4a34b4ba92a6ece0c90b4b052eed3727484be5..3257b2215379577db6ec3d23bd8f00fbb501f67c 100644 (file)
--- a/client/src/app/+my-library/my-history/my-history.component.scss
+++ b/client/src/app/+my-library/my-history/my-history.component.scss
@@ -1,5 +1,5 @@
-@import '_variables';
-@import '_mixins';
+@use '_variables' as *;
+@use '_mixins' as *;
 
 .no-history {
   display: flex;
@@ -24,11 +24,11 @@
   }
 
   .history-switch {
-    grid-column: 3;
+    @include margin-left(auto);
+    @include margin-right(15px);
 
+    grid-column: 3;
     display: flex;
-    margin-left: auto;
-    margin-right: 15px;
 
     label {
       margin: 0 0 0 5px;
@@ -39,12 +39,12 @@
   }
 
   .delete-history {
-    grid-column: 4;
-
     @include peertube-button;
     @include grey-button;
     @include button-with-icon;
 
+    grid-column: 4;
+
     font-size: 15px;
   }
 }
@@ -53,6 +53,11 @@
   @include row-blocks($column-responsive: false);
 }
 
+.action-button {
+  display: flex;
+  align-self: flex-end;
+}
+
 @media screen and (max-width: $small-view) {
   .top-buttons {
     grid-template-columns: auto 1fr auto;