Setting Novel v2 - database Code

Setting Novel v2

hello word
Show Code 

<div class='dropdown_cc'>
   <div class='btnSetting'>
 <button class='btnS1' id='xk' onclick='myFunctionshowpp()'>
<svg xmlns="http://www.w3.org/2000/svg" width="20px" height="20px" viewBox="0 0 1024 1024"><path fill="white" d="M512.5 390.6c-29.9 0-57.9 11.6-79.1 32.8c-21.1 21.2-32.8 49.2-32.8 79.1c0 29.9 11.7 57.9 32.8 79.1c21.2 21.1 49.2 32.8 79.1 32.8c29.9 0 57.9-11.7 79.1-32.8c21.1-21.2 32.8-49.2 32.8-79.1c0-29.9-11.7-57.9-32.8-79.1a110.96 110.96 0 0 0-79.1-32.8m412.3 235.5l-65.4-55.9c3.1-19 4.7-38.4 4.7-57.7s-1.6-38.8-4.7-57.7l65.4-55.9a32.03 32.03 0 0 0 9.3-35.2l-.9-2.6a442.5 442.5 0 0 0-79.6-137.7l-1.8-2.1a32.12 32.12 0 0 0-35.1-9.5l-81.2 28.9c-30-24.6-63.4-44-99.6-57.5l-15.7-84.9a32.05 32.05 0 0 0-25.8-25.7l-2.7-.5c-52-9.4-106.8-9.4-158.8 0l-2.7.5a32.05 32.05 0 0 0-25.8 25.7l-15.8 85.3a353.44 353.44 0 0 0-98.9 57.3l-81.8-29.1a32 32 0 0 0-35.1 9.5l-1.8 2.1a445.93 445.93 0 0 0-79.6 137.7l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.2 56.5c-3.1 18.8-4.6 38-4.6 57c0 19.2 1.5 38.4 4.6 57l-66 56.5a32.03 32.03 0 0 0-9.3 35.2l.9 2.6c18.1 50.3 44.8 96.8 79.6 137.7l1.8 2.1a32.12 32.12 0 0 0 35.1 9.5l81.8-29.1c29.8 24.5 63 43.9 98.9 57.3l15.8 85.3a32.05 32.05 0 0 0 25.8 25.7l2.7.5a448.27 448.27 0 0 0 158.8 0l2.7-.5a32.05 32.05 0 0 0 25.8-25.7l15.7-84.9c36.2-13.6 69.6-32.9 99.6-57.5l81.2 28.9a32 32 0 0 0 35.1-9.5l1.8-2.1c34.8-41.1 61.5-87.4 79.6-137.7l.9-2.6c4.3-12.4.6-26.3-9.5-35m-412.3 52.2c-97.1 0-175.8-78.7-175.8-175.8s78.7-175.8 175.8-175.8s175.8 78.7 175.8 175.8s-78.7 175.8-175.8 175.8"/></svg>setting</button>
<button class='btnS1' onclick='resetStyles()' type='reset'><svg xmlns="http://www.w3.org/2000/svg" width="20px" height="20px" viewBox="0 0 16 16"><path fill="white" fill-rule="evenodd" d="M12.75 8a4.5 4.5 0 0 1-8.61 1.834l-1.391.565A6.001 6.001 0 0 0 14.25 8A6 6 0 0 0 3.5 4.334V2.5H2v4l.75.75h3.5v-1.5H4.352A4.5 4.5 0 0 1 12.75 8" clip-rule="evenodd"/></svg>Reset</button>

      </div>
  <div class='dropdown-bkcc' id='myd'>
<!--[ MENU SETTING ]-->
<div id='menu'>

   <div id='customization-panel'>

  <form id='settingNovel_hiru'>

      <div>     	

        <select name='font-size'>

       <option value=''>Font size</option>

          <option value='10px'>10px</option>

          <option value='12px'>12px</option>

          <option value='13px'>13px</option>

          <option value='14px'>14px</option>

          <option value='15px'>15px</option>

          <option value='16px'>16px</option>

          <option value='17px'>17px</option>

          <option value='18px'>18px</option>

          <option value='19px'>19px</option>

          <option value='20px'>20px</option>

          <option value='21px'>21px</option>

          <option value='22px'>22px</option>

          <option value='23px'>23px</option>

          <option value='24px'>24px</option>

          <!--Tambahkan Pilihan lain <option value='??x'>??px</option> -->

        </select>

      </div>

      <div>

        <select name='bg-color'>

 <option value=''>Background color</option>

      <option value='#FFFFFF'>White</option>

      <option value='#222222'>Dark</option>

      <option value='#434044'>Brown</option>

      <option value='#B3B4B3'>dim white</option>

      <option value='#1F1F1F'>dim black</option>

    <!--Tambahkan Pilihan lain <option value='#??'>#??</option> -->

        </select>

      </div>

  <select id='font-color' name='text-color'>

    <option value=''>Font color</option>

    <option value='#000'>dark</option>

    <option value='#fff'>White</option>

    <option value='#ccc'>dim white</option>

    <option value='#FFBB00'>Orange</option>

    <option value='#00DAFF'>Blue sky</option>

  </select>

      <div>

        <select name='line-height'>

     <option value=''>Line height</option> 

     <option value='60%'>60%</option>

	 <option value='80%'>80%</option>

	 <option value='100%'>100%</option>

	 <option value='120%'>120%</option>

	 <option value='140%'>140%</option>

	 <option value='160%'>160%</option>

	 <option value='180%'>180%</option>

     <option value='200%'>200%</option>

	<!--Tambahkan Pilihan lain <option value='??%'>??%</option> -->

        </select>

      </div>

      <div>

        <select name='font-family'>

             <option value='Arial'>Arial</option>

        <option value='Times New Roman'>Times New Roman</option>

        <option value='Courier New'>Courier New</option>

        <option value='Montserrat'>Montserrat</option>

        <option value='Open Sans'>Open Sans</option>

        <option value='Courgette'>Courgette</option>

        <!--Tambahkan Pilihan lain <option value='??Font'>??Font</option> -->

</select>

      </div>

     
  </form>

</div>

<!--batas menu-->

</div>
  </div>
</div>



  #menu {
    width: 100%
}
.btnSetting {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
  
.btnS1 {
    line-height: 25px;
    display: flex;
    float: left;
    background: #630047;
    border: 1px solid #630047;
    cursor: pointer;
    color: #fff;
    padding: 2px 15px;
    border-radius: 20px;
    font-size: 13px;
    margin-right: 10px;
    align-items: center;
}
  
button.btnS2 {
    line-height: 25px;
    display: flex;
    float: left;
    background: #630047;
    border: 1px solid #630047;
    cursor: pointer;
    color: #fff;
    padding: 2px 15px;
    border-radius: 20px;
    font-size: 13px;
    margin-right: 10px;
    align-items: center;
}  
#customization-panel, #customization-panel form {
    display: flex;
    margin: 0;
    flex-direction: column;
}
#customization-panel select{
    cursor: pointer;
    background: #333;
    border: 1px solid #333;
    font-family: inherit;
    color: #9b9b9b;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 13px;
    margin-bottom: 6px;
}

@media only screen and (min-width:1025px) {
#customization-panel select{
        width: 180px
    }
}

@media only screen and (max-width:767px) {
#customization-panel select{
    cursor: pointer;
    background: #333;
    border: 1px solid #333;
    font-family: inherit;
    color: #9b9b9b;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 13px;
    margin-bottom: 6px;
    }
}
 
@media only screen and (max-width: 800px){
#customization-panel select {
    width: 100% !important;
}}
  
  
#customization-panel select::hover {
      background: #555;
    border-color: #555;
    color: #9b9b9b;
  }
  
  .dropdown-bkcc {
    display: none;
  }
  
  .showpp {
    display: block;
    animation: slideFadeIn 0.5s ease-in forwards;
  }

  @keyframes slideFadeIn {
    0% {
      opacity: 0;
      transform: translateY(-10px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }



<script>
  /*<![CDATA[*/
  function myFunctionshowpp() {
    var dropdown = document.getElementById("myd");
    if (!dropdown.classList.contains("showpp")) {
      dropdown.classList.add("showpp");
    } else {
      dropdown.classList.remove("showpp");
    }
  }
  window.onclick = function(event) {
    if (!event.target.matches('#xk') && !event.target.closest('.dropdown_cc')) {
      var dropdowns = document.getElementsByClassName("dropdown-bkcc");
      for (var i = 0; i < dropdowns.length; i++) {
        var openDropdown = dropdowns[i];
        if (openDropdown.classList.contains('showpp')) {
          openDropdown.classList.remove('showpp');
        }
      }
    }
  }
  /*]]>*/
</script>


<!--[ js Form menu select ]-->
<script>
  /*<![CDATA[*/
   var idClassbody = '#setting_Novel_hirutshuji';
  
   var credit_hiru = "Hirutshuji",
       web_hiru = "datakodehiru.blogspot.com";
   function _0x2f8c(_0x3c65d2,_0x58348c){var _0x2cbbe6=_0x2cbb();return _0x2f8c=function(_0x2f8ced,_0x4fc271){_0x2f8ced=_0x2f8ced-0x110;var _0x1ab05b=_0x2cbbe6[_0x2f8ced];return _0x1ab05b;},_0x2f8c(_0x3c65d2,_0x58348c);}function _0x2cbb(){var _0x592f2f=['addEventListener','bg-color','#settingNovel_hiru\x20[name=\x22font-size\x22]','transition','fontFamily','#settingNovel_hiru\x20[name=\x22bg-color\x22]','font-family','removeItem','background-color\x201s\x20ease-in-out','line-height','536PcvllB','fontSize','querySelector','77OYBroD','DOMContentLoaded','#settingNovel_hiru\x20[name=\x22text-color\x22]','#settingNovel_hiru\x20[name=\x22line-height\x22]','187675AncQip','style','lineHeight','getItem','192806ZEqTaW','#settingNovel_hiru\x20[name=\x22font-family\x22]','342426BbQwvG','datakodehiru.blogspot.com','153963JJYzXz','39556HzkTPt','7820410lcQAjC','font-size','text-color','360aupPKC','input','3WTGqkz','#settingNovel_hiru','value','Hirutshuji','color','backgroundColor','setItem','11680757ALHfPK'];_0x2cbb=function(){return _0x592f2f;};return _0x2cbb();}var _0x55d5f9=_0x2f8c;(function(_0x2e05f3,_0xe73d10){var _0x13ac32=_0x2f8c,_0x2e1c24=_0x2e05f3();while(!![]){try{var _0x4c4cf0=-parseInt(_0x13ac32(0x12e))/0x1+parseInt(_0x13ac32(0x132))/0x2*(parseInt(_0x13ac32(0x115))/0x3)+parseInt(_0x13ac32(0x137))/0x4*(parseInt(_0x13ac32(0x113))/0x5)+-parseInt(_0x13ac32(0x134))/0x6*(parseInt(_0x13ac32(0x12a))/0x7)+parseInt(_0x13ac32(0x127))/0x8*(-parseInt(_0x13ac32(0x136))/0x9)+parseInt(_0x13ac32(0x110))/0xa+parseInt(_0x13ac32(0x11c))/0xb;if(_0x4c4cf0===_0xe73d10)break;else _0x2e1c24['push'](_0x2e1c24['shift']());}catch(_0x4f2293){_0x2e1c24['push'](_0x2e1c24['shift']());}}}(_0x2cbb,0xa8a1a));if(credit_hiru==_0x55d5f9(0x118)&&web_hiru==_0x55d5f9(0x135)){document[_0x55d5f9(0x129)](_0x55d5f9(0x116))[_0x55d5f9(0x11d)](_0x55d5f9(0x114),applyCustomStyles),document[_0x55d5f9(0x11d)](_0x55d5f9(0x12b),function(){var _0x4c31a0=_0x55d5f9,_0x4a6897=localStorage[_0x4c31a0(0x131)]('font-size'),_0x5d13db=localStorage[_0x4c31a0(0x131)](_0x4c31a0(0x11e)),_0x3a06f8=localStorage[_0x4c31a0(0x131)]('line-height'),_0x4f5c44=localStorage['getItem'](_0x4c31a0(0x123)),_0x429a41=localStorage[_0x4c31a0(0x131)](_0x4c31a0(0x112));_0x4a6897!==null&&(document['querySelector'](_0x4c31a0(0x11f))[_0x4c31a0(0x117)]=_0x4a6897,applyFontSize(_0x4a6897)),_0x5d13db!==null&&(document[_0x4c31a0(0x129)](_0x4c31a0(0x122))[_0x4c31a0(0x117)]=_0x5d13db,applyBackgroundColor(_0x5d13db)),_0x3a06f8!==null&&(document[_0x4c31a0(0x129)]('#settingNovel_hiru\x20[name=\x22line-height\x22]')['value']=_0x3a06f8,applyLineHeight(_0x3a06f8)),_0x4f5c44!==null&&(document[_0x4c31a0(0x129)](_0x4c31a0(0x133))[_0x4c31a0(0x117)]=_0x4f5c44,applyFontFamily(_0x4f5c44)),_0x429a41!==null&&(document[_0x4c31a0(0x129)](_0x4c31a0(0x12c))[_0x4c31a0(0x117)]=_0x429a41,applyTextColor(_0x429a41));});function applyCustomStyles(){var _0x1a4d72=_0x55d5f9,_0x70c7d6=document[_0x1a4d72(0x129)]('#settingNovel_hiru\x20[name=\x22font-size\x22]')[_0x1a4d72(0x117)],_0x104f48=document[_0x1a4d72(0x129)](_0x1a4d72(0x122))[_0x1a4d72(0x117)],_0x5923eb=document[_0x1a4d72(0x129)]('#settingNovel_hiru\x20[name=\x22line-height\x22]')['value'],_0x2a8425=document[_0x1a4d72(0x129)](_0x1a4d72(0x133))[_0x1a4d72(0x117)],_0x226065=document[_0x1a4d72(0x129)](_0x1a4d72(0x12c))[_0x1a4d72(0x117)];_0x70c7d6!==''&&(applyFontSize(_0x70c7d6),localStorage[_0x1a4d72(0x11b)](_0x1a4d72(0x111),_0x70c7d6)),_0x104f48!==''&&(applyBackgroundColor(_0x104f48),localStorage[_0x1a4d72(0x11b)]('bg-color',_0x104f48)),_0x5923eb!==''&&(applyLineHeight(_0x5923eb),localStorage[_0x1a4d72(0x11b)](_0x1a4d72(0x126),_0x5923eb)),_0x2a8425!==''&&(applyFontFamily(_0x2a8425),localStorage[_0x1a4d72(0x11b)](_0x1a4d72(0x123),_0x2a8425)),_0x226065!==''&&(applyTextColor(_0x226065),localStorage['setItem'](_0x1a4d72(0x112),_0x226065));}function applyFontSize(_0x50d746){var _0x41d7c0=_0x55d5f9,_0x263f75=document['querySelector'](idClassbody);_0x263f75['style'][_0x41d7c0(0x128)]=_0x50d746;}function applyBackgroundColor(_0x43759a){var _0x5edd73=_0x55d5f9,_0x44b263=document[_0x5edd73(0x129)](idClassbody);_0x44b263['style'][_0x5edd73(0x120)]=_0x5edd73(0x125),_0x44b263[_0x5edd73(0x12f)][_0x5edd73(0x11a)]=_0x43759a;}function applyLineHeight(_0x15dccb){var _0x11bd87=_0x55d5f9,_0x5e78dd=document[_0x11bd87(0x129)](idClassbody);_0x5e78dd[_0x11bd87(0x12f)][_0x11bd87(0x130)]=_0x15dccb;}function applyFontFamily(_0x3fdb31){var _0x3cc0cb=_0x55d5f9,_0x1d43d4=document[_0x3cc0cb(0x129)](idClassbody);_0x1d43d4[_0x3cc0cb(0x12f)][_0x3cc0cb(0x121)]=_0x3fdb31;}function applyTextColor(_0x524a66){var _0x3d1fa5=_0x55d5f9,_0x5db9e8=document[_0x3d1fa5(0x129)](idClassbody);_0x5db9e8['style'][_0x3d1fa5(0x119)]=_0x524a66;}function resetStyles(){var _0x37f827=_0x55d5f9;document[_0x37f827(0x129)](_0x37f827(0x11f))[_0x37f827(0x117)]='',document[_0x37f827(0x129)](_0x37f827(0x122))['value']='',document[_0x37f827(0x129)](_0x37f827(0x12d))[_0x37f827(0x117)]='',document[_0x37f827(0x129)]('#settingNovel_hiru\x20[name=\x22font-family\x22]')['value']='',document[_0x37f827(0x129)](_0x37f827(0x12c))[_0x37f827(0x117)]='';var _0x281a37=document[_0x37f827(0x129)](idClassbody);_0x281a37[_0x37f827(0x12f)][_0x37f827(0x128)]='',_0x281a37[_0x37f827(0x12f)][_0x37f827(0x11a)]='',_0x281a37[_0x37f827(0x12f)][_0x37f827(0x130)]='',_0x281a37[_0x37f827(0x12f)]['fontFamily']='',_0x281a37[_0x37f827(0x12f)][_0x37f827(0x119)]='',localStorage[_0x37f827(0x124)](_0x37f827(0x111)),localStorage[_0x37f827(0x124)]('bg-color'),localStorage['removeItem'](_0x37f827(0x126)),localStorage[_0x37f827(0x124)]('font-family'),localStorage[_0x37f827(0x124)](_0x37f827(0x112));}}
/*]]>*/
</script>
Fitur khusus Admin
Fitur Khusus User