Archived
2
0

slight mobile changes

This commit is contained in:
Craig 2020-01-30 23:57:00 +00:00
parent b92aae251b
commit 25a3718d91
2 changed files with 35 additions and 2 deletions

View File

@ -1,5 +1,5 @@
<template>
<div id="neko">
<div id="neko" :class="[side ? 'expanded' : '']">
<template v-if="!$client.supported">
<neko-unsupported />
</template>
@ -41,10 +41,13 @@
left: 0;
right: 0;
bottom: 0;
max-width: 100vw;
max-height: 100vh;
flex-direction: row;
display: flex;
.neko-main {
min-width: 360px;
max-width: 100%;
flex-grow: 1;
flex-direction: column;
@ -104,6 +107,29 @@
}
}
}
@media only screen and (max-width: 600px) {
#neko {
&.expanded {
.neko-main {
transform: translateX(-$side-width);
}
.neko-menu {
transform: translateX(-$side-width);
}
}
}
}
@media only screen and (max-width: 768px) {
#neko {
.neko-main {
.room-container {
display: none;
}
}
}
}
</style>
<script lang="ts">

View File

@ -1,6 +1,6 @@
<template>
<ul>
<li>
<li v-if="!isTouch">
<i
:class="[
hosted && !hosting ? 'disabled' : '',
@ -114,6 +114,13 @@
@Component({ name: 'neko-controls' })
export default class extends Vue {
get isTouch() {
return (
(typeof navigator.maxTouchPoints !== 'undefined' ? navigator.maxTouchPoints < 0 : false) ||
'ontouchstart' in document.documentElement
)
}
get hosted() {
return this.$accessor.remote.hosted
}