Sveskejuice
/
deprived-main-website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed everything on the left side being converted into image

This commit is contained in:
BOTAlex 2024-06-11 00:50:26 +02:00
parent 94d3d722ae
commit 62e803868c
1 changed files with 41 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/routes/zhen/cv/epos/+page.svelte
View File

@ -65,6 +65,7 @@
<LinkedInQR/> <LinkedInQR/>
</div> </div>
</div> </div>
<div id="leftSectionSeperator"><div/></div>
<div id="right-section"> <div id="right-section">
<AlexWatermark/> <AlexWatermark/>
<div id="TopRightSkillsText"> <div id="TopRightSkillsText">
@ -155,8 +156,6 @@
background-color: #bdd6ee; background-color: #bdd6ee;
width: calc(100% / 3 * 1); width: calc(100% / 3 * 1);
filter: drop-shadow(1mm 1mm 1mm #00000042);
> div:last-child { > div:last-child {
z-index: 1; z-index: 1;
width: 100%; width: 100%;
@ -194,35 +193,49 @@
} }
.decorations { .decorations {
> div { #leftSectionSeperator{
#TopRightSkillsText { position: relative;
position: absolute; height: 100%;
z-index: 0; width: 0%;
z-index: 1;
display: grid; overflow: visible;
place-items: center; > div {
vertical-align: top; position: absolute;
width: 100%; height: 100%;
width: 5mm;
place-content: center; z-index: 1;
background: linear-gradient(90deg, #3636364f, #00000000);
padding: 0; }
height: 50mm;
mask-image: linear-gradient(180deg, #000 0%, transparent 110%);
color: rgb(190, 190, 190);
font-family: 'CozetteVector';
font-size: x-large;
} }
> div {
#TopRightSkillsText {
position: absolute;
z-index: 0;
#Credit { display: grid;
position: absolute; place-items: center;
z-index: 0; vertical-align: top;
width: 100%;
display: flex; place-content: center;
align-self: flex-end;
} padding: 0;
height: 50mm;
mask-image: linear-gradient(180deg, #000 0%, transparent 110%);
color: rgb(190, 190, 190);
font-family: 'CozetteVector';
font-size: x-large;
}
#Credit {
position: absolute;
z-index: 0;
display: flex;
align-self: flex-end;
}
} }
} }
</style> </style>