diff --git a/styles/corner-buttons.scarlet b/styles/corner-buttons.scarlet index ea5e2823..c8cc4634 100644 --- a/styles/corner-buttons.scarlet +++ b/styles/corner-buttons.scarlet @@ -14,41 +14,47 @@ mixin corner-buttons corner-buttons left content-padding +.corner-buttons, .corner-buttons-hide-on-mobile display flex + flex-flow row-reverse position absolute top content-padding right content-padding - .button - position absolute - opacity 0 - will-change opacity - - :first-child - opacity 1 - - :hover - .button - opacity 1 - - :nth-child(2) - transform translateX(-100%) - - :nth-child(3) - transform translateX(-200%) - - :nth-child(4) - transform translateX(-300%) - - :nth-child(5) - transform translateX(-400%) - -.corner-buttons, -.corner-buttons-hide-on-mobile button, .button margin-left 0.5rem + position static + opacity 1 + +< 1200px + .corner-buttons-hide-on-mobile + flex-flow row + + .button + position absolute + opacity 0 + will-change opacity + + :first-child + opacity 1 + + :hover + .button + opacity 1 + + :nth-child(2) + transform translateX(-100%) + + :nth-child(3) + transform translateX(-200%) + + :nth-child(4) + transform translateX(-300%) + + :nth-child(5) + transform translateX(-400%) < 600px .corner-buttons-hide-on-mobile