heartles/egirlskey
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

tweak classic ui

Browse source
This commit is contained in:
syuilo 2022-12-28 14:44:53 +09:00
parent ef6f361fb9
commit dc68c39cb1
4 changed files with 32 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
packages/frontend/src/ui/classic.header.vue
View file

@ -2,6 +2,9 @@
<div class="azykntjl">
<div class="body">
<div class="left">
<button v-click-anime class="item _button instance" @click="openInstanceMenu">
<img :src="$instance.iconUrl ?? $instance.faviconUrl ?? '/favicon.ico'" class="_ghost"/>
</button>
<MkA v-click-anime v-tooltip="$ts.timeline" class="item index" active-class="active" to="/" exact>
<i class="ti ti-home ti-fw"></i>
</MkA>
@ -40,6 +43,7 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { openInstanceMenu } from './_common_/common';
import { host } from '@/config';
import { search } from '@/scripts/search';
import * as os from '@/os';
@ -88,6 +92,8 @@ export default defineComponent({
},
methods: {
openInstanceMenu,
calcViewState() {
this.settingsWindowed = (window.innerWidth > 1400);
},
@ -186,6 +192,25 @@ export default defineComponent({
border-right: solid 0.5px var(--divider);
}
> .instance {
display: inline-block;
position: relative;
width: 56px;
height: 100%;
vertical-align: bottom;
> img {
display: inline-block;
width: 24px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
}
> .post {
display: inline-block;

11
packages/frontend/src/ui/classic.sidebar.vue
View file

@ -32,9 +32,9 @@
</MkA>
<div class="divider"></div>
<div class="about">
<MkA v-click-anime class="link" to="/about">
<img :src="$instance.iconUrl || $instance.faviconUrl || '/favicon.ico'" class="_ghost"/>
</MkA>
<button v-click-anime class="item _button" @click="openInstanceMenu">
<img :src="$instance.iconUrl ?? $instance.faviconUrl ?? '/favicon.ico'" class="_ghost"/>
</button>
</div>
<!--<MisskeyLogo class="misskey"/>-->
</div>
@ -42,6 +42,7 @@
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { openInstanceMenu } from './_common_/common';
import { host } from '@/config';
import { search } from '@/scripts/search';
import * as os from '@/os';
@ -107,6 +108,8 @@ export default defineComponent({
},
methods: {
openInstanceMenu,
calcViewState() {
this.iconOnly = (window.innerWidth <= 1400) || (this.$store.state.menuDisplay === 'sideIcon');
this.settingsWindowed = (window.innerWidth > 1400);
@ -207,7 +210,7 @@ export default defineComponent({
padding: 8px 0 16px 0;
text-align: center;
> .link {
> .item {
display: block;
width: 32px;
margin: 0 auto;

1
packages/frontend/src/ui/classic.vue
View file

@ -235,7 +235,6 @@ onMounted(() => {
min-width: 0;
width: 750px;
margin: 0 16px 0 0;
background: var(--panel);
border-left: solid 1px var(--divider);
border-right: solid 1px var(--divider);
border-radius: 0;

2
packages/frontend/src/ui/universal.widgets.vue
View file

@ -89,8 +89,6 @@ function updateWidgets(thisWidgets) {
box-sizing: border-box;
&.universal {
padding: var(--margin) 0;
> * {
margin: var(--margin) 0;
}