Forum - Einstellungen im Forum

 
/* Multi-Dialog-Assistent */
.ui-dialog {
text-align:left;
width:auto !important;
max-width:370px;
background:#ffffff;
border:1px solid #000000;
z-index:99999 !important;
}
.ui-dialog .checkbox {
margin: 0 5px 2px 10px;
}
.ui-dialog input, .ui-dialog textarea {
text-align:left;
outline: none;
background:#eeeeee !important;
color:#000000 !important;
border:1px solid #000000;
padding-left:5px;
}
.ui-dialog input:hover, .ui-dialog textarea:hover  {
background:#ffffff !important;
border:1px solid #000000 !important;
}
.ui-dialog input:focus, .ui-dialog textarea:focus  {
background:#ffffff !important;
}
.ui-dialog input[type=button] {
background:#cccccc !important;
color:#000000 !important;
font-size:13px;
cursor:pointer;
margin-right:10px !important;
}
.ui-dialog input[type=button]:hover {
background:#ffffff !important;
 
}
.ui-dialog-titlebar {
background:#dddddd !important;
background-image: -moz-linear-gradient(15% 90% 90deg,#aaaaaa, #dddddd, #dddddd 100%) !important;	
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#aaaaaa), to(#dddddd)) !important;
background-image: -ms-linear-gradient(90deg,#aaaaaa,#dddddd) !important;
 
border:1px solid #000000 !important;
color: #111111;
}
.ui-dialog-content{
background:#dddddd !important;
border-radius:5px;
border:1px solid #000000 !important;
overflow:hidden !important;
margin-top:5px;
font-size:14px;
color:#111111 !important;
}
.ui-state-hover:hover {
border-radius:5px !important;
background:#ffffff !important;
border:none !important;
}
.ui-widget-overlay {
z-index:9999 !important;
}
 
.myText {
background:#eeeeee;
border-radius:5px;
padding:5px 5px 5px 20px;
font-size:small;
}
 
::placeholder {
opacity: 0.8; 
font-size:11px;
}
 
/* Modalansicht */
.myImgModal {border-radius: 5px;cursor: pointer;}
.myImgModal:hover {opacity: 0.7;}
#closeImg {position: absolute; top: 0px; right: 15px; color: #f1f1f1; font-size: 40px; font-weight: bold;padding:20px;}
#closeImg:hover, .close:focus {color: #ff8000; text-decoration: none; cursor: pointer;}
#myModal  {display: none;position: fixed;z-index: 999999;padding-top: 100px;left: 0;top: 0;width: 100%; height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.9);}
#imgAll {margin: auto;display: block;max-height: 75%;max-width: 90%;cursor:pointer;}
#caption {font-size:110%;margin: auto;text-align: center;color: #cccccc;padding-top:5px;}
 
/* Unterschriften Bilder */
dl {
display: table-cell;
text-align:center;
padding:10px;
}
dl dd {
display: inline-block; 
padding: 2px 10px 0 10px;
font-style: italic;
border-radius:2px;
box-shadow: 1px 1px 2px 2px #cccccc;
margin: 4px 0 0 0px;
}
dl.bildmodal {display: table-cell;text-align:center;margin:0px;padding:4px;}
dl.bildmodal dd {font-size:85%;max-width: 600px;display: inline-block; margin:0px;padding: 2px 10px;border-radius:2px;box-shadow: 1px 1px 2px 2px #cccccc;}
 
@media only screen and (max-width: 700px){.modal-content {width: 100%;}}
 
/* Umschaltung Mult-Dialog-Assistent - V6 */
.mbt .multiTag_false, .multiTag_true {display:block;}
.mbt .multiTag_true, .multiTag_false {display:none;}
 

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
 
<script type='text/javascript' src='//code.jquery.com/ui/1.12.0/jquery-ui.min.js'></script> 
<script>
/* Gegenseitige Auslösung! */
window.addEventListener('load', function(){
$('.xob_hassub').click(function(){
$('#addMyVideo,#addMyLink,#addMyIMG').not(this).dialog("close");
});
});
 
/* Dialoge */
var dialog;
 
//Video
function insertMyVideoTag(){ 
if(!$("#addMyVideo").length){
dialog = $(`<div id="addMyVideo">
 
<ul class="myText">
<li>Geben Sie die Adresse für das Video ein, z.B.:
<br>"https://www.youtube.com/watch?v=bGJOmGL6mYM" 
<br>"https://www.youtube.com/embed/bGJOmGL6mYM" 
<br>"https://youtu.be/bGJOmGL6mYM"</li>
<li>Ändern Sie gegebenfalls die Größe des Videos!<br></li>
<li>Oder klicken Sie einfach auf "Video einfügen"!</li>
</ul>
 
<br><br>
Adresse:<br><input class="gotovideo" type="text" placeholder="https://......" value=""><br><br>
Breite: <input id="gotovideobreite" type="text" value="360px" style="text-align:center;width:50px;margin-right:10px;"> 
Höhe: <input id="gotovideohoehe" type="text" value="200px" style="text-align:center;width:50px;margin-right:10px;"> 
Autoplay: <input type="checkbox" class="checkbox" onclick=\'$(".myCheckbox_videoplay_toggle").toggle();\'> 
 
<br><br><br>
<input class="myCheckbox_videoplay_toggle" id="insertvideo" type="button" value="Video einfügen" onclick=\'xob_insert("[videobox="+$("#gotovideobreite").val()+","+$("#gotovideohoehe").val()+"]",""+$(".gotovideo").val()+"[/videobox]");$("#addMyVideo").dialog("close");\'>
<input style="display:none;" class="myCheckbox_videoplay_toggle" id="insertvideo" type="button" value="Video einfügen" onclick=\'xob_insert("[videobox="+$("#gotovideobreite").val()+","+$("#gotovideohoehe").val()+"]",""+$(".gotovideo").val()+"?autoplay=1&mute=1[/videobox]");$("#addMyVideo").dialog("close");\'> 
<input type="button" value="Abbrechen" onclick=\'$("#addMyVideo").dialog("close");\'>
 
<br><br></div>`).appendTo("body").dialog({title:"Video einbinden",resizable: false,});
} else{
$("#addMyVideo").dialog("open");
} 
}
 
//URL
function insertMyLinkTag(){ 
if(!$("#addMyLink").length){
dialog = $(`<div id="addMyLink">
 
<ul class="myText">
<li>Geben Sie die URL des Links ein.
<br>z.B.: "https://www.hilfe-tricks-tipps.de"</li>
<li>Geben Sie einen Namen oder eine Grafik ein.
<br>z.B.: "Forum" oder "[smile]"</li>
</ul>
 
<br><br>
URL:<br><input id="gotourl" type="url" placeholder="https://www......" value=""><br><br>
Name:<br><input id="gototext" type="text" value="Forum">
 
<br><br><br>
<input type="button" value="Link einbinden" onclick=\'xob_insert("[url=",""+$("#gotourl").val()+"]"+$("#gototext").val()+"[/url]");$("#addMyLink").dialog("close");\'> <input type="button" value="Abbrechen" onclick=\'$("#addMyLink").dialog("close");\'>
 
<br><br></div>`).appendTo("body").dialog({title:"Link einbinden",resizable: false});
} else{
$("#addMyLink").dialog("open");
} 
} 
 
//Bild
function insertMyIMGTag(){ 
if(!$("#addMyIMG").length){
dialog = $(`<div id="addMyIMG">
 
<ul class="myText">
<li>Geben Sie die Bildadresse und die Bildbreite ein oder wenn notwendig, ein Bildbeschreibung.</li>
<li>Oder klicken Sie einfach auf "Bild einbinden"!</li>
</ul>
 
<br><br>
Bildadresse:<br><input id="gotoimg" type="url" placeholder="https://www......" value=""><br><br>
Bildbreite (auto, px, em, %):<br><input id="insertimg" type="text" value="300px"><br><br>
 
<span class="myCheckbox_modal_toggle"><input type="checkbox" class="checkbox" onclick=\'$(".myCheckbox_img_toggle").toggle();\'> Bildbeschreibung</span>
<span class="myCheckbox_modal_toggle" style="display:none;"><input type="checkbox" class="checkbox" onclick=\'$(".myCheckbox_img_mo_toggle").toggle();\'> Bildbeschreibung</span> &nbsp;&nbsp;&nbsp;
 
<input type="checkbox" class="checkbox" onclick=\'$(".myCheckbox_modal_toggle").toggle();\'> Modal<br><br>
<span class="myCheckbox_modal_toggle"><span class="myCheckbox_img_toggle" style="display:none;">
<textarea id="gotobildtext" name="text" style="height:100px;"></textarea><br><br><br>
<input type="button" value="Bild einbinden" onclick=\'xob_insert("[unterschrift][img="+$("#insertimg").val()+"]",""+$("#gotoimg").val()+"[/img][beschreibung]"+$("#gotobildtext").val()+"[/beschreibung][/unterschrift]");$("#addMyIMG").dialog("close");\'>
</span>
 
<span class="myCheckbox_img_toggle"><br><input type="button" value="Bild einbinden" onclick=\'xob_insert("[img="+$("#insertimg").val()+"]",""+$("#gotoimg").val()+"[/img]");$("#addMyIMG").dialog("close");\'>
</span></span>
 
<span class="myCheckbox_modal_toggle" style="display:none;"><span class="myCheckbox_img_mo_toggle" style="display:none;">
<textarea id="gotobildtext_mo" name="text" style="height:100px;"></textarea><br><br><br>
<input type="button" value="Bild modal einbinden" onclick=\'xob_insert("[img_modal="+$("#insertimg").val()+" "+$("#gotobildtext_mo").val()+"]",""+$("#gotoimg").val()+"[/img]");$("#addMyIMG").dialog("close");\'></span>
<span class="myCheckbox_img_mo_toggle"><br>
<input type="button" value="Bild modal einbinden" onclick=\'xob_insert("[img_mod="+$("#insertimg").val()+"]",""+$("#gotoimg").val()+"[/img]");$("#addMyIMG").dialog("close");\'></span></span> 
<input type="button" value="Abbrechen" onclick=\'$("#addMyIMG").dialog("close");\'> 
 
<br><br></div>`).appendTo("body").dialog({title:"Bild einbinden",resizable: false});
} 
else{
$("#addMyIMG").dialog("open");
} 
}
</script>