gitea-mirror/hacktricks-cloud
1
0
Fork 0
mirror of https://github.com/HackTricks-wiki/hacktricks-cloud.git synced 2026-06-12 19:11:44 -07:00
Code Issues Packages Projects Releases Wiki Activity

Improve sponsor ad hover layout

Browse Source
This commit is contained in:
Carlos Polop
2026-05-18 20:51:42 +02:00
parent 72f0f71ef5
commit caf7c4bcfd
1 changed files with 31 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme/pagetoc.css
+31 -11
View File
@@ -128,6 +128,7 @@
display: none; /*changed via JS once ad is loaded*/ display: none; /*changed via JS once ad is loaded*/
flex-direction: column; flex-direction: column;
text-decoration: none !important; text-decoration: none !important;
overflow: hidden;
backdrop-filter: blur(6px); backdrop-filter: blur(6px);
} }
.sidesponsor img { .sidesponsor img {
@@ -159,12 +160,13 @@
overflow: hidden; overflow: hidden;
} }
.sidesponsor .sponsor-title{ .sidesponsor .sponsor-title{
margin-top: 5px; margin-top: 3px;
margin-bottom: 5px; margin-bottom: 3px;
margin-left: 15px; margin-left: 15px;
margin-right: 15px; margin-right: 15px;
font-weight: 800; font-weight: 800;
font-size: 2rem; font-size: 2rem;
line-height: 1.08;
color: var(--sponsor-fg); color: var(--sponsor-fg);
} }
.sidesponsor:hover .sponsor-title{ .sidesponsor:hover .sponsor-title{
@@ -175,29 +177,37 @@
font-size: 1.55rem; font-size: 1.55rem;
line-height: 1.15; line-height: 1.15;
overflow-wrap: anywhere; overflow-wrap: anywhere;
animation: sponsorTextReveal .3s ease .12s both;
} }
.sidesponsor .sponsor-description{ .sidesponsor .sponsor-description{
display:none; display: block;
margin-top: 5px; margin-top: 5px;
margin-bottom: 15px; margin-bottom: 15px;
margin-left: 15px; margin-left: 15px;
margin-right: 15px; margin-right: 15px;
color: var(--sponsor-fg); color: var(--sponsor-fg);
transition-property: all; max-height: 0;
transition-timing-function: cubic-bezier(.4,0,.2,1); opacity: 0;
transition-duration: .3s; visibility: hidden;
overflow: scroll; overflow: hidden;
transition:
opacity .18s ease .14s,
visibility 0s linear .32s;
} }
.sidesponsor:hover .sponsor-description{ .sidesponsor:hover .sponsor-description{
display:block;
grid-area: sponsor-description; grid-area: sponsor-description;
min-height: 0; min-height: 0;
max-height: 100%; max-height: 100%;
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
font-size: calc(1em - 1px); font-size: calc(1em - 1px);
opacity: 1;
visibility: visible;
overflow: auto; overflow: auto;
overscroll-behavior: contain; overscroll-behavior: contain;
transition:
opacity .18s ease .14s,
visibility 0s linear 0s;
} }
.sidesponsor .sponsor-cta{ .sidesponsor .sponsor-cta{
margin-top: auto; margin-top: auto;
@@ -209,20 +219,30 @@
border-radius: 8px; border-radius: 8px;
background-color: var(--fg); background-color: var(--fg);
color: var(--bg); color: var(--bg);
font-weight: 800;
} }
.sidesponsor:hover .sponsor-cta{ .sidesponsor:hover .sponsor-cta{
grid-area: sponsor-cta; grid-area: sponsor-cta;
margin-top: 0; margin-top: 0;
margin-bottom: 4px; margin-bottom: 4px;
padding: 7px 10px; padding: 10px 14px;
box-sizing: border-box; box-sizing: border-box;
max-width: 100%; max-width: 100%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
font-size: 1.08rem; font-size: 1.2rem;
font-weight: 700; font-weight: 800;
line-height: 1.1; line-height: 1.1;
animation: sponsorTextReveal .3s ease .12s both;
}
@keyframes sponsorTextReveal {
0%, 45% {
opacity: 0;
}
100% {
opacity: 1;
}
} }
.sidesponsor-bsa { .sidesponsor-bsa {
max-height: 40%; max-height: 40%;