profxadke/misskey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix(client): style tweak for ios

Browse source
This commit is contained in:
syuilo 2022-07-03 16:17:31 +09:00
parent 01688b543a
commit e393ab6044
24 changed files with 37 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/client/src/components/drive-file-thumbnail.vue
View file

@ -59,7 +59,7 @@ const isThumbnailAvailable = computed(() => {
display: flex; display: flex;
background: var(--panel); background: var(--panel);
border-radius: 8px; border-radius: 8px;
overflow: clip; overflow: hidden; overflow: clip;
> .icon-sub { > .icon-sub {
position: absolute; position: absolute;

2
packages/client/src/components/form/range.vue
View file

@ -189,7 +189,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
height: 3px; height: 3px;
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
border-radius: 999px; border-radius: 999px;
overflow: clip; overflow: hidden; overflow: clip;
> .highlight { > .highlight {
position: absolute; position: absolute;

2
packages/client/src/components/marquee.vue
View file

@ -76,7 +76,7 @@ export default {
<style lang="scss" module> <style lang="scss" module>
.wrap { .wrap {
overflow: clip; overflow: hidden; overflow: clip;
} }
.content { .content {
display: inline-block; display: inline-block;

2
packages/client/src/components/note-preview.vue
View file

@ -27,7 +27,7 @@ const props = defineProps<{
display: flex; display: flex;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: clip; overflow: hidden; overflow: clip;
font-size: 0.95em; font-size: 0.95em;
&.min-width_350px { &.min-width_350px {

2
packages/client/src/components/note-simple.vue
View file

@ -36,7 +36,7 @@ const showContent = $ref(false);
display: flex; display: flex;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: clip; overflow: hidden; overflow: clip;
font-size: 0.95em; font-size: 0.95em;
&.min-width_350px { &.min-width_350px {

2
packages/client/src/components/note.vue
View file

@ -297,7 +297,7 @@ function readPromo() {
position: relative; position: relative;
transition: box-shadow 0.1s ease; transition: box-shadow 0.1s ease;
font-size: 1.05em; font-size: 1.05em;
overflow: clip; overflow: hidden; overflow: clip;
contain: content; contain: content;
// これらの指定はパフォーマンス向上には有効だが、ノートの高さは一定でないため、 // これらの指定はパフォーマンス向上には有効だが、ノートの高さは一定でないため、

2
packages/client/src/components/tag-cloud.vue
View file

@ -73,7 +73,7 @@ defineExpose({
<style lang="scss" scoped> <style lang="scss" scoped>
.meijqfqm { .meijqfqm {
position: relative; position: relative;
overflow: clip; overflow: hidden; overflow: clip;
display: grid; display: grid;
place-items: center; place-items: center;

2
packages/client/src/components/toast.vue
View file

@ -54,7 +54,7 @@ onMounted(() => {
width: min-content; width: min-content;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
border-radius: 8px; border-radius: 8px;
overflow: clip; overflow: hidden; overflow: clip;
text-align: center; text-align: center;
pointer-events: none; pointer-events: none;

2
packages/client/src/components/ui/button.vue
View file

@ -148,7 +148,7 @@ export default defineComponent({
text-decoration: none; text-decoration: none;
background: var(--buttonBg); background: var(--buttonBg);
border-radius: 5px; border-radius: 5px;
overflow: clip; overflow: hidden; overflow: clip;
box-sizing: border-box; box-sizing: border-box;
transition: background 0.1s ease; transition: background 0.1s ease;

25
packages/client/src/components/ui/container.vue
View file

@ -10,7 +10,8 @@
</button> </button>
</div> </div>
</header> </header>
<transition :name="$store.state.animation ? 'container-toggle' : ''" <transition
:name="$store.state.animation ? 'container-toggle' : ''"
@enter="enter" @enter="enter"
@after-enter="afterEnter" @after-enter="afterEnter"
@leave="leave" @leave="leave"
@ -34,37 +35,37 @@ export default defineComponent({
showHeader: { showHeader: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: true,
}, },
thin: { thin: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
naked: { naked: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
foldable: { foldable: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
expanded: { expanded: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: true,
}, },
scrollable: { scrollable: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
maxHeight: { maxHeight: {
type: Number, type: Number,
required: false, required: false,
default: null default: null,
}, },
}, },
data() { data() {
@ -79,12 +80,12 @@ export default defineComponent({
const headerHeight = this.showHeader ? this.$refs.header.offsetHeight : 0; const headerHeight = this.showHeader ? this.$refs.header.offsetHeight : 0;
this.$el.style.minHeight = `${headerHeight}px`; this.$el.style.minHeight = `${headerHeight}px`;
if (showBody) { if (showBody) {
this.$el.style.flexBasis = `auto`; this.$el.style.flexBasis = 'auto';
} else { } else {
this.$el.style.flexBasis = `${headerHeight}px`; this.$el.style.flexBasis = `${headerHeight}px`;
} }
}, { }, {
immediate: true immediate: true,
}); });
this.$el.style.setProperty('--maxHeight', this.maxHeight + 'px'); this.$el.style.setProperty('--maxHeight', this.maxHeight + 'px');
@ -124,7 +125,7 @@ export default defineComponent({
afterLeave(el) { afterLeave(el) {
el.style.height = null; el.style.height = null;
}, },
} },
}); });
</script> </script>
@ -142,7 +143,7 @@ export default defineComponent({
.ukygtjoj { .ukygtjoj {
position: relative; position: relative;
overflow: clip; overflow: hidden; overflow: clip;
&.naked { &.naked {
background: transparent !important; background: transparent !important;

2
packages/client/src/components/ui/modal.vue
View file

@ -389,7 +389,7 @@ defineExpose({
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: clip; overflow: hidden; overflow: clip;
> .content { > .content {
position: fixed; position: fixed;

2
packages/client/src/pages/about-misskey.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<MkStickyContainer> <MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<div style="overflow: clip;"> <div style="overflow: hidden; overflow: clip;">
<MkSpacer :content-max="600" :margin-min="20"> <MkSpacer :content-max="600" :margin-min="20">
<div class="_formRoot znqjceqz"> <div class="_formRoot znqjceqz">
<div id="debug"></div> <div id="debug"></div>

2
packages/client/src/pages/about.vue
View file

@ -138,7 +138,7 @@ definePageMetadata(computed(() => ({
.fwhjspax { .fwhjspax {
text-align: center; text-align: center;
border-radius: 10px; border-radius: 10px;
overflow: clip; overflow: hidden; overflow: clip;
background-size: cover; background-size: cover;
background-position: center center; background-position: center center;

4
packages/client/src/pages/admin/overview.vue
View file

@ -561,7 +561,7 @@ definePageMetadata({
> .body { > .body {
background: var(--panel); background: var(--panel);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
} }
@ -620,7 +620,7 @@ definePageMetadata({
> .body { > .body {
background: var(--panel); background: var(--panel);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
} }
} }

2
packages/client/src/pages/antenna-timeline.vue
View file

@ -110,7 +110,7 @@ definePageMetadata(computed(() => antenna ? {
> .tl { > .tl {
background: var(--bg); background: var(--bg);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
&.min-width_800px { &.min-width_800px {

2
packages/client/src/pages/settings/profile.vue
View file

@ -192,7 +192,7 @@ definePageMetadata({
background-size: cover; background-size: cover;
background-position: center; background-position: center;
border-radius: 10px; border-radius: 10px;
overflow: clip; overflow: hidden; overflow: clip;
> .avatar { > .avatar {
display: inline-block; display: inline-block;

2
packages/client/src/pages/settings/theme.vue
View file

@ -175,7 +175,7 @@ definePageMetadata({
> .toggleWrapper { > .toggleWrapper {
display: inline-block; display: inline-block;
text-align: left; text-align: left;
overflow: clip; overflow: hidden; overflow: clip;
padding: 0 100px; padding: 0 100px;
input { input {

2
packages/client/src/pages/timeline.vue
View file

@ -177,7 +177,7 @@ definePageMetadata(computed(() => ({
> .tl { > .tl {
background: var(--bg); background: var(--bg);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
} }
</style> </style>

2
packages/client/src/pages/user-list-timeline.vue
View file

@ -103,7 +103,7 @@ definePageMetadata(computed(() => list ? {
> .tl { > .tl {
background: var(--bg); background: var(--bg);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
&.min-width_800px { &.min-width_800px {

2
packages/client/src/pages/user/index.photos.vue
View file

@ -90,7 +90,7 @@ export default defineComponent({
> .img { > .img {
height: 128px; height: 128px;
border-radius: 6px; border-radius: 6px;
overflow: clip; overflow: hidden; overflow: clip;
} }
} }

2
packages/client/src/pages/welcome.entrance.a.vue
View file

@ -275,7 +275,7 @@ function showMenu(ev) {
-webkit-backdrop-filter: var(--blur, blur(15px)); -webkit-backdrop-filter: var(--blur, blur(15px));
backdrop-filter: var(--blur, blur(15px)); backdrop-filter: var(--blur, blur(15px));
border-radius: 999px; border-radius: 999px;
overflow: clip; overflow: hidden; overflow: clip;
width: 800px; width: 800px;
padding: 8px 0; padding: 8px 0;

2
packages/client/src/style.scss
View file

@ -260,7 +260,7 @@ hr {
._panel { ._panel {
background: var(--panel); background: var(--panel);
border-radius: var(--radius); border-radius: var(--radius);
overflow: clip; overflow: hidden; overflow: clip;
} }
._block { ._block {

2
packages/client/src/ui/_common_/statusbars.vue
View file

@ -52,7 +52,7 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue')
width: 100%; width: 100%;
line-height: var(--height); line-height: var(--height);
height: var(--height); height: var(--height);
overflow: clip; overflow: hidden; overflow: clip;
contain: strict; contain: strict;
> .name { > .name {

2
packages/client/src/ui/classic.vue
View file

@ -241,7 +241,7 @@ onMounted(() => {
border-left: solid 1px var(--divider); border-left: solid 1px var(--divider);
border-right: solid 1px var(--divider); border-right: solid 1px var(--divider);
border-radius: 0; border-radius: 0;
overflow: clip; overflow: hidden; overflow: clip;
--margin: 12px; --margin: 12px;
} }