💄 fix overflow

This commit is contained in:
目棃
2025-01-17 17:37:55 +08:00
parent 054a0839c6
commit e332dcf384

View File

@@ -1,6 +1,5 @@
<template> <template>
<TOverlay v-model="visible"> <TOverlay v-model="visible" v-if="props.data">
<div v-if="props.data" class="ton-container">
<slot name="left"></slot> <slot name="left"></slot>
<div class="ton-box"> <div class="ton-box">
<img <img
@@ -27,7 +26,6 @@
</v-btn> </v-btn>
</div> </div>
<slot name="right"></slot> <slot name="right"></slot>
</div>
</TOverlay> </TOverlay>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@@ -136,13 +134,6 @@ async function shareNameCard(): Promise<void> {
} }
</script> </script>
<style lang="css" scoped> <style lang="css" scoped>
.ton-container {
display: flex;
align-items: center;
justify-content: center;
column-gap: 10px;
}
.ton-box { .ton-box {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
@@ -155,6 +146,7 @@ async function shareNameCard(): Promise<void> {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 10px;
} }
.ton-type { .ton-type {
@@ -172,12 +164,14 @@ async function shareNameCard(): Promise<void> {
right: 0; right: 0;
left: 0; left: 0;
display: flex; display: flex;
overflow: hidden;
width: 100%; width: 100%;
height: 100%; height: 100%;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
justify-content: flex-end; justify-content: flex-end;
padding: 10px; padding: 10px;
border-radius: 10px;
backdrop-filter: blur(5px); backdrop-filter: blur(5px);
background: rgb(0 0 0 / 25%); background: rgb(0 0 0 / 25%);
color: var(--tgc-white-1); color: var(--tgc-white-1);