.postMenu { position: absolute; background-color: var(--post-menu-desktop-background-color); border-bottom: var(--post-menu-desktop-border-bottom); border-right: var(--post-menu-desktop-border-right); outline: none; z-index: 2; } .postMenuBtnWrapper { position: relative; display: inline-block; padding-left: 15px; } .postMenuBtn { color: var(--post-menu-desktop-button-color); transition: transform 0.1s; transform: rotate(90deg); position: absolute; bottom: -4px; } .postMenuBtn:hover { cursor: pointer; color: var(--post-menu-desktop-button-color-hover); } .postMenuItem { cursor: pointer; padding: 2px 4px; border: 1px solid var(--post-menu-desktop-item-border-color); background-color: var(--post-menu-desktop-item-background-color); border-bottom: none; } .postMenuItem:hover { background-color: var(--post-menu-desktop-item-hover-background-color); } .dropdown { position: relative; } .dropdownMenu { position: absolute; left: 100%; top: -1px; display: none; border-bottom: var(--post-menu-desktop-border-bottom); border-right: var(--post-menu-desktop-border-right); } .dropdown a { text-decoration: none; color: inherit; } .dropdown:hover .dropdownMenu { display: block; } .postMenuBtnCatalogWrapper { left: 5px; top: 5px; position: relative; } .postMenuBtnCatalog { position: absolute; bottom: 5px; line-height: 1em; color: var(--catalog-post-menu-desktop-btn-color); opacity: var(--catalog-post-menu-desktop-btn-opacity); transition: transform 0.1s; } .postMenuBtnCatalog:hover { cursor: pointer; color: var(--catalog-post-menu-desktop-btn-hover-color); opacity: var(--catalog-post-menu-desktop-btn-hover-opacity); } .postMenuBtnCatalog { /* preserve unicode triangle for button, some browsers will use an emoji */ font-variant: normal; font-feature-settings: "tnum"; -webkit-font-feature-settings: "tnum"; /* Chrome, Opera, and Safari */ -moz-font-feature-settings: "tnum"; /* Firefox */ font-variant-numeric: tabular-nums; } @media (max-width: 640px) { .postMenuBtn { width: 1em; text-align: center; font-weight: 700; font-size: 16px; } .postMenuBtnWrapper { position: relative; padding-right: 12px; } } @media (min-width: 640px) { .postMenuBtn { right: -2px; opacity: var(--post-menu-desktop-btn-opacity); } .stickyIconWrapper { padding-right: 18px; } }