You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
418 lines
8.3 KiB
418 lines
8.3 KiB
/*spezifische Basics */ |
|
|
|
html, body { |
|
max-width: 100%; |
|
overflow-x: visible; |
|
} |
|
/*20240704 BF hierher verschoben*/ |
|
/*20240609/13 BF eingefügt u. angepasst*/ |
|
|
|
.table-container { |
|
border-collapse: collapse; |
|
font-family: sans-serif; |
|
font-weight: normal; |
|
font-size: 0.8em; |
|
overflow-x: auto; /* Nur horizontales Scrollen */ |
|
overflow-y: auto; /* Vertikales Scrollen */ |
|
max-height: 80vh; /* max. Container-Höhe 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */ |
|
max-width: 185vb; /* max. Container-Breite 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */ |
|
width: 100%; /* volle Container-Breite */ |
|
white-space: normal; /* Ermöglicht Zeilenumbrüche in den Tabellenzellen */ |
|
/*white-space: nowrap; /* Verhindert Zeilenumbrüche in den Tabellenzellen */ |
|
-webkit-overflow-scrolling: touch; /* Für bessere Scroll-Erfahrung auf Mobilgeräten */ |
|
} |
|
|
|
.level-center { /*für zentrierte Icons in Tabelle*/ |
|
display: flex; |
|
justify-content: center; |
|
} |
|
|
|
table { |
|
border-collapse: collapse; /* Verhindert Doppellinien an den Grenzen */ |
|
/*min-width: 130%;*/ /* Tabellen-Breite gößer als Container-Breite, damit Scrollbalken sichtbar ist */ |
|
max-width:100%; |
|
white-space: normal; |
|
} |
|
|
|
th, td { |
|
padding: 8px; |
|
border: 1px solid #ddd; |
|
white-space: normal; /* Erlaubt Zeilenumbrüche */ |
|
} |
|
|
|
table thead th { /*für Tabellenposition*/ |
|
position: sticky; |
|
top: 0; |
|
z-index: 20; |
|
} |
|
|
|
table th.header, table th.fixed-column1-title*/ { /*für Spaltentitel*/ |
|
background: #ECF0F3 /*#dbdee3ff*/; |
|
color: hsl(0, 0%, 21%); |
|
font-weight: bold; } |
|
|
|
table th.fixed-column1-title, table td.fixed-column1 { /*zum Fixieren des 1. Spaltentitels b. horizont. Scrollen*/ |
|
position: sticky; |
|
z-index: 25; |
|
left: 0em; } |
|
|
|
table td.fixed-column1 { |
|
background: #ECF0F3; /*whitesmoke; /*zum Fixieren der 1. TabSpalte b. horizont. Scrollen*/ |
|
filter: opacity(1.0); |
|
position: sticky; |
|
z-index: 20/*500*/; |
|
left: 0em; |
|
border: thin solid; |
|
border-collapse: collapse; }*/ |
|
|
|
table tr.erglevel0 { |
|
font-weight:bolder; |
|
background: white; |
|
border: thin solid; |
|
border-collapse: collapse; } |
|
|
|
table tr.erglevel_1 { |
|
font-weight:bolder; |
|
background: white; |
|
color: hsl(0, 0%, 21%); |
|
border: thin solid; |
|
border-collapse: collapse; } |
|
|
|
table tr.erglevel_2 { |
|
font-weight:bold; |
|
background: white /*#f1f1f1*/; |
|
color: hsl(0, 0%, 21%); |
|
border: thin solid; |
|
border-collapse: collapse; } |
|
|
|
table tr.erglevel_3 { |
|
font-weight:normal; |
|
background: white /*#f1f1f1*/; |
|
border: thin solid; |
|
border-collapse: collapse; } |
|
/*nach oben verschoben*/ |
|
table.ergtabelle |
|
{ |
|
margin-left:0px; |
|
margin-right:0px; |
|
margin-top:0px; |
|
margin-bottom:0px; |
|
padding-left:0px; |
|
padding-right:0px; |
|
padding-top:0px; |
|
padding-bottom:0px; |
|
/*border:thin solid rgb(0,0,0);*/ /*20240619 BF auskommentiert*/ |
|
empty-cells:show; |
|
border-collapse: separate; |
|
border-spacing: 0; |
|
font-size:80%; |
|
} |
|
|
|
table.ergtabelle thead { |
|
position: -webkit-sticky; |
|
position: sticky; |
|
top: 50px; |
|
z-index: 4; |
|
} |
|
|
|
table td.ergfeld |
|
{ |
|
empty-cells:show; |
|
vertical-align:top; |
|
border:thin solid gray; |
|
} |
|
|
|
table td.prozent |
|
{ |
|
border:thin solid gray; |
|
empty-cells:show; |
|
font-style:italic; |
|
color:#999999; |
|
} |
|
|
|
table td.lt5 |
|
{ |
|
border:thin solid gray; |
|
empty-cells:show; |
|
} |
|
|
|
table td.lt5:before {content:"< 5";color:#ff0000;} |
|
|
|
table th.header |
|
{ |
|
background-color: #ECF0F3; /*#dbdee3ff;*/ |
|
color: black; |
|
border: 1px solid black; |
|
padding: 5px; |
|
border-collapse: separate; |
|
border-spacing: 0; |
|
empty-cells: show; |
|
font-size: 80%; |
|
} |
|
|
|
table th.printheader |
|
{ |
|
font-size:10pt; |
|
font-weight:bold; |
|
text-align:center; |
|
background-color:white; |
|
border-top:1px solid; |
|
border-right:1px solid; |
|
border-bottom:1px solid; |
|
border-left:0; |
|
} |
|
|
|
table td.result |
|
{ |
|
font-size:10pt; |
|
empty-cells:show; |
|
} |
|
|
|
table td.string |
|
{ |
|
text-align:left; |
|
empty-cells:show; |
|
border:thin solid gray; |
|
} |
|
|
|
table td.decimal |
|
{ |
|
text-align:right; |
|
empty-cells:show; |
|
border:thin solid gray; |
|
|
|
} |
|
table td.boldnumber |
|
{ |
|
text-align:right; |
|
empty-cells:show; |
|
font-weight:bold; |
|
} |
|
|
|
table td.integer |
|
{ |
|
text-align:right; |
|
empty-cells:show; |
|
border:thin solid gray; |
|
} |
|
|
|
p.errmsg |
|
{ |
|
border: medium solid red; |
|
text-align:left; |
|
background-color:#d7d7d7; |
|
} |
|
|
|
table tr.erglevel0 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel_1 |
|
{font-weight:bold; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel_2 |
|
{font-weight:bold; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel_3 |
|
{font-weight:normal;; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel_4 |
|
{font-weight:normal;; |
|
background-color:#f1f1f1; |
|
} |
|
/*Wenn nur 1 Ebene vorlieg:*/ |
|
table tr.erglevel1_0 |
|
{font-weight:bolder; |
|
} |
|
|
|
table tr.erglevel1_1 |
|
{font-weight:normal;; |
|
} |
|
|
|
/*Wenn nur 2 Ebenen vorliegen:*/ |
|
table tr.erglevel2_0 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel2_1 |
|
{font-weight:bolder; |
|
} |
|
|
|
table tr.erglevel2_2 |
|
{font-weight:normal;; |
|
} |
|
|
|
/*Wenn nur 3 Ebenen vorliegen:*/ |
|
table tr.erglevel3_0 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel3_1 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel3_2 |
|
{font-weight:bolder; |
|
} |
|
|
|
table tr.erglevel3_3 |
|
{font-weight:normal;; |
|
} |
|
|
|
/*Wenn nur 4 Ebenen vorliegen:*/ |
|
table tr.erglevel4_0 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel4_1 |
|
{font-weight:bolder; |
|
background-color:#f1f1f1; |
|
} |
|
|
|
table tr.erglevel4_2 |
|
{font-weight:bolder; |
|
} |
|
|
|
table tr.erglevel4_3 |
|
{font-style:italic; |
|
} |
|
|
|
table tr.erglevel4_4 |
|
{font-weight:normal;; |
|
} |
|
|
|
table tr.issumme |
|
{font-weight:bolder; |
|
background-color:#d7d7d7; |
|
} |
|
|
|
span.hidden_navi |
|
{ |
|
margin:0px; |
|
padding:0px; |
|
font-size:smaller; |
|
display:inline |
|
} |
|
|
|
.listRowEven { |
|
background-color: #EFEFEF; |
|
} |
|
|
|
.listRowEvenHover { |
|
/* background-color: #EFEAB3; */ |
|
background-color: #FFFABF; |
|
} |
|
|
|
.listRowOdd { |
|
background-color: #FFFFFF; |
|
} |
|
|
|
.listRowOddHover { |
|
background-color: #FFFABF; |
|
} |
|
|
|
table.ergtabelle, table.ergtabelle th, table.ergtabelle td { |
|
/*border: 1px solid black;*//*20240619 BF auskommentiert*/ |
|
border-collapse: separate; |
|
border-spacing: 0; |
|
} |
|
|
|
table.ergtabelle tr:hover {background-color: hsl(219, 70%, 76%); /*#e5e5e5;*/ } |
|
|
|
table.ergtabelle th { |
|
background-color: #dbdee3ff; |
|
color: black; |
|
border: 1px solid black; |
|
border-collapse: separate; |
|
} |
|
|
|
table.ergtabelle th, table.ergtabelle td { |
|
padding: 5px; |
|
} |
|
|
|
p.teiltabelle_titel { |
|
clear: left; |
|
line-height: 115%; |
|
border-bottom: 2px solid black; |
|
color: black; |
|
display: block; |
|
font-size: 115%; |
|
font-weight: bold; |
|
margin: 5px 0 20px 5px; |
|
padding: 0px 0px 0px 5px; |
|
} |
|
|
|
/*Legende*/ |
|
.legende { |
|
/*display: flex;*/ |
|
flex: 1 1 auto; /* 20240911; flex-grow, flex-shrink, flex-basis = auto; /*für flexibles Verhalten der Zeile*/ |
|
flex-flow: row wrap; |
|
justify-content: flex-start; |
|
align-items: normal; |
|
padding: 0.3rem; |
|
margin-bottom: 0.1rem; |
|
border: thin solid hsl(0, 0%, 71%); /*hellgrau*/ |
|
border-radius: 0.3em; } |
|
|
|
p.legende { |
|
color: black; |
|
gap: 3px; /* Abstand zwischen den Elementen */ |
|
width: auto; } |
|
|
|
.legende-info { |
|
font-weight: normal; } |
|
|
|
|
|
/*Table-Buttonleiste mit input-container inkl.: Label, Auswahlfeld, Button*/ |
|
.input-container { |
|
display: flex; |
|
align-items: center; |
|
flex-wrap: nowrap; /*Verhindert Umbruch bei kleinerem Viewport*/ |
|
white-space: nowrap; /*Verhindert den Umbruch des Labeltextes */ |
|
flex-shrink: 1; /*Lässt Select-Element schrumpfen, falls der Platz knapp wird*/ |
|
padding-bottom: 0.1rem; |
|
} |
|
|
|
.field { margin-left: 1px; } /*für Abstand Buttonbar-SelectFeld*/ |
|
|
|
.select select { /*für Auswahlfeldstyle*/ |
|
border:thin solid hsl(0, 0%, 71%); /*hellgrau*/ /*oder var(--bulma-link-light)*/ |
|
border-radius: 0.3em; } |
|
|
|
/* Standarddarstellung für größere Viewports */ |
|
.input-container > .label { |
|
margin-bottom: 0.3rem; |
|
margin-right: 0.5rem; } /* Abstand zwischen Label und Eingabefeld*/ |
|
|
|
.input-container { |
|
flex-direction: row; |
|
align-items: center; |
|
width: 100% } |
|
|
|
/*Spezifische Anpassungen für kleinere Viewports bis 768px=Tablet-Hochformat*/ |
|
@media screen and (max-width: 768px) { |
|
.input-container, .legende, p.legende, .breadcrumb, .buttonbar { |
|
flex-direction: column; /* Stapelt die Felder vertikal; 20241102 BF geänd. v row*/ align-items: center; |
|
width: 100% |
|
} |
|
} |
|
|
|
/*Datensatzinfo unterhalb Ergebnistabelle*/ |
|
.pagination-container { |
|
display: inline-flex; |
|
align-items: center; |
|
justify-content: left; |
|
max-width: 80%; |
|
gap: 2px; } /* Abstand zwischen den Elementen */ |
|
|
|
|