Template:CS button/styles.css: Difference between revisions
Jump to navigation
Jump to search
Content deleted Content added
No edit summary |
No edit summary |
||
| Line 10: | Line 10: | ||
border:none; |
border:none; |
||
border-radius:9999px; /* pill */ |
border-radius:9999px; /* pill */ |
||
text-decoration:none; /* |
text-decoration:none; /* remove underline on <a> */ |
||
box-sizing:border-box; |
box-sizing:border-box; |
||
text-align:center; |
text-align:center; |
||
| Line 17: | Line 17: | ||
cursor:pointer; |
cursor:pointer; |
||
} |
} |
||
| ⚫ | |||
/* ensure anchors keep the button text color */ |
|||
| ⚫ | |||
| ⚫ | |||
| ⚫ | |||
.capsach-btn:hover { background-color:#FFDD00; } |
.capsach-btn:hover { background-color:#FFDD00; } |
||
.capsach-btn:active { background-color:#F0C800; transform:translateY(1px); } |
.capsach-btn:active { background-color:#F0C800; transform:translateY(1px); } |
||
/* Mobile-only full-width (opt-in |
/* Mobile-only full-width (opt-in) */ |
||
@media (max-width:720px){ |
@media (max-width:720px){ |
||
.capsach-btn--mobile { display:block; width:100% !important; } |
.capsach-btn--mobile { display:block; width:100% !important; } |
||
Revision as of 04:10, 13 October 2025
.capsach-btn {
display:inline-block;
width:278px; /* default; override via |width= */
max-width:100%;
padding:.2em 1.5em;
font-weight:600;
color:#202122;
background-color:#FEE330; /* flat color */
background-image:none;
border:none;
border-radius:9999px; /* pill */
text-decoration:none; /* remove underline on <a> */
box-sizing:border-box;
text-align:center;
white-space:nowrap;
transition:background-color .15s, transform .05s;
cursor:pointer;
}
/* ensure anchors keep the button text color */
a.capsach-btn:link,
a.capsach-btn:visited { color:#202122; text-decoration:none; }
.capsach-btn:hover { background-color:#FFDD00; }
.capsach-btn:active { background-color:#F0C800; transform:translateY(1px); }
/* Mobile-only full-width (opt-in) */
@media (max-width:720px){
.capsach-btn--mobile { display:block; width:100% !important; }
}
.capsach-align { text-align:left; } /* default */
.capsach-align-right { text-align:right; }
.capsach-align-center { text-align:center; }
.capsach-align-left { text-align:left; }