SuperX
/
viz
7
0
Fork 0
Code Issues 10 Pull Requests Projects Releases Wiki Activity
Browse Source

Verbesserung Dashboard Responsivität #1

master
Daniel Quathamer 11 hours ago
parent
c8db6030aa
commit
1d7db58bf2
3 changed files with 449 additions and 431 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 368
      superx/style/sx_viz_muster.css
  2. 405
      superx/xml/viz_components.xsl
  3. 5
      superx/xml/viz_html_chart_viewer_grid.xsl

368
superx/style/sx_viz_muster.css
Unescape View File

@ -1,10 +1,21 @@ @@ -1,10 +1,21 @@
/*dateispezifische Basics*/
html, body {
height: auto;
min-height: 100vh;
overflow-x: auto;
overflow-y: auto;
}
.hero-body { margin-left: 1.5em; } /*Abstand zum Burger-Button*/
.title, .subtitle { /*für Seitentitel*/
margin-left: 0.4em;
margin-top: 0%; }
.columns {
display: flex;
flex-wrap: wrap; }
.card { /*für Cardposition, -style*/
display: flex;
flex-flow: column;
@ -32,8 +43,7 @@ @@ -32,8 +43,7 @@
margin-top: 0.4em; }
.control-new { /*für einheitliche Controlbreite*/
width: 17.0em;
}
width: 17.0em; }
.tabs {
font-family: sans-serif;
@ -42,6 +52,42 @@ @@ -42,6 +52,42 @@
.tabs { /*für Tab-Namen*/
font-size: 2rem; }
.grid { /*20250917 eingefügt*/
display: flex;
flex-wrap: wrap; } /*erlaubt Umbruch'*/
/*20251007 eingefügt*/
.fullwidth-grid {
width: 100vw; /* gesamte Viewport-Breite */
padding-right: 2em; }
.dashboard-tabs { /*20250917 eingefügt*/
display: flex;
flex-wrap: wrap; /* erlaubt Umbruch */
list-style: none;
margin: 1rem;
padding: 0;
cursor: pointer; }
.dashboard-tabs li { /*20250917 eingefügt*/
flex: 1 1 auto; /* alle Tabs gleich breit, aber flexibel */
text-align: center;
border: 1px solid #ccc;
background: #f9f9f9; }
.dashboard-tabs li a { /*20250917 eingefügt*/
display: block;
text-decoration: none;
font-weight: bold;
color: #333; }
.dashboard-tabs li a:hover, .dashboard-tabs li a:focus { /*20250917 eingefügt*/
background: #e0e0e0; }
.dashboard-tabs li.is-active { /*20251007 eingefügt*/
background: #ebf1f3;
color: midnightblue; }
.input::-moz-placeholder, .textarea::-moz-placeholder, .select select::-moz-placeholder {
font-size: 0.8rem;
color: black; }
@ -66,4 +112,322 @@ @@ -66,4 +112,322 @@
border-radius: 8px;
pointer-events: none;
}
.dojoDialog {background : #eee; border : 1px solid #999;-moz-border-radius : 5px;padding : 4px;width:650;height:420px;overflow:scroll}
.treebutton {
border:none;
margin: 0 4px 0 0;
}
/*Cockpit-Header*/
.hs_header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 20; /*positioniert sich im flow am nähesten zum Betrachter*/
background-color:white;
padding-top: 3rem; }
.hs_header_box1 { /*für Balken-Box über/unter Cockpittitel*/
background: white;
height: 1.0rem;
color: black; }
.hs_header_box2 { /*für Logo-/Cockpittitel-Box*/
display: flex;
/* height: 4.0rem;*/
padding: 0.3rem 17.0rem 0rem 9.0rem; /*für Padding: ob re un li*/
align-items: left; /*für vertikale Ausrichtung d Elemente*/
/*justify-content: space-between;*/ /*für gleichm. Leerraum zw. Elementen*/
background-color: #004c93; }
.cockpit_title {
color: white;
font-size: 2rem;
font-weight: 800;
background-color: #004c93;
padding-left:20px; }
.vizTitle {
margin-left: 0.8em;
margin-right: 0.8em;
white-space: normal;
word-wrap: normal;
overflow-wrap: break-word;
hyphens: auto;
text-align: center;
font-size:1.2em;
font-weight:bolder;
color: midnightblue;
background: #ebf1f3; }
.navbar {background-color: white;} /*20250221 eingefügt*/
.navbar-item img, .navbar-item svg { /*20250221 eingefügt*/
max-height: unset !important; } /*var(--bulma-navbar-item-img-max-height);*/
/*Media-queries**/
@media print{
.dontprint {display:none;}
}
/* 20250919 eingefügt: bis 769px: mobile; ab 769px: tablet and up; ab 1024px: desctop an up */
@media (max-width: 403px) {
.columns { padding-top: 2.5rem; }
.grid { padding-top: 18.5rem; }
}
@media (min-width: 404px) and (max-width: 468px) {
.grid { padding-top: 17rem; }
}
@media (min-width: 469px) and (max-width: 473px) {
.grid { padding-top: 15.5rem; }
}
@media (min-width: 474px) and (max-width: 549px) {
.grid { padding-top: 14rem; }
}
@media (min-width: 550px) and (max-width: 552px) {
.grid { padding-top: 12rem; }
}
@media (min-width: 553px) and (max-width: 576px) {
.grid { padding-top: 10.5rem; }
}
@media (min-width: 577px) and (max-width: 636px) {
.grid { padding-top: 7.5rem; }
}
@media (min-width: 637px) and (max-width: 917px) {
.grid { padding-top: 6rem; }
}
@media (min-width: 918px) and (max-width: 927px) {
.grid { padding-top: 5rem; }
}
@media (min-width: 928px) and (max-width: 1644px) {
.grid { padding-top: 3rem; }
}
@media (min-width: 1645px) {
.grid { padding-top: 1.5rem; }
}
.buttons-container { /* 300425BF eingefügt*/
display: flex;
justify-content: flex-end; /* rechts ausrichten */
align-items: center; /* vertikal zentrieren */
flex-wrap: wrap; /* für kleine Viewports */
padding-top: 1.0rem;
}
.button.is-link {
background-color: white; /*link-Blau:#3273dc; UDE-Blau:#004C93*/
border-color: transparent;
color: #004C93; }
.button.is-link:hover, .button.is-link.is-hovered {
background-color: #276cda;
border-color: transparent;
color: #004C93; }
.button.is-link:focus, .button.is-link.is-focused {
border-color: transparent;
color: #004C93; }
.button.is-link:focus:not(:active), .button.is-link.is-focused:not(:active) {
box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); }
.button.is-link:active, .button.is-link.is-active {
background-color: white;
border-color: transparent;
color: #004C93; }
.button.is-link[disabled],
fieldset[disabled] .button.is-link {
background-color: #004C93;
border-color: transparent;
box-shadow: none; }
.button.is-link.is-inverted {
background-color: #fff;
color: #004C93; }
.button.is-link.is-inverted:hover, .button.is-link.is-inverted.is-hovered {
background-color: #f2f2f2; }
.button.is-link.is-inverted[disabled],
fieldset[disabled] .button.is-link.is-inverted {
background-color: #fff;
border-color: transparent;
box-shadow: none;
color: #004C93; }
.button.is-link.is-loading::after {
border-color: transparent transparent #fff #fff !important; }
.button.is-link.is-outlined {
background-color: white;
border-color: #004C93;
color: #004C93; }
.button.is-link.is-outlined:hover, .button.is-link.is-outlined.is-hovered, .button.is-link.is-outlined:focus, .button.is-link.is-outlined.is-focused {
background-color: #004C93;
border-color: #004C93;
color: #fff; }
.button.is-link.is-outlined.is-loading::after {
border-color: transparent transparent #004C93; #004C93; !important; }
.button.is-link.is-outlined.is-loading:hover::after, .button.is-link.is-outlined.is-loading.is-hovered::after, .button.is-link.is-outlined.is-loading:focus::after, .button.is-link.is-outlined.is-loading.is-focused::after {
border-color: transparent transparent #fff #fff !important; }
.button.is-link.is-outlined[disabled],
fieldset[disabled] .button.is-link.is-outlined {
background-color: transparent;
border-color: #004C93;
box-shadow: none;
color: #004C93; }
.button.is-link.is-inverted.is-outlined {
background-color: transparent;
border-color: #fff;
color: #fff; }
.button.is-link.is-inverted.is-outlined:hover,
.button.is-link.is-inverted.is-outlined.is-hovered,
.button.is-link.is-inverted.is-outlined:focus,
.button.is-link.is-inverted.is-outlined.is-focused {
background-color: #fff;
color: #004C93; }
.button.is-link.is-inverted.is-outlined.is-loading:hover::after,
.button.is-link.is-inverted.is-outlined.is-loading.is-hovered::after,
.button.is-link.is-inverted.is-outlined.is-loading:focus::after, .button.is-link.is-inverted.is-outlined.is-loading.is-focused::after {
border-color: transparent transparent #004C93; #004C93; !important; }
.button.is-link.is-inverted.is-outlined {
background-color: transparent;
border-color: #fff;
color: #fff; }
.button.is-link.is-inverted.is-outlined:hover,
.button.is-link.is-inverted.is-outlined.is-hovered,
.button.is-link.is-inverted.is-outlined:focus,
.button.is-link.is-inverted.is-outlined.is-focused {
background-color: #fff;
color: #004C93; }
.button.is-small.is-rounded.is-link.has-tooltip-bottom { background-color: #004C93; /*UDE-Blau*/ } /*20250711 eingefügt*/
.exportoptions {
margin-top: 2.0em;
}
.buttonlist{ /*für resposive Buttonleiste*/
display: flex;
flex-flow: no wrap;
justify-content: flex-start;
padding: 0.3rem 0rem 0.3rem 0rem; /*für Padding: ob re un li*/
}
.buttonlist img { /*für Icongröße in Buttonleiste*/
height: 2.5rem;
width: auto;
margin-top: 0em; }
/*Auswahlfelder*/
.card { /*für Auswahlfeldercard-Position*/
display: flex;
flex-flow: column;
margin-left: 0em;
margin-top: 8em;
min-width: 10.0em;
width: 100%;
}
.card.is-shady { border: unset !important; } /*20250709 eingefügt */
.label-container, .button-label { /*für einh.responsive Feldbezeichner*/
display: flex;
justify-content: left;
background: ;
min-width: 10.0em; /*für kleine Viewports*/
width: 10%; } /*für kleine Viewports*/
.control-new { /*für einheitliche Controls*/
min-width: 10.0em; /*für kleine Viewports*/
width: 10%; /*für große Viewports*/
}
.button { /*für Button-Bezeichner-Ausrichtung*/
display: flex;
justify-content: left; }
/*Erläuterungen/Legende*/
.box-new { /*für Kopfzeile mit Close-Button*/
display: flex;
justify-content: space-between;
font-weight: bold;
}
.leg_erl {
background-color: whitesmoke; /*für Abschnitthintergrund, Schrift*/
font-size: 0.8em;
}
.dl_title { /*für Texthervorhebungen*/
display: flex;
justify-content: center;
background: inherit;
font-size: 1.2em;
font-weight: 400;
}
/*Datentabellen*/
.table-container {
z-index: 10; /*positioniert sich im flow hinter dem hs_header*/
}
table.ergtabelle tr.listRowOdd td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr.listRowEven td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr th.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr th.header
{
vertical-align:center;
text-align:center;
}
table.ergtabelle
{
border:thin solid white;
font-size:1.5rem;
}
/* Zahlen rechtsbündig:*/
table.ergtabelle tbody tr.listRowEven td.integer
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowOdd td.integer
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowEven td.decimal
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowOdd td.decimal
{
text-align:right;
empty-cells:show
vertical-align:center;
}

405
superx/xml/viz_components.xsl
Unescape View File

@ -24,7 +24,6 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sx="http://memtext.de"> @@ -24,7 +24,6 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sx="http://memtext.de">
<link rel="stylesheet" type="text/css" href="../style/bulma-tooltip.min.css" />
<link rel="stylesheet" type="text/css" href="../style/sx_viz_muster.css" />
</head>
</xsl:template>
@ -77,13 +76,27 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sx="http://memtext.de"> @@ -77,13 +76,27 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sx="http://memtext.de">
<xsl:if test="$css != ''">
<link rel="stylesheet" type="text/css" href="$css" />
</xsl:if>
</head>
</xsl:template>
<xsl:template name="tableJavascript_viz_alt">
<script language="Javascript" type="text/javascript" src="../xml/js/jquery-2.1.1.min.js" />
<script language="JavaScript" type="text/javascript" src="../xml/js/memtext/sx_functions.js"></script>
<script language="JavaScript" type="text/javascript"> <!--20251011 eingefügt-->
document.addEventListener('DOMContentLoaded', () => {
const tabs = document.querySelectorAll('.dashboard-tabs li');
tabs.forEach(tab => {
tab.addEventListener('click', () => {
// Alle Tabs deaktivieren
tabs.forEach(t => t.classList.remove('is-active', 'active'));
// Geklickten Tab aktivieren
tab.classList.add('is-active');
});
});
});
</script>
<xsl:call-template name="importVizJavascriptLibs" />
@ -1153,7 +1166,7 @@ Stand: <xsl:value-of select="../stand" /></p> @@ -1153,7 +1166,7 @@ Stand: <xsl:value-of select="../stand" /></p>
</xsl:call-template>
</xsl:when>
<xsl:otherwise><!--nicht dynamisch-->
<xsl:attribute name="class"><xsl:value-of select="concat('fixed-grid has-',$spalten_anz,'-cols')" />
<xsl:attribute name="class"><xsl:value-of select="concat('fixed-grid has-',$spalten_anz,'-cols fullwidth-grid')" />
</xsl:attribute>
<div class="grid" style="margin-top: 1rem;">
<xsl:call-template name="viz_viewer_grid_cells" >
@ -1719,22 +1732,25 @@ Platzhalter @@ -1719,22 +1732,25 @@ Platzhalter
<span style="font-size:1rem;font-weight:bolder;color:#C00000;"><xsl:value-of select="col[f_name='kennz']/wert"/><xsl:text> (</xsl:text><xsl:value-of select="../../../felder/feld [@varname='Bis Semester']/value_caption"/><xsl:text>)</xsl:text></span>
</div>
</xsl:for-each>
<div class="column"><p align="right">
<div class="column">
<p align="right">
<xsl:if test="$bookletStylesheet!=''">
<a onmouseover="window.status='Export starten';return true" onfocus="window.status='Download starten';return true" onmouseout="window.status='Download starten';return true;" >
<xsl:attribute name="href"><xsl:text>javascript:exportVizBooklet('application/pdf','</xsl:text><xsl:value-of select="$bookletStylesheet"/><xsl:text>');</xsl:text>
</xsl:attribute>
<img title="Ausgabe im PDF-Querformat" alt="Ausgabe im PDF-Querformat" src="../images/icons/into_pdf.svg" style="width:30px;height:40px" border="0" /></a>
<span class="separator">&#160;</span>
<!--20251001 entfernt:<span class="separator">&#160;</span>-->
<a onmouseover="window.status='Export starten';return true" onfocus="window.status='Download starten';return true" onmouseout="window.status='Download starten';return true">
<xsl:attribute name="href"><xsl:text>javascript:exportVizBooklet('application/vnd.openxmlformats-officedocument.spreadsheetml.sheet','</xsl:text><xsl:value-of select="$bookletStylesheet"/><xsl:text>');</xsl:text>
</xsl:attribute>
<img title="Ausgabe in Excel" alt="Ausgabe in Excel" src="../images/icons/into_excel_normal.svg" style="width:30px;height:40px" border="0" /></a>
<span class="separator">&#160;</span>
<!--20251001 entfernt:<span class="separator">&#160;</span>-->
<a onmouseover="window.status='Export starten';return true" onfocus="window.status='Download starten';return true" onmouseout="window.status='Download starten';return true">
<xsl:attribute name="href"><xsl:text>javascript:exportVizBooklet('application/vnd.openxmlformats-officedocument.wordprocessingml.document','</xsl:text><xsl:value-of select="$bookletStylesheet"/><xsl:text>');</xsl:text>
</xsl:attribute>
<img title="Ausgabe in Word" alt="Ausgabe in Word" width="25px" height="25px" src="../images/icons/into_word.svg" style="width:30px;height:40px" border="0" /></a>
<!--20251001 entfernt wg Einheitlichkeit::width="25px" height="25px"-->
<img title="Ausgabe in Word" alt="Ausgabe in Word" src="../images/icons/into_word.svg" style="width:30px;height:40px" border="0" /></a>
</xsl:if><!-- wenn JR Stylesheet -->
</p>
@ -1745,7 +1761,11 @@ Platzhalter @@ -1745,7 +1761,11 @@ Platzhalter
</div>
</div>
</div>
<div class="tabs is-boxed is-centered is-toggle is-toggle-rounded is-fullwidth" id="nav">
<!--20251001 tabs geändert in dashboard-tabs <div class="tabs is-boxed is-centered is-toggle is-toggle-rounded is-fullwidth" id="nav">-->
<!--20251001 tabs geändert in dashboard-tabs-->
<!--<div class="dashboard-tabs is-boxed is-centered is-toggle is-toggle-rounded is-fullwidth" id="nav">-->
<div class="tab-container" id="nav">
<script language="Javascript">
<xsl:text>
var optionalFilters = new Array();
@ -1776,13 +1796,11 @@ Platzhalter @@ -1776,13 +1796,11 @@ Platzhalter
</xsl:for-each>
</ul>
<xsl:call-template name="vizGridTitle" >
</div><!--Ende grauer Hintergrund der tabs-->
</xsl:call-template>
</div><!--Ende grauer Hintergrund der tabs-->
</div>
</header>
@ -2156,368 +2174,7 @@ td.integer { @@ -2156,368 +2174,7 @@ td.integer {
</div>
</div>
</xsl:template>
<xsl:template name="vizTableCSS">
<!-- aus 800000280_datencockpit.xsl -->
<style type="text/css">
.dojoDialog {background : #eee; border : 1px solid #999;-moz-border-radius : 5px;padding : 4px;width:650;height:420px;overflow:scroll}
.treebutton {
border:none;
margin: 0 4px 0 0;
}
@media print{
.dontprint{display:none;}
}
html, body {
height: auto;
min-height: 100vh;
overflow-x: auto;
overflow-y: auto;
}
/*Cockpit-Header*/
.hs_header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 20; /*positioniert sich im flow am nähesten zum Betrachter*/
background-color:white;
padding-top: 3rem;
}
.cockpit_title {
color: white;
font-size: 2rem;
font-weight: 800;
background-color: #004c93;
padding-left:20px;
}
.navbar {background-color: white;} /*20250221 eingefügt*/
.navbar-item img, .navbar-item svg { /*20250221 eingefügt*/
max-height: unset !important; /*var(--bulma-navbar-item-img-max-height);*/
}
.hs_header_box1 { /*für Balken-Box über/unter Cockpittitel*/
background: white;
height: 1.0rem;
color: black;
}
.hs_header_box2 { /*für Logo-/Cockpittitel-Box*/
display: flex;
/* height: 4.0rem;*/
padding: 0.3rem 17.0rem 0rem 9.0rem; /*für Padding: ob re un li*/
align-items: left; /*für vertikale Ausrichtung d Elemente*/
/*justify-content: space-between;*/ /*für gleichm. Leerraum zw. Elementen*/
background-color: #004c93;
}
/*--20250917 eingefügt, klappt nicht bei fester Spaltenanzahl:--*/
/*.grid { display: flex;
flex-wrap: wrap; erlaubt Umbruch
}*/
.dashboard-tabs {
display: flex;
flex-wrap: wrap; /* erlaubt Umbruch */
list-style: none;
margin: 1rem;
padding: 0;
/*border-bottom: 1px solid #ccc;*/
}
.dashboard-tabs li {
flex: 1 1 auto; /* alle Tabs gleich breit, aber flexibel */
text-align: center;
/*border: 1px solid #ccc;
border-bottom: none;
background: #f9f9f9;*/
}
.dashboard-tabs li a {
display: block;
padding: 0.75em 1em;
text-decoration: none;
font-weight: bold;
color: #333;
height: 2.5rem;
}
.dashboard-tabs li a:hover {
background: #e0e0e0;
}
.columns {
display: flex;
flex-wrap: wrap;
}
@media (max-width: 475px) {
/* 20250920 eingefügt */
.columns { padding-top: 2.5rem; }
.grid { padding-top: 17.5rem; }
}
@media (min-width: 476px) and (max-width: 576px) {
/* 20250920 eingefügt */
.grid { padding-top: 15rem; }
}
@media (min-width: 577px) and (max-width: 621px) {
/* 20250920 eingefügt */
.grid { padding-top: 10rem; }
}
@media (min-width: 622px) and (max-width: 639px) {
/* 20250920 eingefügt */
.grid { padding-top: 8rem; }
}
@media (min-width: 640px) and (max-width: 768px) {
.grid { padding-top: 5rem; }
}
@media (min-width: 769px) and (max-width: 1070px) {
/* 20250919 eingefügt: bis 769px: mobile; ab 769px: tablet and up; ab 1024px: desctop an up */
.grid { padding-top: 5rem; }
}
@media (min-width: 1071px) and (max-width: 1094px) {
/* 20250919 eingefügt */
.grid { padding-top: 1.5rem; }
}
@media (min-width: 1095px) {
/* 20250919 eingefügt*/
.grid { padding-top: 0.5rem; }
}
.buttons-container { /* 300425BF eingefügt*/
display: flex;
justify-content: flex-end; /* rechts ausrichten */
align-items: center; /* vertikal zentrieren */
flex-wrap: wrap; /* für kleine Viewports */
padding-top: 1.0rem;
}
.button.is-link {
background-color: white; /*link-Blau:#3273dc; UDE-Blau:#004C93*/
border-color: transparent;
color: #004C93; }
.button.is-link:hover, .button.is-link.is-hovered {
background-color: #276cda;
border-color: transparent;
color: #004C93; }
.button.is-link:focus, .button.is-link.is-focused {
border-color: transparent;
color: #004C93; }
.button.is-link:focus:not(:active), .button.is-link.is-focused:not(:active) {
box-shadow: 0 0 0 0.125em rgba(50, 115, 220, 0.25); }
.button.is-link:active, .button.is-link.is-active {
background-color: white;
border-color: transparent;
color: #004C93; }
.button.is-link[disabled],
fieldset[disabled] .button.is-link {
background-color: #004C93;
border-color: transparent;
box-shadow: none; }
.button.is-link.is-inverted {
background-color: #fff;
color: #004C93; }
.button.is-link.is-inverted:hover, .button.is-link.is-inverted.is-hovered {
background-color: #f2f2f2; }
.button.is-link.is-inverted[disabled],
fieldset[disabled] .button.is-link.is-inverted {
background-color: #fff;
border-color: transparent;
box-shadow: none;
color: #004C93; }
.button.is-link.is-loading::after {
border-color: transparent transparent #fff #fff !important; }
.button.is-link.is-outlined {
background-color: white;
border-color: #004C93;
color: #004C93; }
.button.is-link.is-outlined:hover, .button.is-link.is-outlined.is-hovered, .button.is-link.is-outlined:focus, .button.is-link.is-outlined.is-focused {
background-color: #004C93;
border-color: #004C93;
color: #fff; }
.button.is-link.is-outlined.is-loading::after {
border-color: transparent transparent #004C93; #004C93; !important; }
.button.is-link.is-outlined.is-loading:hover::after, .button.is-link.is-outlined.is-loading.is-hovered::after, .button.is-link.is-outlined.is-loading:focus::after, .button.is-link.is-outlined.is-loading.is-focused::after {
border-color: transparent transparent #fff #fff !important; }
.button.is-link.is-outlined[disabled],
fieldset[disabled] .button.is-link.is-outlined {
background-color: transparent;
border-color: #004C93;
box-shadow: none;
color: #004C93; }
.button.is-link.is-inverted.is-outlined {
background-color: transparent;
border-color: #fff;
color: #fff; }
.button.is-link.is-inverted.is-outlined:hover,
.button.is-link.is-inverted.is-outlined.is-hovered,
.button.is-link.is-inverted.is-outlined:focus,
.button.is-link.is-inverted.is-outlined.is-focused {
background-color: #fff;
color: #004C93; }
.button.is-link.is-inverted.is-outlined.is-loading:hover::after,
.button.is-link.is-inverted.is-outlined.is-loading.is-hovered::after,
.button.is-link.is-inverted.is-outlined.is-loading:focus::after, .button.is-link.is-inverted.is-outlined.is-loading.is-focused::after {
border-color: transparent transparent #004C93; #004C93; !important; }
.button.is-link.is-inverted.is-outlined {
background-color: transparent;
border-color: #fff;
color: #fff; }
.button.is-link.is-inverted.is-outlined:hover,
.button.is-link.is-inverted.is-outlined.is-hovered,
.button.is-link.is-inverted.is-outlined:focus,
.button.is-link.is-inverted.is-outlined.is-focused {
background-color: #fff;
color: #004C93; }
.button.is-small.is-rounded.is-link.has-tooltip-bottom { background-color: #004C93; /*UDE-Blau*/ } /*20250711 eingefügt*/
.exportoptions {
margin-top: 2.0em;
}
.buttonlist{ /*für resposive Buttonleiste*/
display: flex;
flex-flow: no wrap;
justify-content: flex-start;
padding: 0.3rem 0rem 0.3rem 0rem; /*für Padding: ob re un li*/
}
.buttonlist img { /*für Icongröße in Buttonleiste*/
height: 2.5rem;
width: auto;
margin-top: 0em; }
/*Auswahlfelder*/
.card { /*für Auswahlfeldercard-Position*/
display: flex;
flex-flow: column;
margin-left: 0em;
margin-top: 8em;
min-width: 10.0em;
width: 100%;
}
.card.is-shady { border: unset !important; } /*20250709 eingefügt */
.label-container, .button-label { /*für einh.responsive Feldbezeichner*/
display: flex;
justify-content: left;
background: ;
min-width: 10.0em; /*für kleine Viewports*/
width: 10%; } /*für kleine Viewports*/
.control-new { /*für einheitliche Controls*/
min-width: 10.0em; /*für kleine Viewports*/
width: 10%; /*für große Viewports*/
}
.button { /*für Button-Bezeichner-Ausrichtung*/
display: flex;
justify-content: left; }
/*Erläuterungen/Legende*/
.box-new { /*für Kopfzeile mit Close-Button*/
display: flex;
justify-content: space-between;
font-weight: bold;
}
.leg_erl {
background-color: whitesmoke; /*für Abschnitthintergrund, Schrift*/
font-size: 0.8em;
}
.dl_title { /*für Texthervorhebungen*/
display: flex;
justify-content: center;
background: inherit;
font-size: 1.2em;
font-weight: 400;
}
/*Datentabellen*/
.table-container {
z-index: 10; /*positioniert sich im flow hinter dem hs_header*/
}
table.ergtabelle tr.listRowOdd td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr.listRowEven td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr td.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr th.leer
{
border:thin solid white;
background-color:white;
}
table.ergtabelle tr th.header
{
vertical-align:center;
text-align:center;
}
table.ergtabelle
{
border:thin solid white;
font-size:1.5rem;
}
/* Zahlen rechtsbündig:*/
table.ergtabelle tbody tr.listRowEven td.integer
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowOdd td.integer
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowEven td.decimal
{
text-align:right;
empty-cells:show
vertical-align:center;
}
table.ergtabelle tbody tr.listRowOdd td.decimal
{
text-align:right;
empty-cells:show
vertical-align:center;
}
.vizTitle
{
margin-top: 2em;
white-space: normal;
word-wrap: normal;
overflow-wrap: break-word;
hyphens: auto;
font-size:1.2em;
font-weight:bolder;
}
</style>
</xsl:template>
<xsl:template name="nd_legendeHeaderContent">
<xsl:param name="ergebniselement_ordnr" select="0" />

5
superx/xml/viz_html_chart_viewer_grid.xsl
Unescape View File

@ -42,13 +42,13 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util @@ -42,13 +42,13 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util
</xsl:call-template>
<link rel="stylesheet" href="../style/sx_tabelle.css" />
<link rel="stylesheet" type="text/css" href="../style/sx_viz_muster.css" />
<!--<link rel="stylesheet" href="../style/superx.css" />-->
</head>
<xsl:call-template name="nd_htmlscript" />
<xsl:call-template name="nd_tableJavascript" />
<xsl:call-template name="nd_tableCSS" />
<xsl:call-template name="vizTableCSS" />
<xsl:call-template name="importVizViewer"></xsl:call-template>
<body class="has-navbar-fixed-top" onload="document.getElementById('progressbar').style.display='none';initPage();">
@ -75,9 +75,6 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util @@ -75,9 +75,6 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util
<div id="content" style="padding-left:1rem;padding-top:6rem">
<!--#Template Beginn Seitentitel-->
<xsl:variable name="masken_tid"><xsl:value-of select="/ergebnisse/ergebnis[@ordnr='0']/maskenname/@id"/></xsl:variable>
<xsl:call-template name="vizGridTitle" >
<xsl:with-param name="icon_classname" select="/ergebnisse/menue/eintraege/eintrag[@isMaske='true' and tid=$masken_tid]/css_class" />
</xsl:call-template>
<!--#Template Krümelpfad-->
<!--<xsl:call-template name="nd_breadcrumb" />-->

Write Preview
Loading…
Cancel
Save