perf: use overflow: clip instead of overflow: hidden (#9443)

* use overflow: clip

* revert
This commit is contained in:
tamaina 2023-01-02 12:15:26 +09:00 committed by GitHub
parent d98771711f
commit 46c2706b7e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 12 additions and 12 deletions

View file

@ -384,7 +384,7 @@ onBeforeUnmount(() => {
position: fixed; position: fixed;
max-width: 100%; max-width: 100%;
margin-top: calc(1em + 8px); margin-top: calc(1em + 8px);
overflow: hidden; overflow: clip;
transition: top 0.1s ease, left 0.1s ease; transition: top 0.1s ease, left 0.1s ease;
> ol { > ol {
@ -401,7 +401,7 @@ onBeforeUnmount(() => {
align-items: center; align-items: center;
padding: 4px 12px; padding: 4px 12px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: clip;
font-size: 0.9em; font-size: 0.9em;
cursor: default; cursor: default;

View file

@ -207,7 +207,7 @@ function onMousedown(evt: MouseEvent): void {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 6px; border-radius: 6px;
overflow: hidden; overflow: clip;
::v-deep(div) { ::v-deep(div) {
position: absolute; position: absolute;

View file

@ -468,7 +468,7 @@ function readPromo() {
&.collapsed { &.collapsed {
position: relative; position: relative;
max-height: 9em; max-height: 9em;
overflow: hidden; overflow: clip;
> .fade { > .fade {
display: block; display: block;

View file

@ -298,7 +298,7 @@ if (appearNote.replyId) {
.lxwezrsl { .lxwezrsl {
position: relative; position: relative;
transition: box-shadow 0.1s ease; transition: box-shadow 0.1s ease;
overflow: hidden; overflow: clip;
contain: content; contain: content;
&:focus-visible { &:focus-visible {

View file

@ -102,7 +102,7 @@ const vote = async (id) => {
//border: solid 0.5px var(--divider); //border: solid 0.5px var(--divider);
background: var(--accentedBg); background: var(--accentedBg);
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: clip;
cursor: pointer; cursor: pointer;
> .backdrop { > .backdrop {

View file

@ -59,7 +59,7 @@ const collapsed = $ref(
&.collapsed { &.collapsed {
position: relative; position: relative;
max-height: 9em; max-height: 9em;
overflow: hidden; overflow: clip;
> .fade { > .fade {
display: block; display: block;

View file

@ -175,7 +175,7 @@ onUnmounted(() => {
font-size: 14px; font-size: 14px;
box-shadow: 0 0 0 1px var(--divider); box-shadow: 0 0 0 1px var(--divider);
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: clip;
&:hover { &:hover {
text-decoration: none; text-decoration: none;

View file

@ -85,7 +85,7 @@ watch(() => props.user.avatarBlurhash, () => {
top: 0; top: 0;
border-radius: 100%; border-radius: 100%;
z-index: 1; z-index: 1;
overflow: hidden; overflow: clip;
object-fit: cover; object-fit: cover;
width: 100%; width: 100%;
height: 100%; height: 100%;

View file

@ -203,12 +203,12 @@ onUnmounted(() => {
> .main { > .main {
position: relative; position: relative;
overflow: hidden; overflow: clip;
> .banner-container { > .banner-container {
position: relative; position: relative;
height: 250px; height: 250px;
overflow: hidden; overflow: clip;
background-size: cover; background-size: cover;
background-position: center; background-position: center;

View file

@ -251,7 +251,7 @@ function onDrop(ev) {
--deckColumnHeaderHeight: 40px; --deckColumnHeaderHeight: 40px;
height: 100%; height: 100%;
overflow: hidden; overflow: clip;
contain: strict; contain: strict;
&.draghover { &.draghover {