@@ -4327,7 +4283,6 @@ onMounted(() => {
/* Play */
.play.has-lesson-actions {
- padding-bottom: 200px;
}
.play .play-head {
@@ -4554,9 +4509,10 @@ onMounted(() => {
text-align: left;
border: 1px solid var(--border);
padding: 20px;
+ margin-top: 5px;
background: color-mix(in srgb, var(--text) 6%, transparent);
cursor: pointer;
- border-radius: 16px;
+ border-radius: 6px;
transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
box-shadow: 0 10px 20px rgba(0, 0, 0, .18)
}
@@ -4567,7 +4523,7 @@ onMounted(() => {
.lesson.active {
outline: 1px solid color-mix(in srgb, var(--accent) 50%, transparent);
- box-shadow: 0 18px 32px rgba(34, 211, 238, .22)
+ box-shadow: 0 1px 12px rgba(34, 211, 238, .22)
}
.lesson.ok {
@@ -4910,17 +4866,14 @@ onMounted(() => {
align-items: center;
justify-content: space-between;
gap: 18px;
- padding: 20px 24px;
- border-radius: 24px;
border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
+ border-radius: 16px;
+ backdrop-filter: blur(12px);
+ -webkit-backdrop-filter: blur(12px);
background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 16%, transparent), color-mix(in srgb, var(--bg2) 82%, transparent));
box-shadow: 0 24px 44px rgba(2, 6, 23, .5);
- position: fixed;
- bottom: 24px;
- left: 50%;
- transform: translateX(-50%);
- width: min(calc(100% - 40px), 1100px);
z-index: 40;
+ padding: 16px 24px;
}
.lesson-actions-meta {
@@ -5276,7 +5229,6 @@ onMounted(() => {
}
.footer {
- margin: 60px 0 24px;
font-size: 13px;
color: var(--t3);
}