More actions
mNo edit summary |
No edit summary |
||
| (8 intermediate revisions by the same user not shown) | |||
| Line 3: | Line 3: | ||
* Super hacky way to get transclusion and hover works | * Super hacky way to get transclusion and hover works | ||
**/ | **/ | ||
#home-card-prevblogs .citizen-overflow-content, | |||
#home-card-prevblogs .wikitable { | #home-card-prevblogs .wikitable { | ||
overflow: visible; | overflow: visible; | ||
} | } | ||
#home-card-prevblogs .wikitable, | |||
#home-card-prevblogs .wikitable tbody { | #home-card-prevblogs .wikitable tbody { | ||
display: block; | display: block; | ||
| Line 26: | Line 27: | ||
#home-card-prevblogs .wikitable tr > td:first-child:hover ~ td { | #home-card-prevblogs .wikitable tr > td:first-child:hover ~ td { | ||
opacity: 1; | |||
visibility: visible; | visibility: visible; | ||
transform: translateY( -16px ); | |||
} | } | ||
#home-card-prevblogs .wikitable tr > td:last-child { | #home-card-prevblogs .wikitable tr > td:last-child { | ||
position: absolute; | |||
z-index: 2; | |||
bottom: 100%; | |||
padding: 0; | |||
background: var( --color-surface-1 ); | |||
border-radius: var( --border-radius--medium ); | |||
box-shadow: var( --box-shadow-dialog ); | |||
user-select: none; | |||
opacity: 0; | |||
visibility: hidden; | |||
transition: var( --transition-menu ); | |||
transition-property: opacity, transform; | |||
} | |||
#home-card-prevblogs .wikitable tr > td:last-child i { | |||
padding: var( --space-md ); | |||
display: block; | |||
} | |||
#home-card-prevblogs .wikitable tr > td:last-child .figure-image { | |||
float: none; | |||
margin: 0; | |||
width: 100%; | |||
} | |||
#home-card-prevblogs .wikitable tr > td:last-child .figure-image > a { | |||
display: block; | |||
} | |||
#home-card-prevblogs .wikitable tr > td:last-child .figure-image img { | |||
width: 100%; | |||
height: 100%; | |||
border-radius: var(--border-radius--medium) var(--border-radius--medium) 0 0; | |||
} | |||
/* Updates module */ | |||
/** | |||
* EXTREMELY HACKY | |||
* Super hacky way to get transclusion and hover works | |||
**/ | |||
#home-card-prevupdate .citizen-overflow-content, | |||
#home-card-prevupdate .wikitable { | |||
overflow: visible; | |||
} | |||
#home-card-prevupdate .wikitable, | |||
#home-card-prevupdate .wikitable tbody { | |||
display: block; | |||
} | |||
#home-card-prevupdate .wikitable th { | |||
display: none; | |||
} | |||
#home-card-prevupdate .wikitable tr { | |||
position: relative; | |||
display: flex; | |||
} | |||
#home-card-prevupdate .wikitable tr > td:first-child:hover ~ td, | |||
#home-card-prevupdate .wikitable tr > td:nth-child(2):hover ~ td | |||
{ | |||
opacity: 1; | |||
visibility: visible; | |||
} | |||
#home-card-prevupdate .wikitable tr > td:first-child { | |||
width: 100%; | |||
} | |||
#home-card-prevupdate .wikitable tr > td:last-child { | |||
position: absolute; | position: absolute; | ||
z-index: 2; | z-index: 2; | ||
| Line 40: | Line 117: | ||
user-select: none; | user-select: none; | ||
visibility: hidden; | visibility: hidden; | ||
transition: var( --transition-menu ); | |||
transition-property: opacity, transform; | |||
} | } | ||
#home-card- | #home-card-prevupdate .wikitable tr > td:last-child .thumb { | ||
width: 100%; | width: 100%; | ||
margin: 0; | margin: 0; | ||
margin-bottom: 0.5rem; | margin-bottom: 0.5rem; | ||
} | } | ||
Latest revision as of 16:51, 17 July 2024
/**
* EXTREMELY HACKY
* Super hacky way to get transclusion and hover works
**/
#home-card-prevblogs .citizen-overflow-content,
#home-card-prevblogs .wikitable {
overflow: visible;
}
#home-card-prevblogs .wikitable,
#home-card-prevblogs .wikitable tbody {
display: block;
}
#home-card-prevblogs .wikitable th {
display: none;
}
#home-card-prevblogs .wikitable tr {
position: relative;
display: flex;
}
#home-card-prevblogs .wikitable tr > td:first-child {
width: 100%;
}
#home-card-prevblogs .wikitable tr > td:first-child:hover ~ td {
opacity: 1;
visibility: visible;
transform: translateY( -16px );
}
#home-card-prevblogs .wikitable tr > td:last-child {
position: absolute;
z-index: 2;
bottom: 100%;
padding: 0;
background: var( --color-surface-1 );
border-radius: var( --border-radius--medium );
box-shadow: var( --box-shadow-dialog );
user-select: none;
opacity: 0;
visibility: hidden;
transition: var( --transition-menu );
transition-property: opacity, transform;
}
#home-card-prevblogs .wikitable tr > td:last-child i {
padding: var( --space-md );
display: block;
}
#home-card-prevblogs .wikitable tr > td:last-child .figure-image {
float: none;
margin: 0;
width: 100%;
}
#home-card-prevblogs .wikitable tr > td:last-child .figure-image > a {
display: block;
}
#home-card-prevblogs .wikitable tr > td:last-child .figure-image img {
width: 100%;
height: 100%;
border-radius: var(--border-radius--medium) var(--border-radius--medium) 0 0;
}
/* Updates module */
/**
* EXTREMELY HACKY
* Super hacky way to get transclusion and hover works
**/
#home-card-prevupdate .citizen-overflow-content,
#home-card-prevupdate .wikitable {
overflow: visible;
}
#home-card-prevupdate .wikitable,
#home-card-prevupdate .wikitable tbody {
display: block;
}
#home-card-prevupdate .wikitable th {
display: none;
}
#home-card-prevupdate .wikitable tr {
position: relative;
display: flex;
}
#home-card-prevupdate .wikitable tr > td:first-child:hover ~ td,
#home-card-prevupdate .wikitable tr > td:nth-child(2):hover ~ td
{
opacity: 1;
visibility: visible;
}
#home-card-prevupdate .wikitable tr > td:first-child {
width: 100%;
}
#home-card-prevupdate .wikitable tr > td:last-child {
position: absolute;
z-index: 2;
bottom: 100%;
padding: 15px var( --padding-page );
margin-bottom: 10px;
background: var( --color-surface-1 );
border-radius: var( --border-radius--medium );
box-shadow: var( --box-shadow-dialog );
user-select: none;
visibility: hidden;
transition: var( --transition-menu );
transition-property: opacity, transform;
}
#home-card-prevupdate .wikitable tr > td:last-child .thumb {
width: 100%;
margin: 0;
margin-bottom: 0.5rem;
}