1/* Handles Button's hover effects on desktop */ 2/* TODO dark mode */ 3 4.button__border { 5 border: 1px solid rgba(0, 0, 0, 0.2); 6} 7.darkMode .button__border { 8 border: 1px solid rgba(255, 255, 255, 0.2); 9} 10.button__border_blue:hover { 11 border: 1px solid rgba(77, 142, 255, 0.3); 12} 13.button__border_red:hover { 14 border: 1px solid rgba(255, 77, 97, 0.3); 15} 16.button__border_green:hover { 17 border: 1px solid rgba(55, 189, 153, 0.3); 18} 19.button__border_purple:hover { 20 border: 1px solid rgba(112, 78, 186, 0.3); 21} 22.button__border_black:hover { 23 border: 1px solid rgba(0, 0, 0, 0.3); 24} 25 26.button__underlay { 27 position: absolute; 28 bottom: 0; 29 left: 0; 30 right: 0; 31 top: 0; 32 border-radius: 4px; 33 transition: background-color 0.2s ease-out; 34} 35.button__underlay_black10:hover { 36 background-color: rgba(0, 0, 0, 0.1); 37} 38.darkMode .button__underlay_black10:hover { 39 background-color: rgba(255, 255, 255, 0.1); 40} 41.button__underlay_blue:hover { 42 background-color: rgba(76, 142, 255, 0.05); 43} 44.button__underlay_red:hover { 45 background-color: rgba(255, 77, 97, 0.05); 46} 47.button__underlay_green:hover { 48 background-color: rgba(55, 189, 153, 0.05); 49} 50.button__underlay_purple:hover { 51 background-color: rgba(112, 78, 186, 0.05); 52} 53.button__underlay_black:hover { 54 background-color: rgba(0, 0, 0, 0.05); 55} 56.darkMode .button__underlay_black:hover { 57 background-color: rgba(255, 255, 255, 0.05); 58} 59.button__underlay_yellow:hover { 60 background-color: rgba(255, 248, 90, 0.05); 61} 62 63.buttonNyctographicHover span { 64 font-family: Nyctographic !important; 65 width: 64px; 66} 67.buttonNyctographicHover:hover span { 68 font-family: Keybase !important; 69 width: 64px; 70} 71