tamius-han/ultrawidify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix normal-sized popup

Browse Source
This commit is contained in:
Tamius Han 2020-12-04 00:53:51 +01:00
parent 84db9361f9
commit 37eccb12f2
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/popup/App.vue
View File

@ -15,7 +15,9 @@
class="w100 show-more flex flex-row flex-center flex-cross-center menu-button" class="w100 show-more flex flex-row flex-center flex-cross-center menu-button"
@click="toggleSideMenu()" @click="toggleSideMenu()"
> >
<Icon icon="list" /><div>Menu</div> <Icon v-if="!sideMenuVisible" icon="list" />
<Icon v-else icon="x" />
<div>Menu</div>
</div> </div>
<div class="flex flex-row body no-overflow flex-grow"> <div class="flex flex-row body no-overflow flex-grow">
<!-- TABS/SIDEBAR --> <!-- TABS/SIDEBAR -->
@ -270,7 +272,11 @@ export default {
// ensure that narrowPopup only gets set the first time the popup renders // ensure that narrowPopup only gets set the first time the popup renders
// if popup was rendered before, we don't do anything because otherwise // if popup was rendered before, we don't do anything because otherwise
// we'll be causing an unwanted re-render // we'll be causing an unwanted re-render
if (this.narrowPopup === null) { //
// another thing worth noting — the popup gets first initialized with
// offsetWidth set to 0. This means proper popup will be displayed as a
// mini popup if we don't check for that.
if (this.narrowPopup === null && body.offsetWidth > 0) {
this.narrowPopup = body.offsetWidth < 600; this.narrowPopup = body.offsetWidth < 600;
} }
}, },
@ -649,6 +655,8 @@ html {
padding: 4px; padding: 4px;
border-bottom: #f18810 1px solid !important; border-bottom: #f18810 1px solid !important;
font-size: 1.5rem !important; font-size: 1.5rem !important;
cursor: pointer;
user-select: none;;
} }
.popup { .popup {

2
src/popup/popup.html
View File

@ -9,7 +9,7 @@
<!-- Load some resources only in development environment --> <!-- Load some resources only in development environment -->
<% } %> <% } %>
</head> </head>
<body style="width: 100%; overflow-x: hidden;"> <body style="width: 100%; height: 100%; overflow-x: hidden;">
<div id="app"> <div id="app">
</div> </div>