HerrHulaHoop (talk | contribs) (Add CSS for disclaimer box) |
HerrHulaHoop (talk | contribs) No edit summary |
||
Line 18: | Line 18: | ||
padding: 1em; | padding: 1em; | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
} | |||
/* Add styling for kbd HTML tag */ | |||
kbd { | |||
box-sizing: border-box; | |||
line-height: 80px; | |||
font-size: 22px; | |||
text-align: center; | |||
width: 80px; | |||
color: #555; | |||
cursor: pointer; | |||
margin: 0 8px; | |||
height: 80px; | |||
border-color: #f2f2f2; | |||
border-style: solid; | |||
text-shadow: 0 0.5px 1px #777, 0 2px 6px #f2f2f2; | |||
border-width: 1px; | |||
border-radius: 10px; | |||
background: -webkit-linear-gradient(top, #f9f9f9 0%, #D2D2D2 80%, #c0c0c0 100%); | |||
font-family: sans-serif; | |||
display: inline-block; | |||
transition: box-shadow 0.3s ease, transform 0.15s ease; | |||
box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 6px 0 #C0C0C0, 0 8px 17px rgba(#444, 0.4), 2px 1px 4px rgba(#444, 0.25), -2px 1px 4px rgba(#444, 0.25), 0 9px 16px rgba(#444, 0.1); | |||
&:hover, | |||
&:focus { | |||
box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 4px 0 #C0C0C0, 0 2px 35px rgba(#444, 0.3), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 7px 4px rgba(#444, 0.1); | |||
transform: translateY(2px); | |||
} | |||
&:active { | |||
box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 0 0 #C0C0C0, 0 0px 30px rgba(#444, 0.15), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 0px 4px rgba(#444, 0.25); | |||
transform: translateY(4px); | |||
} | |||
} | } |
Revision as of 14:06, 12 June 2021
/* CSS placed here will be applied to all skins */ /* Hide the title on the main page */ .action-view.page-Main_Page #siteSub, .action-submit.page-Main_Page #siteSub, .action-view.page-Main_Page #contentSub, .action-submit.page-Main_Page #contentSub, .action-view.page-Main_Page .firstHeading, .action-submit.page-Main_Page .firstHeading { display: none; } .text-bottomline { border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #a2a9b1; } #disclaimer-box { border: 1px solid #eaecf0; padding: 1em; background-color: #f8f9fa; } /* Add styling for kbd HTML tag */ kbd { box-sizing: border-box; line-height: 80px; font-size: 22px; text-align: center; width: 80px; color: #555; cursor: pointer; margin: 0 8px; height: 80px; border-color: #f2f2f2; border-style: solid; text-shadow: 0 0.5px 1px #777, 0 2px 6px #f2f2f2; border-width: 1px; border-radius: 10px; background: -webkit-linear-gradient(top, #f9f9f9 0%, #D2D2D2 80%, #c0c0c0 100%); font-family: sans-serif; display: inline-block; transition: box-shadow 0.3s ease, transform 0.15s ease; box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 6px 0 #C0C0C0, 0 8px 17px rgba(#444, 0.4), 2px 1px 4px rgba(#444, 0.25), -2px 1px 4px rgba(#444, 0.25), 0 9px 16px rgba(#444, 0.1); &:hover, &:focus { box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 4px 0 #C0C0C0, 0 2px 35px rgba(#444, 0.3), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 7px 4px rgba(#444, 0.1); transform: translateY(2px); } &:active { box-shadow: 0 0 1px #888,0 1px 0 #fff, 0 0 0 #C0C0C0, 0 0px 30px rgba(#444, 0.15), 2px 2px 4px rgba(#444, 0.25), -2px 2px 4px rgba(#444, 0.25), 0 0px 4px rgba(#444, 0.25); transform: translateY(4px); } }