mirrors/CyberChef
1
0
Fork 0
mirror of https://github.com/gchq/CyberChef.git synced 2025-05-08 15:25:01 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

[#181] adjust #controls panel template and css so it will automatically scale based on #controls height, which makes adjustWidth() redundant. Controls is now 50px height on mobile ( 70 was just a lot of wasted space that can be better spend )

Browse source
This commit is contained in:
Robin Scholtes 2023-05-10 15:27:43 +12:00
parent 222bb624ae
commit 0868d97cee
7 changed files with 53 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/web/App.mjs
View file

@ -314,7 +314,7 @@ class App {
this.columnSplitter = Split(["#operations", "#recipe", "#IO"], {
sizes: [20, 30, 50],
minSize: minimise ? [0, 0, 0] : [20, 30, 50],
minSize: minimise ? [0, 0, 0] : [20, 330, 50],
gutterSize: 4,
expandToMin: true,
onDrag: debounce(function() {
@ -663,7 +663,6 @@ class App {
* Adjust components to fit their containers.
*/
adjustComponentSizes() {
this.manager.recipe.adjustWidth();
this.manager.input.calcMaxTabs();
this.manager.output.calcMaxTabs();
}
@ -877,7 +876,7 @@ class App {
setDesktopUI(minimise){
$("[data-toggle=tooltip]").tooltip("enable");
this.setDesktopSplitter(minimise);
// this.adjustComponentSizes();
this.adjustComponentSizes();
this.populateOperationsList();
this.manager.recipe.clearAllSelectedClasses();
}
@ -903,7 +902,11 @@ class App {
* ( themes/_structure ) if you make changes to those elements' height.
*/
assignAvailableHeight( isMobile ){
const remainingSpace = window.innerHeight - (40+50+90-2); // banner, controls height, operations, accounting for some borders
const bannerHeight = 40;
const controlsHeight = 50;
const operationsHeight = 90;
const remainingSpace = window.innerHeight - (bannerHeight+controlsHeight+operationsHeight-2);
// equally divide among recipe, input and output
["recipe", "input", "output"].forEach(( div ) => {