SWREI/switched
0
0
Fork 0
Code

Tweak UI

Browse Source
This commit is contained in:
syuilo 2021-04-16 12:06:54 +09:00
parent 9c34ef7d74
commit 481b46ac9e
5 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -26,7 +26,7 @@ import {
faFileArchive, faFileArchive,
faFilm faFilm
} from '@fortawesome/free-solid-svg-icons'; } from '@fortawesome/free-solid-svg-icons';
import ImgWithBlurhash from './img-with-blurhash.vue'; import ImgWithBlurhash from '@client/components/img-with-blurhash.vue';
import { ColdDeviceStorage } from '@client/store'; import { ColdDeviceStorage } from '@client/store';
export default defineComponent({ export default defineComponent({

2
src/client/components/img-with-blurhash.vue
View File

@ -71,6 +71,7 @@ export default defineComponent({
<style lang="scss" scoped> <style lang="scss" scoped>
.xubzgfgb { .xubzgfgb {
position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -82,6 +83,7 @@ export default defineComponent({
} }
> canvas { > canvas {
position: absolute;
object-fit: cover; object-fit: cover;
} }

2
src/client/components/media-image.vue
View File

@ -27,7 +27,7 @@ import { faExclamationTriangle, faEyeSlash } from '@fortawesome/free-solid-svg-i
import { getStaticImageUrl } from '@client/scripts/get-static-image-url'; import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
import { extractAvgColorFromBlurhash } from '@client/scripts/extract-avg-color-from-blurhash'; import { extractAvgColorFromBlurhash } from '@client/scripts/extract-avg-color-from-blurhash';
import ImageViewer from './image-viewer.vue'; import ImageViewer from './image-viewer.vue';
import ImgWithBlurhash from './img-with-blurhash.vue'; import ImgWithBlurhash from '@client/components/img-with-blurhash.vue';
import * as os from '@client/os'; import * as os from '@client/os';
export default defineComponent({ export default defineComponent({

11
src/client/pages/user/index.photos.vue
View File

@ -6,10 +6,11 @@
<div class="stream" v-if="!fetching && images.length > 0"> <div class="stream" v-if="!fetching && images.length > 0">
<MkA v-for="image in images" <MkA v-for="image in images"
class="img" class="img"
:style="`background-image: url(${thumbnail(image.file)})`"
:to="notePage(image.note)" :to="notePage(image.note)"
:key="image.id" :key="image.id"
></MkA> >
<ImgWithBlurhash :hash="image.blurhash" :src="thumbnail(image.file)" :alt="image.name" :title="image.name"/>
</MkA>
</div> </div>
<p class="empty" v-if="!fetching && images.length == 0">{{ $ts.nothing }}</p> <p class="empty" v-if="!fetching && images.length == 0">{{ $ts.nothing }}</p>
</div> </div>
@ -23,10 +24,12 @@ import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
import notePage from '../../filters/note'; import notePage from '../../filters/note';
import * as os from '@client/os'; import * as os from '@client/os';
import MkContainer from '@client/components/ui/container.vue'; import MkContainer from '@client/components/ui/container.vue';
import ImgWithBlurhash from '@client/components/img-with-blurhash.vue';
export default defineComponent({ export default defineComponent({
components: { components: {
MkContainer, MkContainer,
ImgWithBlurhash,
}, },
props: { props: {
user: { user: {
@ -88,10 +91,8 @@ export default defineComponent({
> .img { > .img {
height: 128px; height: 128px;
background-position: center center;
background-size: cover;
background-clip: content-box;
border-radius: 6px; border-radius: 6px;
overflow: clip;
} }
} }

5
src/client/style.scss
View File

@ -26,6 +26,7 @@ html {
background-position: center; background-position: center;
color: var(--fg); color: var(--fg);
overflow: auto; overflow: auto;
overflow-wrap: break-word;
font-family: "BIZ UDGothic", Roboto, HelveticaNeue, Arial, sans-serif; font-family: "BIZ UDGothic", Roboto, HelveticaNeue, Arial, sans-serif;
line-height: 1.35; line-height: 1.35;
text-size-adjust: 100%; text-size-adjust: 100%;
@ -88,10 +89,6 @@ html._themeChanging_ {
} }
} }
body {
overflow-wrap: break-word;
}
html, body { html, body {
margin: 0; margin: 0;
padding: 0; padding: 0;