v6
This commit is contained in:
Flatlogic Bot
parent
390f2b5058
commit
ba54146f4e
@ -281,7 +281,9 @@ textarea::placeholder {
|
||||
.recliner-glow,
|
||||
.recliner-floor,
|
||||
.recliner-seat-pad,
|
||||
.recliner-back-inner {
|
||||
.recliner-back-inner,
|
||||
.recliner-head-pad,
|
||||
.recliner-arm-top {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@ -312,45 +314,20 @@ textarea::placeholder {
|
||||
|
||||
.recliner-block {
|
||||
position: absolute;
|
||||
background: linear-gradient(180deg, #2a323d 0%, #171c22 100%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 18px 34px rgba(0, 0, 0, 0.22);
|
||||
background: linear-gradient(145deg, #353d4a 0%, #1f252d 100%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.1), 0 15px 30px rgba(0, 0, 0, 0.4);
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
.recliner-block::before,
|
||||
.recliner-block::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.recliner-block::before {
|
||||
left: 10px;
|
||||
right: 0;
|
||||
bottom: 100%;
|
||||
height: 18px;
|
||||
background: linear-gradient(90deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.05));
|
||||
clip-path: polygon(0 100%, 100% 100%, calc(100% - 10px) 0, 10px 0);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.recliner-block::after {
|
||||
top: 8px;
|
||||
left: 100%;
|
||||
bottom: 0;
|
||||
width: 18px;
|
||||
background: linear-gradient(180deg, rgba(10, 12, 15, 0.44), rgba(255, 255, 255, 0.04));
|
||||
clip-path: polygon(0 0, 100% 10px, 100% 100%, 0 calc(100% - 8px));
|
||||
}
|
||||
|
||||
.recliner-plinth {
|
||||
left: 138px;
|
||||
bottom: 52px;
|
||||
width: 126px;
|
||||
height: 28px;
|
||||
border-radius: 18px;
|
||||
border-radius: 12px;
|
||||
transform: translateZ(10px);
|
||||
background: #171c22;
|
||||
}
|
||||
|
||||
.recliner-column {
|
||||
@ -358,8 +335,9 @@ textarea::placeholder {
|
||||
bottom: 80px;
|
||||
width: 38px;
|
||||
height: 72px;
|
||||
border-radius: 18px;
|
||||
border-radius: 8px;
|
||||
transform: translateZ(22px);
|
||||
background: #1d232b;
|
||||
}
|
||||
|
||||
.recliner-base {
|
||||
@ -367,7 +345,7 @@ textarea::placeholder {
|
||||
bottom: 106px;
|
||||
width: 110px;
|
||||
height: 52px;
|
||||
border-radius: 28px 28px 20px 20px;
|
||||
border-radius: 20px;
|
||||
transform: translateZ(40px);
|
||||
}
|
||||
|
||||
@ -376,19 +354,18 @@ textarea::placeholder {
|
||||
bottom: 152px;
|
||||
width: 142px;
|
||||
height: 82px;
|
||||
border-radius: 28px 26px 18px 18px;
|
||||
border-radius: 20px;
|
||||
transform: translateZ(62px);
|
||||
}
|
||||
|
||||
.recliner-seat-pad {
|
||||
left: 158px;
|
||||
bottom: 166px;
|
||||
width: 112px;
|
||||
height: 46px;
|
||||
border-radius: 20px 18px 16px 16px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03));
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
|
||||
left: 150px;
|
||||
bottom: 158px;
|
||||
width: 130px;
|
||||
height: 70px;
|
||||
border-radius: 16px;
|
||||
background: linear-gradient(135deg, #4a5460 0%, #2a323d 100%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
transform: translateZ(78px);
|
||||
}
|
||||
|
||||
@ -397,7 +374,7 @@ textarea::placeholder {
|
||||
bottom: 160px;
|
||||
width: 28px;
|
||||
height: 102px;
|
||||
border-radius: 18px;
|
||||
border-radius: 12px;
|
||||
transform: translateZ(64px);
|
||||
}
|
||||
|
||||
@ -408,25 +385,35 @@ textarea::placeholder {
|
||||
transform: translateZ(34px);
|
||||
}
|
||||
|
||||
.recliner-arm-top {
|
||||
left: 126px;
|
||||
bottom: 240px;
|
||||
width: 24px;
|
||||
height: 16px;
|
||||
border-radius: 8px;
|
||||
background: #4a5460;
|
||||
transform: translateZ(80px);
|
||||
}
|
||||
|
||||
.recliner-back {
|
||||
left: 114px;
|
||||
bottom: 194px;
|
||||
width: 92px;
|
||||
height: 142px;
|
||||
border-radius: 30px;
|
||||
border-radius: 24px;
|
||||
transform-origin: right bottom;
|
||||
transform: translateZ(66px) rotate(calc(-6deg + (var(--angle) * 0.38deg) + (var(--back-angle) * 1deg)));
|
||||
background: linear-gradient(145deg, #3d4652 0%, #252b34 100%);
|
||||
}
|
||||
|
||||
.recliner-back-inner {
|
||||
left: 130px;
|
||||
bottom: 210px;
|
||||
width: 60px;
|
||||
height: 104px;
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03));
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
|
||||
left: 122px;
|
||||
bottom: 202px;
|
||||
width: 76px;
|
||||
height: 126px;
|
||||
border-radius: 16px;
|
||||
background: linear-gradient(135deg, #515d6a 0%, #353d4a 100%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
transform-origin: right bottom;
|
||||
transform: translateZ(82px) rotate(calc(-6deg + (var(--angle) * 0.38deg) + (var(--back-angle) * 1deg)));
|
||||
}
|
||||
@ -436,19 +423,31 @@ textarea::placeholder {
|
||||
bottom: 308px;
|
||||
width: 74px;
|
||||
height: 38px;
|
||||
border-radius: 22px;
|
||||
border-radius: 16px;
|
||||
transform-origin: right bottom;
|
||||
transform: translateZ(86px) rotate(calc(-10deg + (var(--angle) * 0.14deg) + (var(--head-angle) * 1deg)));
|
||||
}
|
||||
|
||||
.recliner-head-pad {
|
||||
left: 128px;
|
||||
bottom: 312px;
|
||||
width: 66px;
|
||||
height: 30px;
|
||||
border-radius: 12px;
|
||||
background: linear-gradient(135deg, #515d6a 0%, #353d4a 100%);
|
||||
transform-origin: right bottom;
|
||||
transform: translateZ(98px) rotate(calc(-10deg + (var(--angle) * 0.14deg) + (var(--head-angle) * 1deg)));
|
||||
}
|
||||
|
||||
.recliner-leg {
|
||||
left: 284px;
|
||||
bottom: 166px;
|
||||
width: 58px;
|
||||
height: 118px;
|
||||
border-radius: 20px;
|
||||
border-radius: 16px;
|
||||
transform-origin: left center;
|
||||
transform: translateZ(46px) rotate(calc(10deg + (var(--angle) * 0.34deg) + (var(--leg-angle) * 1deg)));
|
||||
background: linear-gradient(145deg, #3d4652 0%, #252b34 100%);
|
||||
}
|
||||
|
||||
.recliner-footpad {
|
||||
@ -456,9 +455,10 @@ textarea::placeholder {
|
||||
bottom: 208px;
|
||||
width: 42px;
|
||||
height: 58px;
|
||||
border-radius: 18px;
|
||||
border-radius: 12px;
|
||||
transform-origin: left center;
|
||||
transform: translateZ(30px) rotate(calc(10deg + (var(--angle) * 0.2deg) + (var(--leg-angle) * 1deg)));
|
||||
background: linear-gradient(135deg, #515d6a 0%, #353d4a 100%);
|
||||
}
|
||||
|
||||
.recliner-figure.is-vibrating .recliner-glow {
|
||||
|
||||
@ -163,9 +163,11 @@ if (isset($_GET['saved']) && ctype_digit((string) $_GET['saved'])) {
|
||||
<div class="recliner-seat-pad"></div>
|
||||
<div class="recliner-arm recliner-block"></div>
|
||||
<div class="recliner-arm recliner-arm-secondary recliner-block"></div>
|
||||
<div class="recliner-arm-top"></div>
|
||||
<div class="recliner-back recliner-block" id="part-back"></div>
|
||||
<div class="recliner-back-inner" id="part-back-inner"></div>
|
||||
<div class="recliner-head recliner-block" id="part-head"></div>
|
||||
<div class="recliner-head-pad" id="part-head-pad"></div>
|
||||
<div class="recliner-leg recliner-block" id="part-leg"></div>
|
||||
<div class="recliner-footpad recliner-block" id="part-footpad"></div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user