Template:Stakeholder count widget/styles.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 7: | Line 7: | ||
} | } | ||
/* Make | /* Make each tile a fixed-width button */ | ||
.stakeholder-count-widget | .stakeholder-count-widget-tile a { | ||
display: | display: flex; | ||
flex-direction: column; | |||
justify-content: space-between; | |||
align-items: center; | |||
width: 220px; | width: 220px; | ||
padding: | min-height: 120px; | ||
padding: 10px 0; | |||
text-align: center; | text-align: center; | ||
border: 1.5px solid #000001; | border: 1.5px solid #000001; | ||
border-radius: 2px; | border-radius: 2px; | ||
background: transparent; | background: transparent; | ||
color: inherit; | color: inherit; | ||
| Line 30: | Line 35: | ||
/* Hover: grey fill, crisp border, slight lift */ | /* Hover: grey fill, crisp border, slight lift */ | ||
.stakeholder-count-widget | .stakeholder-count-widget-tile a:hover { | ||
border-color: #000; | border-color: #000; | ||
background-color: #f2f2f2; | background-color: #f2f2f2; | ||
| Line 37: | Line 42: | ||
/* Active: pressed look */ | /* Active: pressed look */ | ||
.stakeholder-count-widget | .stakeholder-count-widget-tile a:active { | ||
transform: translateY(0); | transform: translateY(0); | ||
} | } | ||
/* | /* Title, count, and link text tweaks */ | ||
.stakeholder-count-widget-tile .tile-title { | |||
margin-bottom: 4px; | |||
} | |||
.stakeholder-count-widget-tile .count { | .stakeholder-count-widget-tile .count { | ||
font-size: 1.3em; | |||
font-size: 1. | |||
font-weight: 700; | font-weight: 700; | ||
margin | margin: 4px 0; | ||
} | } | ||
.stakeholder-count-widget-tile .see-link { | .stakeholder-count-widget-tile .see-link { | ||
font-size: 0.85em; | font-size: 0.85em; | ||
opacity: 0.7; | opacity: 0.7; | ||
margin-top: 4px; | |||
} | } | ||
Revision as of 13:13, 20 November 2025
/* Dashboard layout */
.stakeholder-count-widget {
display: flex;
gap: 1em;
flex-wrap: wrap;
margin: 1em 0;
}
/* Make each tile a fixed-width button */
.stakeholder-count-widget-tile a {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
width: 220px;
min-height: 120px;
padding: 10px 0;
text-align: center;
border: 1.5px solid #000001;
border-radius: 2px;
background: transparent;
color: inherit;
text-decoration: none;
font-weight: 600;
font-size: 0.95em;
letter-spacing: 0.01em;
transition:
transform 0.15s ease,
border-color 0.15s ease,
background-color 0.2s ease;
}
/* Hover: grey fill, crisp border, slight lift */
.stakeholder-count-widget-tile a:hover {
border-color: #000;
background-color: #f2f2f2;
transform: translateY(-1px);
}
/* Active: pressed look */
.stakeholder-count-widget-tile a:active {
transform: translateY(0);
}
/* Title, count, and link text tweaks */
.stakeholder-count-widget-tile .tile-title {
margin-bottom: 4px;
}
.stakeholder-count-widget-tile .count {
font-size: 1.3em;
font-weight: 700;
margin: 4px 0;
}
.stakeholder-count-widget-tile .see-link {
font-size: 0.85em;
opacity: 0.7;
margin-top: 4px;
}