rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix for #766 issues with display in overflow menu

Browse source
This commit is contained in:
Kendall Werts 2019-08-26 14:47:02 -05:00
parent 4d42a74e66
commit 7cbace9cc9
2 changed files with 13 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/css/popup.css
View file

@ -19,8 +19,8 @@ html {
body { body {
font-family: Roboto, Noto, "San Francisco", Ubuntu, "Segoe UI", "Fira Sans", message-box, Arial, sans-serif; font-family: Roboto, Noto, "San Francisco", Ubuntu, "Segoe UI", "Fira Sans", message-box, Arial, sans-serif;
inline-size: 300px; inline-size: calc(var(--overflow-size) + 300px);
max-inline-size: 300px; max-inline-size: calc(var(--overflow-size) + 300px);
} }
:root { :root {
@ -45,8 +45,10 @@ body {
--small-text-size: 0.833rem; /* 10px */ --small-text-size: 0.833rem; /* 10px */
--small-radius: 3px; --small-radius: 3px;
--icon-button-size: calc(calc(var(--block-line-separation-size) * 2) + 1.66rem); /* 20px */ --icon-button-size: calc(calc(var(--block-line-separation-size) * 2) + 1.66rem); /* 20px */
--column-panel-inline-size: 268px; --column-panel-inline-size: calc(var(--overflow-size) + 268px);
--inactive-opacity: 0.3; --inactive-opacity: 0.3;
--overflow-size: 0px;
--icon-fit: 8;
} }
@media (min-resolution: 1dppx) { @media (min-resolution: 1dppx) {
@ -577,7 +579,7 @@ span ~ .panel-header-text {
} }
.edit-containers-panel .userContext-wrapper { .edit-containers-panel .userContext-wrapper {
max-inline-size: 204px; max-inline-size: calc(var(--overflow-size) + 204px);
} }
.disable-edit-containers { .disable-edit-containers {
@ -822,7 +824,7 @@ span ~ .panel-header-text {
align-items: center; align-items: center;
block-size: 29px; block-size: 29px;
display: flex; display: flex;
flex: 0 0 calc(100% / 8); flex: 0 0 calc(100% / var(--icon-fit));
} }
.radio-choice > .radio-container > label { .radio-choice > .radio-container > label {

6
src/js/popup.js
View file

@ -272,6 +272,12 @@ const Logic = {
throw new Error("Something really bad happened. Unknown panel: " + panel); throw new Error("Something really bad happened. Unknown panel: " + panel);
} }
if (window.innerWidth > 300) {
//if popup is in the overflow menu, window will be larger than 300px
var root = document.documentElement;
root.style.setProperty('--overflow-size', "125px");
root.style.setProperty('--icon-fit', "12");
}
this._previousPanel = this._currentPanel; this._previousPanel = this._currentPanel;
this._currentPanel = panel; this._currentPanel = panel;