// // Buttons and things that look like buttons //
.btn-selector {
@include fs-6; display: flex; // transform animation breaks without this on theme-colors and graph-type... cursor: pointer; user-select: none; padding: $sp-2; transition: all .2s ease-in-out; &:hover { transform: scale(1.5); } /* Hide the browser's default checkbox */ input { opacity: 0; height: 0; width: 0; } #graph-type-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-green); } #nav-type-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-orange); } #entry-head-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-brown); } #theme-colors-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-yellow); }
}
.entry-foot-selector {
@include fs-6; display: flex; cursor: pointer; user-select: none; padding-right: $sp-3; padding-top: $sp-3; transition: all .2s ease-in-out; &:hover { transform: scale(1.5); } /* Hide the browser's default checkbox */ input { opacity: 0; height: 0; width: 0; } #entry-foot-posts-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-purple); } #entry-foot-link-emoji-span { filter: drop-shadow(0 0 0.7mm $drop-shadow-brown); }
}
.bonsai-burger {
display: flex; flex-direction: column; position: fixed; right: $sp-2; bottom: $sp-4; cursor: pointer; user-select: none; filter: drop-shadow(0 0 0.7mm $drop-shadow-green); z-index: 5; /* Hide the browser's default checkbox */ input { opacity: 0; height: 0; width: 0; } #nav-base { margin-left: 10px; margin-right: 10px; } #nav-bonsai { margin-left: 5px; }
}
.connect {
// 'sticky footer' from: https://css-tricks.com/couple-takes-sticky-footer/#there-is-flexbox // ex = local // footer = connect // content = main-content // body = main-content-wrap // html, body = main flex-shrink: 0;
}