Fix items tab on list publish page on desktop

ui/component/collectionEdit/view.jsx

@@ -310,7 +310,7 @@ function CollectionForm(props: Props) {
 
   return (
     <>
-      <div className={classnames('main--contained', { 'card--disabled': disabled })}>
+      <div className={classnames('main--contained publishList-wrapper', { 'card--disabled': disabled })}>
         <Tabs>
           <TabList className="tabs__list--collection-edit-page">
             <Tab>{__('General')}</Tab>

ui/scss/init/_gui.scss

@@ -809,13 +809,6 @@ img {
 }
 
 .playlistPage-wrapper {
-  /*
-  .button--file-action {
-    &:hover {
-      background-color: unset;
-    }
-  }*/
-
   .card-stack:first-of-type {
     .card {
       margin-bottom: var(--spacing-l);
@@ -941,6 +934,50 @@ img {
   }
 }
 
+.publishList-wrapper {
+  @media (min-width: $breakpoint-small) {
+    .claim-preview--collection-mine {
+      height: unset;
+      padding-left: 9rem;
+      position: relative;
+
+      .media__thumb {
+        position: relative;
+        right: unset;
+
+        .claim-preview__hover-actions {
+          display: visible;
+        }
+      }
+
+      .claim-preview__text {
+        position: unset;
+        right: unset;
+        width: 100%;
+        background-color: unset;
+        padding: 0;
+        border-radius: unset;
+
+        .claim-preview-info {
+          .claim-preview__title {
+            font-size: var(--font-small);
+          }
+        }
+        .media__subtitle {
+          .button__content {
+            .channel-name {
+              font-size: var(--font-xsmall);
+            }
+          }
+        }
+      }
+    }
+    .button-dislike {
+      margin-right: 0;
+    }
+  }
+}
+
 .repost-wrapper {
   .claim-preview__wrapper {
     background-color: rgba(var(--color-header-background-base), 0.6);