diff options
| author | tamaina <tamaina@hotmail.co.jp> | 2025-09-19 21:02:30 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2025-09-19 21:02:30 +0900 |
| commit | 42b2aea53364c57c39ebb953359ece4b7b0017a5 (patch) | |
| tree | 8abe7de01705ed3fb6324c6a174162c7bb9288f2 /packages/frontend/src/components/MkPolkadots.vue | |
| parent | 🎨 (diff) | |
| download | misskey-42b2aea53364c57c39ebb953359ece4b7b0017a5.tar.gz misskey-42b2aea53364c57c39ebb953359ece4b7b0017a5.tar.bz2 misskey-42b2aea53364c57c39ebb953359ece4b7b0017a5.zip | |
feat(frontend): 自分のプロフィールページの二次元コード(QRコード)を表示し、他の人のコードを読み取りするページを追加 (#16456)
* wip (qr.show.vue)
* added to navbar
* qr.show.vue
* fix
* added to navbar
* fix size
* :art:
* :art:
* fix div warn
* fix
* use * 0.25
* fix??
* fix lint
* clean up
* ???
* ?
* fix
* :art:
* :art:
* refactor
* :art:
* :art:
* :ar:t
* :art:
* iphone flip
* no lazy import
* :art:
* :art:
* :art:
* ユーザー全部flipでいいや
* :v:
* fix
* fix
* fix lint
* :art:
* fix type
* fix: local user profile url cannot be resolved with ap/show
* fix: local user url with hostname could not be resolved
* chore: use common utility for checking self host
* wip
* :art:
* :art:
* fix imports
* fix
* fix
* fix
* :art:
* fix...
* set spacer-w
* :v:
* 全画面でQRを読むように
* fix
* :art:
* modify navbar.ts
* start/stop on vue activation
* display raw content read from qr
* 端末のQRをスキャンするボタンを追加
* chore
* やっぱりmfmを先に表示する
* :art:
* fix 18n
* QRの内容は/users/:userIdにする
* add spdx
* use cqh
* `defineProps` is a compiler macro and no longer needs to be imported.
* use MkUserName
* 🎨
* 🎨
* refactor
* clean up
* refactor
* 🎨
* Update qr.show.vue
* Misskeyロゴにdrop-shadowを追加
* clean up: do not use empty css
* fix os.select usage
* Update qr.vue
* Update qr.show.vue
* Update qr.show.vue
* Update get-user-menu.ts
* ✌️
* Update show.ts
* Update ja-JP.yml
* watermark
* Update CHANGELOG.md
* Update qr.read.vue
* Update qr.read.vue
* wip
* Update MkWatermarkEditorDialog.Layer.vue
---------
Co-authored-by: anatawa12 <anatawa12@icloud.com>
Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>
Diffstat (limited to 'packages/frontend/src/components/MkPolkadots.vue')
| -rw-r--r-- | packages/frontend/src/components/MkPolkadots.vue | 15 |
1 files changed, 11 insertions, 4 deletions
diff --git a/packages/frontend/src/components/MkPolkadots.vue b/packages/frontend/src/components/MkPolkadots.vue index 285c4d0b79..4f1346b685 100644 --- a/packages/frontend/src/components/MkPolkadots.vue +++ b/packages/frontend/src/components/MkPolkadots.vue @@ -4,14 +4,18 @@ SPDX-License-Identifier: AGPL-3.0-only --> <template> -<div :class="[$style.root, accented ? $style.accented : null]"></div> +<div :class="[$style.root, accented ? $style.accented : null, revered ? $style.revered : null]"/> </template> <script lang="ts" setup> const props = withDefaults(defineProps<{ accented?: boolean; + revered?: boolean; + height?: number; }>(), { accented: false, + revered: false, + height: 200, }); </script> @@ -27,14 +31,17 @@ const props = withDefaults(defineProps<{ --dot-size: 2px; --gap-size: 40px; --offset: calc(var(--gap-size) / 2); + --height: v-bind('props.height + "px"'); - height: 200px; - margin-bottom: -200px; - + height: var(--height); background-image: linear-gradient(transparent 60%, transparent 100%), radial-gradient(var(--c) var(--dot-size), transparent var(--dot-size)), radial-gradient(var(--c) var(--dot-size), transparent var(--dot-size)); background-position: 0 0, 0 0, var(--offset) var(--offset); background-size: 100% 100%, var(--gap-size) var(--gap-size), var(--gap-size) var(--gap-size); mask-image: linear-gradient(to bottom, black 0%, transparent 100%); pointer-events: none; + + &.revered { + mask-image: linear-gradient(to top, black 0%, transparent 100%); + } } </style> |