added to navbar

This commit is contained in:
tamaina 2025-08-25 09:50:47 +09:00
parent 18bc7f6124
commit 75ab688a36
2 changed files with 10 additions and 15 deletions

View File

@ -2,14 +2,14 @@ import type { Directive } from 'vue';
let initialized = false;
let styleEl: HTMLStyleElement | null = null;
const canUseDeviceOrientation = !window.DeviceOrientationEvent;
const canUseDeviceOrientation = !!window.DeviceOrientationEvent;
const className = '_flipOnDeviceOrientation';
const variableName = `--MI-flip_on_device_orientation_transform`;
function handleOrientationChange(event: DeviceOrientationEvent) {
const isUpsideDown = event.beta ? event.beta < -15 : false;
const isUpsideDown = event.beta ? event.beta < 5 : false;
const transform = isUpsideDown ? 'scale(-1, -1)' : '';
window.document.body.style.setProperty(variableName, transform);
window.document.documentElement.style.setProperty(variableName, transform);
}
function registerListener() {

View File

@ -170,7 +170,6 @@ $avatarSize: 58px;
.avatar {
width: $avatarSize;
height: $avatarSize;
margin-right: 8px;
}
.names {
@ -179,10 +178,12 @@ $avatarSize: 58px;
flex-direction: column;
justify-content: center;
align-items: start;
margin-top: -4px;
margin: -4px -2px 0 8px;
padding-right: 16px;
max-width: 100%;
overflow-x: hidden;
overflow-y: visible;
mask-image: linear-gradient(90deg,#000,#000 calc(100% - 16px),#0000);
}
.name {
@ -191,11 +192,8 @@ $avatarSize: 58px;
font-size: 20px;
line-height: 24px;
width: fit-content;
max-width: calc(100% - 16px);
overflow-x: hidden;
overflow-y: visible;
padding-right: 16px;
mask-image: linear-gradient(90deg,#000,#000 calc(100% - 16px),#0000);
max-width: 100%;
overflow: visible;
}
.username {
@ -204,11 +202,8 @@ $avatarSize: 58px;
font-size: 14px;
line-height: 16px;
width: fit-content;
max-width: calc(100% - 16px);
overflow-x: hidden;
overflow-y: visible;
padding-right: 16px;
mask-image: linear-gradient(90deg,#000,#000 calc(100% - 16px),#0000);
max-width: 100%;
overflow: visible;
}
.logo {