config.css.php
Die config.css.php enthält die Styles für die Konfiguration.
Dateiname: templates/krl-3col-flex/config/config.css.php
<?php
/*
* @category Template for CMSimple_XH Version 1.7+
* @package krl-3col-flex
* @version 3.2.1
* @file config.css.php | Stylsheet zum Anzeigen der Konfiguration
* @last_modified 07.03.2024
* @author Karl Richard Lembach | https://lembach-cmsimple.de/?Home
* @copyright 2021 - 2024 Karl Richard Lembach <https://lembach-cmsimple.de>
* @license https://www.gnu.org/licenses/gpl-3.0 GNU GPLv3
* @link https://template.lembach-cmsimple.de/?Template-krl-3col-flex
* @contact https://lembach-cmsimple.de/?Home/Kontakt-Formular | webmaster@lembach-cmsimple.de
Dieses Programm ist freie Software.
Sie können es unter den Bedingungen der GNU General Public License, wie von der Free Software Foundation veröffentlicht,
weitergeben und/oder modifizieren, entweder gemäß Version 3 der Lizenz oder (nach Ihrer Option) jeder späteren Version.
Die Veröffentlichung dieses Programms erfolgt in der Hoffnung, daß es Ihnen von Nutzen sein wird, aber OHNE IRGENDEINE GARANTIE,
sogar ohne die implizite Garantie der MARKTREIFE oder der VERWENDBARKEIT FÜR EINEN BESTIMMTEN ZWECK. Details finden Sie in der GNU General Public License.
Sie sollten ein Exemplar der GNU General Public License zusammen mit diesem Programm erhalten haben. Falls nicht, siehe <https://www.gnu.org/licenses/gpl-3.0>.
Deutsche Übersetzung (kein rechtskräftiger Ersatz des Originals): http://www.gnu.de/documents/gpl.de.html
*/
echo '<style type="text/css">
select.aktionswahl {
cursor: pointer;
font-family: monospace, Consolas, "Helvetica", sans-serif;
font-size: ' . $mainfontsize . 'em;
background-color: var(--dynakzent);
color: var(--akzenttextcolor);
border: 1px black solid;
border-radius: 0.5ex 0.5ex 0 0;
padding: 0.5ex;
margin-right: 1ex;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
width: 100%;
text-overflow: ellipsis;
}
option:hover {
background: red;
}
div.configframe {
border: 1px solid red;
border-radius: .5ex 0ex .5ex 0ex;
margin-bottom: .5ex;
padding: .5ex;
width: calc(100% - 1.25ex);
}
fieldset.conf, fieldset.conf0, fieldset.conf1, fieldset.conf2, fieldset.conf3 {
border: 1px solid gray;
border-radius: .5ex 0ex .5ex 0ex;
margin: 0 .5ex .5ex .0ex;
padding: 0.5em;
}
fieldset.conf {
background: var(--newsbackground);
margin: 0ex;
padding: .5ex;
}
fieldset.conf0 {
margin: 0ex;
}
fieldset.conf1 {
width: calc(100% - 5.5ex);
}
fieldset.conf2 {
width: calc((100% - 9.375ex) / 2);
float: left;
margin-right: 1.0ex;
background: var(--hintergrund);
}
fieldset.conf3 {
width: calc(100% - 5.5ex);
background: var(--hintergrund);
}
#colortransp {
margin-top: .2em;
padding: 0 2ex 0 0;
float: left;
}
textarea {
width: 100%;
font-size: unset;
}
legend.shadow {
margin-top: 0.6ex;
padding: 0ex 0.6ex 0.3ex 0.6ex;
border: 1px solid gray;
border-radius: .5ex 0ex .5ex 0ex;
background-color:#f8f8f8;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
}
label.shadow {
white-space: normal;
background-color:#f0f0f0;
padding: 0 .5ex .3ex .5ex;
margin: 0 1ex 2ex 0;
border-radius: .5ex 0ex .5ex 0ex;
border: 1px solid gray;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
}
div.shadow {
white-space: normal;
background-color:#f0f0f0;
padding: 0 .5ex .3ex .5ex;
margin: 0 0ex 0 0;
border-radius: .5ex 0ex .5ex 0ex;
border: 1px solid gray;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
}
table.radiobutton td{
padding-right: 1ex;
vertical-align: top;
}
table.translation {
width: 100%;
hyphens: none;
border-collapse: separate;
border-spacing: 10px;
margin: .5ex;
}
th#translation, td#translation {
padding: .5ex;
background-color: var(--hintergrund);
border: 0px solid black;
width: 45%;
text-align: left;
}
th#left, td#left {
padding: .5ex;
background-color: var(--hintergrund);
text-align: left;
}
input#foldername {
min-width: 50em;
}
input#color, input#background {
min-width: 4em;
height: 5ex;
padding: 0em;
margin-bottom: .5ex;
cursor: pointer;
}
input#color{
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
}
input#color_js, input#hovercolor_js {
color: #FFFFFF;
background: var(--dynakzent);
border: 1px solid black;
border-radius: .5ex;
font-size: 0.9em;
padding: .9ex;
margin-top: 1ex;
margin-bottom: .5ex;
cursor: pointer;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
box-sizing: border-box;
}
input#hovercolor_js {
background: var(--menuhover);
}
input#transluzenz {
margin: unset;
padding: unset;
cursor: pointer;
height: 2.5ex;
}
div#transluzenz {
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
height: 3ex;
border: 1px solid gray;
border-radius: 0.5ex;
padding-top: 1ex;
padding-left: 20px;
padding-right: 10px;
margin-bottom: .3ex;
}
div#transluzenz::before {
content: "transp. ";
font-size: x-small;
vertical-align: top;
}
div#transluzenz::after {
content: " opac";
font-size: x-small;
vertical-align: top;
}
input#numeric {
padding: 0.25ex 0 0 .75ex;
margin-top: 1ex;
cursor: pointer;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
border-width: 1px;
line-height: 150%;
font-size: .9em;
}
input#alphanumeric {
padding: 0.25ex 0 0 .75ex;
margin-top: 1ex;
cursor: pointer;
width: 99%;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
border-width: 1px;
line-height: 150%;
font-size: .9em;
}
#output {
padding: .5ex .5ex .5ex .5ex;
}
#outputred {
padding: .5ex .5ex .5ex .5ex;
color: #ff0000;
}
div.farbausgabe {
margin: .5ex 1ex .5ex .5ex;
padding: .5ex;
max-width: 99%;
border: 1px solid black;
}
div.menuausgabe {
width: 250px;
margin-bottom: 1px;
color: white;
}
button#maincolor, button#startconfiguration, button#rechts, input#rechts {
cursor: pointer;
font-family: "Helvetica", sans-serif !important;
font-size: .9em !important;
margin-bottom: .5ex;
margin-top: 1.8ex;
padding: 1ex;
border-radius: .5ex;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
// line-height: 3.28ex;
background-color: var(--dynakzent);
}
button#maincolor, button#startconfiguration {
margin-top: unset;
}
button#hovercolor {
line-height: 3.28ex;
}
button#rechts, input#rechts {
border: 1px solid red;
border-radius: .5ex .0ex .5ex .0ex;
margin: 1.0ex .5ex .5ex auto;
padding: 0.5em;
float: right;
}
.krl_copyright, .krl_copyright2 {
text-align: right;
color: var(--dynakzent);
padding-top: .5ex;
font-size: .7em;
font-weight: 900;
}
.krl_copyright2 {
float: right;
padding-top: 1.5ex;
}
.crazystatlink{
padding-left: 2em;
font-size: .7em;
font-weight: 600;
}
table.radiobutton {
border-collapse: separate;
border-spacing: 0ex 1ex;
}
.infohelp {
float: right;
font-family: monospace, Consolas, "Helvetica", sans-serif;
color: var(--newscolor);
text-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--newscolor);
}
.fa-info-circle {
font-size: 14pt;
margin-left: .75ex;
margin-top: .5ex;
}
[data-tip] {
font-size: ' . $footerfontsize . 'em;
position: relative;
}
[data-tip]:hover:before,
[data-tip]:hover:after {
display: block;
}
[data-tip]:before {
/* hides the tooltip when not hovered */
display: none;
}
[data-tip]:after {
display: none;
content: attr(data-tip);
position: absolute;
top: 3.5em;
right: -0.8ex;
padding: 5px 8px;
background: var(--newscolor);
color: #ffffff;
border: 1px solid var(--labeldangerbackground);
border-radius: 0.5ex;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--newscolor);
text-shadow: none;
z-index: 9;
min-height: 1.2em;
width: 47.3vw;
max-width: 930px;
line-height: 1.2em;
}
/* Aeussere Klammer durch <details> - </details> *********************************/
details.config {
white-space: normal;
padding: 0 .5ex .3ex .5ex;
margin: 0 0ex 0 0;
border-radius: .5ex 0ex .5ex 0ex;
border: 1px solid gray;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
background: var(--akkordeonbackground);
cursor: pointer;
}
details.config[open] {
background: var(--hintergrund);
border: unset;
box-shadow: unset;
padding: unset;
}
details.config #toggelonoff {
display: inline-block;
float:right;
padding-right: 1ex;
padding-top: .3ex;
color: var(--labeldangercolor);
font-size: small;
}
details.config #toggelonoff::after {
content: "'.$text['clicktoopen'].'";
}
details.config[open] #toggelonoff::after {
content: "'.$text['clicktoclose']. '";
}
@media only screen and (max-width : 550px) {
details.config #toggelonoff {
display: none;
}
}
/* Innere Klammer (fuer die Ueberschrift) durch <summary> - </summary> ***********/
summary.config {
margin: 1ex 1ex 1ex 0;
padding-left: 1ex;
border-radius: .5ex .5ex 0ex 0ex;
border: 1px solid gray;
box-shadow: .054vw .054vw .109vw var(--hintergrund), .164vw .164vw .164vw var(--dynakzent);
text-shadow: unset;
font-weight: unset;
background-color: var(--dynakzent);
color: var(--akzenttextcolor);
}
details.config[open] summary.config {
/* display: none;*/
}
button#closeaccordion {
background-color: var(--dynakzent);
color: var(--akzenttextcolor);
border: 1px solid gray;
border-radius: 2ex;
}
#height1ex {
height: 1ex;
}
div.confighelp {
height: 50vh;
overflow-y: scroll;
padding-left:.2ex;
padding-right: .2ex;
}
.menucolor {
background-color: var(--menumain);
border: 1px solid gray;
padding-left: 1ex;
color: #ffffff;
}
.contentcolor {
border: 1px solid gray;
padding-left: 1ex;
}
.boxcolor {
background-color: var(--newsbackground);
border: 1px solid gray;
padding-left: 1ex;
}
.label3col {
width: calc(99% - 1.5ex);
float: right;
}
.favicon_auswahl {
width: 100%;
}
.favicon_auswahl tr{
height: 32px;
}
.favicon_auswahl tr:nth-of-type(2n+1) {
background-color: #f6f6f6;
}
.glow:hover {
color: #FF0000;
background-color: #f0f0f0;
}
</style>
'."\n";