Offset fixes for especially multiple column view for 4.3.0 (2024-01-27)

ronilaukkarinen · Jan 28, 2024 · c4a1c00 · c4a1c00
1 parent 06efb7e
commit c4a1c00
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -34,6 +34,7 @@
 * Fix a regression with reply-indicator, remove style no longer needed in 4.3.0 (2024-01-27)
 * Fix follow requests icon for 4.3.0 (2024-01-27)
 * Reset emoji picker location from the corner to the bottom row for 4.3.0 (2024-01-27)
+* Offset fixes for especially multiple column view for 4.3.0 (2024-01-27)
 
 ### 1.8.3: 2023-11-12
 

diff --git a/layout-multiple-columns.css b/layout-multiple-columns.css
@@ -4064,7 +4064,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
  * ---------------------------------------
  */
 
- @keyframes boost-animate {
+@keyframes boost-animate {
   100% {
     background-position: -7770px;
   }
@@ -4103,7 +4103,23 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
 
   /* Offset in numbered item */
   .layout-multiple-columns.no-reduce-motion .status__action-bar .icon-button.icon-button--with-counter.active:focus .icon-retweet {
-    left: -84px;
+    left: -95px;
+  }
+
+  /* Offset fixes for especially multiple column view */
+  .layout-multiple-columns.no-reduce-motion .detailed-status__button .icon-button.active:focus .icon-retweet,
+  .layout-multiple-columns.no-reduce-motion .status .icon-button.icon-button--with-counter.star-icon.activate {
+    transform: translate(2px, -2px);
+  }
+
+  .layout-multiple-columns.no-reduce-motion .status .icon-button.icon-button--with-counter.star-icon.activate .icon-star + .icon-button__counter > .animated-number {
+    transform: translateX(10px);
+    top: 2px;
+  }
+
+  .layout-multiple-columns.no-reduce-motion .status__action-bar .icon-button.icon-button--with-counter.active:focus .icon-retweet + .icon-button__counter > .animated-number {
+    transform: translateX(12px);
+    top: 2px;
   }
 }
 
@@ -4241,6 +4257,11 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
 /* stylelint-disable-next-line */
 .layout-multiple-columns.no-reduce-motion .detailed-status__action-bar .icon-button.star-icon.activate .icon-star {
   left: -29px;
+  top: -41px;
+}
+
+.layout-multiple-columns.no-reduce-motion .detailed-status__action-bar {
+  height: 25.5px;
 }
 
 @media screen and (max-width: 889px) {