From f59c4a4f3cf102cbea83494ce83006348c9ccc58 Mon Sep 17 00:00:00 2001
From: Michael Hartung <michi@Michaels-MacBook-Pro.local>
Date: Thu, 30 Sep 2021 15:36:30 +0200
Subject: [PATCH] max width for sidebar
---
.../components/analysis-panel/analysis-panel.component.ts | 5 +++--
src/app/pages/explorer-page/explorer-page.component.ts | 1 -
src/app/utils.ts | 3 ++-
src/stylesheets/styles.scss | 5 ++++-
src/stylesheets/variables.scss | 3 ++-
5 files changed, 11 insertions(+), 6 deletions(-)
diff --git a/src/app/components/analysis-panel/analysis-panel.component.ts b/src/app/components/analysis-panel/analysis-panel.component.ts
index ab8bbb4e..83a84414 100644
--- a/src/app/components/analysis-panel/analysis-panel.component.ts
+++ b/src/app/components/analysis-panel/analysis-panel.component.ts
@@ -31,7 +31,7 @@ import {NetworkSettings} from '../../network-settings';
import {NetexControllerService} from 'src/app/services/netex-controller/netex-controller.service';
import {defaultConfig, IConfig} from 'src/app/config';
import { mapCustomEdge, mapCustomNode } from 'src/app/main-network';
-import { downLoadFile, removeDuplicateObjectsFromList } from 'src/app/utils';
+import { downLoadFile, pieChartContextRenderer, removeDuplicateObjectsFromList } from 'src/app/utils';
declare var vis: any;
@@ -801,7 +801,8 @@ export class AnalysisPanelComponent implements OnInit, OnChanges {
isSeed,
this.analysis.inSelection(wrapper),
this.gradientMap[netexId]));
- node.gradient = this.gradientMap[netexId];
+ node.shape = 'custom';
+ node.ctxRenderer = pieChartContextRenderer;
updatedNodes.push(node);
}
this.nodeData.nodes.update(updatedNodes);
diff --git a/src/app/pages/explorer-page/explorer-page.component.ts b/src/app/pages/explorer-page/explorer-page.component.ts
index 2ea6812f..82060744 100644
--- a/src/app/pages/explorer-page/explorer-page.component.ts
+++ b/src/app/pages/explorer-page/explorer-page.component.ts
@@ -803,7 +803,6 @@ export class ExplorerPageComponent implements OnInit, AfterViewInit {
gradient));
// try out custom ctx renderer
- // node.gradient = gradient;
node.shape = 'custom';
node.ctxRenderer = pieChartContextRenderer;
updatedNodes.push(node);
diff --git a/src/app/utils.ts b/src/app/utils.ts
index 4fbbd0c1..8fe3cdb9 100644
--- a/src/app/utils.ts
+++ b/src/app/utils.ts
@@ -134,7 +134,8 @@ export function downLoadFile(data: any, type: string, fmt: string) {
}
export function pieChartContextRenderer({ ctx, x, y, state: { selected, hover }, style, label }) {
- ctx.drawPieLabel = function(style, x, y, label) {
+ console.log(style)
+ ctx.drawPieLabel = function(style, x, y, label) {
ctx.font = "normal 12px sans-serif";
ctx.textAlign = "center";
ctx.textBaseline = "middle";
diff --git a/src/stylesheets/styles.scss b/src/stylesheets/styles.scss
index db064d85..36d15ea2 100644
--- a/src/stylesheets/styles.scss
+++ b/src/stylesheets/styles.scss
@@ -108,7 +108,7 @@
height: $height;
overflow-y: auto;
overflow-x: hidden;
- max-width: $sidebar-max-width;
+ max-width: $sidebar-width;
min-width: $sidebar-min-width;
height: 100%;
/* Hide scrollbar for Chrome, Safari and Opera */
@@ -118,6 +118,9 @@
/* Hide scrollbar for IE, Edge and Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
+ @media only screen and (min-width: 1400px) {
+ max-width: $sidebar-max-width;
+ }
}
div.card.bar-small {
diff --git a/src/stylesheets/variables.scss b/src/stylesheets/variables.scss
index 7931dc94..f4ca8471 100644
--- a/src/stylesheets/variables.scss
+++ b/src/stylesheets/variables.scss
@@ -34,7 +34,8 @@ $legend-diamond-size: 25px;
$height: 100%;
-$sidebar-max-width: 25%;
+$sidebar-width: 25%;
+$sidebar-max-width: 350px;
$sidebar-min-width: 240px;
// settings for different screen sizes
--
GitLab