po1son
/
Frames-Support


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
							<!--
  This file is part of centurio.work/commands.
  
  centurio.work/commands is free software: you can redistribute it and/or
  modify it under the terms of the GNU General Public License as published by
  the Free Software Foundation, either version 3 of the License, or (at your
  option) any later version.
  
  centurio.work/commands is distributed in the hope that it will be useful, but
  WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
  FITNESS FOR A PARTICULAR PURPOSE.  See the GNU General Public License for
  more details.
  
  You should have received a copy of the GNU General Public License along with
  centurio.work/commands (file COPYING in the main directory).  If not, see
  <http://www.gnu.org/licenses/>.
  -->

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Design</title>
    
    <!-- libs, do not modify. When local than load local libs. -->
    <script type="text/javascript" src="/js_libs/jquery.min.js"></script>
    <script type="text/javascript" src="/js_libs/jquery.browser.js"></script>
    
    
    <link rel="icon" href="favicon.ico">
    <link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png">
    
    <style>
    :root {
      --color: #1e90ff;
      --backgroundcolor: fff;
      --fontcolor: 000;
    }
    
    body {
      color: var(--fontcolor);
      background-color: var(--backgroundcolor);
    }
    
    
    body{
      background-repeat: no-repeat;
      background-size: auto 80%;
      background-position: calc(100% - 18px);;
    }

    .outer{
      width:100%
    }

    .left{
      display: table;
      margin: 0 0;
    }
    
    .center{
      display: table;
      margin: 0 auto;
    }
    
    .right{
      display: table;
      margin: 0px 0px 0px auto;
    }

    .rendered-form {
      position: absolute;
      top: 50%;
      margin: -1.7em;
    }

    a {  margin: 5em; border: 0.3em solid black; border-radius: 50%; background-color: rgb(252, 229, 0); font-weight: bold; font-size: 1.3em; padding: 0.8em 1em 0.8em 1em;}


    a, a:link, a:visited, a:hover, a:active {
      text-decoration: none;
      color: black;
    }
    </style>
    
  </head>
<script>

$(document).ready(function() {
  const queryString = window.location.search;
  const urlParams = new URLSearchParams(queryString);
  
  const text = urlParams.get('text')
  const type = urlParams.get('type')
  const color = urlParams.get('color')
  const backgroundcolor = urlParams.get('backgroundcolor')
  const fontcolor = urlParams.get('fontcolor')
  const backgroundImage = urlParams.get('backgroundImage')
  const backgroundPosition = urlParams.get('backgroundPosition')
  
  var r = document.documentElement;

  if(color != null){
    r.style.setProperty('--color', "#" + color);
  }
  if(backgroundcolor != null){
    r.style.setProperty('--backgroundcolor', "#" + backgroundcolor);
  }
  if(fontcolor != null){
    r.style.setProperty('--fontcolor', "#" + fontcolor);
  }
  if(text != null){
    document.getElementById("header").innerHTML=text;
  }
  if(backgroundImage != null){
    document.body.style.backgroundImage = "url('" +  backgroundImage +"')";
  }
  if(backgroundPosition != null){
    if(backgroundPosition == "left"){
      document.body.style.backgroundPosition = "18px";
    }
    else if(backgroundPosition == "left100size"){
      document.body.style.backgroundPosition = "18px";
      document.querySelector('html').style.setProperty('height', '100%')
    }
    else if(backgroundPosition == "right100size"){
      document.body.style.backgroundPosition = "calc(100% - 18px)";
      document.querySelector('html').style.setProperty('height', '100%')
    }
    else{
      document.body.style.backgroundPosition = "calc(100% - 18px)";
    }
  }
  if(type != null){
    document.getElementById("header").classList.add(type);
  }

});

</script>

<body >
<!-- Animator taken from https://loading.io/css/ -->
<!-- loading icons provided in this page are released under CC0 License -->

  <div class="outer">
    <div id="header" >

    </div>
  </div>


</div>

</body>
</html>