potential swiper fix

This commit is contained in:
ThatOneCalculator 2022-11-06 13:32:25 -08:00
parent 3ea4c8cba6
commit b3b4a7169d
2 changed files with 34 additions and 163 deletions

View file

@ -1,6 +1,6 @@
{
"name": "calckey",
"version": "12.119.0-calc.8-rc.5",
"version": "12.119.0-calc.8-rc.6",
"codename": "aqua",
"repository": {
"type": "git",

View file

@ -1,6 +1,7 @@
<template>
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<div>
<MkSpacer :content-max="800">
<swiper
:modules="[Virtual]"
@ -33,6 +34,7 @@
</swiper-slide>
</swiper>
</MkSpacer>
</div>
</MkStickyContainer>
</template>
@ -192,136 +194,5 @@ function syncSlide(index) {
> .start {
margin: 0 auto var(--margin) auto;
}
> .history {
> .message {
display: block;
text-decoration: none;
margin-bottom: var(--margin);
* {
pointer-events: none;
user-select: none;
}
&:hover {
.avatar {
filter: saturate(200%);
}
}
&:active {
}
&.isRead,
&.isMe {
opacity: 0.8;
}
&:not(.isMe):not(.isRead) {
> div {
background-image: url("/client-assets/unread.svg");
background-repeat: no-repeat;
background-position: 0 center;
}
}
&:after {
content: "";
display: block;
clear: both;
}
> div {
padding: 20px 30px;
&:after {
content: "";
display: block;
clear: both;
}
> header {
display: flex;
align-items: center;
margin-bottom: 2px;
white-space: nowrap;
overflow: hidden;
> .name {
margin: 0;
padding: 0;
overflow: hidden;
text-overflow: ellipsis;
font-size: 1em;
font-weight: bold;
transition: all 0.1s ease;
}
> .username {
margin: 0 8px;
}
> .time {
margin: 0 0 0 auto;
}
}
> .avatar {
float: left;
width: 54px;
height: 54px;
margin: 0 16px 0 0;
border-radius: 8px;
transition: all 0.1s ease;
}
> .body {
> .text {
display: block;
margin: 0 0 0 0;
padding: 0;
overflow: hidden;
overflow-wrap: break-word;
font-size: 1.1em;
color: var(--faceText);
.me {
opacity: 0.7;
}
}
> .image {
display: block;
max-width: 100%;
max-height: 512px;
}
}
}
}
}
&.max-width_400px {
> .history {
> .message {
&:not(.isMe):not(.isRead) {
> div {
background-image: none;
border-left: solid 4px #3aa2dc;
}
}
> div {
padding: 16px;
font-size: 0.9em;
> .avatar {
margin: 0 12px 0 0;
}
}
}
}
}
}
</style>