Difference between revisions of "Widget:Homepage"
From LINKS Community Center
Line 50: | Line 50: | ||
.hp-areas h2 { text-align: center; margin-bottom: 1.5em; } | .hp-areas h2 { text-align: center; margin-bottom: 1.5em; } | ||
.hp-area { display: flex; flex-direction: column; align-items: center; margin-bottom: 2em; text-decoration: none; cursor: pointer; } | .hp-area { display: flex; flex-direction: column; align-items: center; margin-bottom: 2em; text-decoration: none; cursor: pointer; } | ||
− | .hp-area h3 { text-align: center; } | + | .hp-area h3 { text-align: center; position: relative; } |
+ | .hp-area h3::after { | ||
+ | content: ""; display: block; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; transform: scaleX(0); transform-origin: left; | ||
+ | } | ||
.hp-area:hover { text-decoration: none; } | .hp-area:hover { text-decoration: none; } | ||
.hp-area:hover h3 { font-weight: 700 !important; } | .hp-area:hover h3 { font-weight: 700 !important; } | ||
+ | .hp-area:hover h3::after { transform: scaleX(1); } | ||
.hp-area-icon { flex: 1 0; margin-right: 1em; user-select: none; } | .hp-area-icon { flex: 1 0; margin-right: 1em; user-select: none; } | ||
.hp-area-icon svg { width: 100px; height: 100px; } | .hp-area-icon svg { width: 100px; height: 100px; } |
Revision as of 17:02, 25 May 2022
Development verstion of the DCT Homepage.
Not ready for production!