AvocadoAmber/AvocadoEdition_Light/skin/menu/box_frame/css.config.php

<?php
if (!defined('_GNUBOARD_'))
  exit;

$box_f_size = get_style("box_frame_size");
$box_f_img = get_style("box_frame_img");
$box_f_line = get_style("box_frame_line");
$box_f_bak = get_style("box_frame_bak");

$header_inside = $box_f_size['cs_etc_10'] ? true : false;

$b_w = $box_f_size['cs_value'] ? $box_f_size['cs_value'] : 1000;
$b_h = $box_f_size['cs_etc_1'] ? $box_f_size['cs_etc_1'] : 20;

$p_t = $box_f_size['cs_etc_2'] ? $box_f_size['cs_etc_2'] : 20;
$p_b = $box_f_size['cs_etc_3'] ? $box_f_size['cs_etc_3'] : 20;
$p_l = $box_f_size['cs_etc_4'] ? $box_f_size['cs_etc_4'] : 20;
$p_r = $box_f_size['cs_etc_5'] ? $box_f_size['cs_etc_5'] : 20;

$mp_t = $box_f_size['cs_etc_6'] ? $box_f_size['cs_etc_6'] : 10;
$mp_b = $box_f_size['cs_etc_7'] ? $box_f_size['cs_etc_7'] : 10;
$mp_l = $box_f_size['cs_etc_8'] ? $box_f_size['cs_etc_8'] : 10;
$mp_r = $box_f_size['cs_etc_9'] ? $box_f_size['cs_etc_9'] : 10;

$f_img_url = $box_f_img['cs_value'];
$f_img_sli = $box_f_img['cs_etc_1'] != "" ? $box_f_img['cs_etc_1'] : 0;
$f_img_rep = $box_f_img['cs_etc_2'] != "" ? $box_f_img['cs_etc_2'] : "repeat";
$f_img_out = $box_f_img['cs_etc_3'] != "" ? $box_f_img['cs_etc_3'] : 0;

?>

<style>
  <?php
  /**************************************************
    Design Setting
    --------------------------------
    #design_frameBox:before 이미지 테두리 프레임
    #design_frameBox:after 일반 테두리 프레임
   **************************************************/
  ?> @media all and (min-width:1025px) {
    html.single #header {
      display: block !important;
    }
  }

  #design_frameBox {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 0;
    box-sizing: border-box;
  }

  #design_frameBox:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
  }

  #design_frameBox:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -2;
  }

  #body {
    display: block;
    position: relative;
    width: 100%;
    height: 100% !important;
    overflow: auto;
    box-sizing: border-box;
  }

  #body>.fix-layout>.mid-layout {
    padding: 10px !important;
  }

  <?php
  /**************************************************
     설정값에 따른 변동 부분
   **************************************************/
  ?> #design_frameBox {
    <?php echo "width:{$b_w}px; height:{$b_h}px; margin-left:-" . ($b_w / 2) . "px; margin-top:-" . ($b_h / 2) . "px; padding:{$p_t}px {$p_r}px {$p_b}px {$p_l}px;"; ?>
  }

  @media all and (max-width:<?= ($b_w + 20) ?>px) {
    #design_frameBox {
      left: 10px;
      right: 10px;
      width: auto;
      margin-left: 0;
    }
  }

  @media all and (max-height:<?= ($b_h + 20) ?>px) {
    #design_frameBox {
      top: 10px;
      bottom: 10px;
      height: auto;
      margin-top: 0;
    }
  }

  @media all and (max-width:1024px) {
    #design_frameBox {
      <?php echo "padding:{$mp_t}px {$mp_r}px {$mp_b}px {$mp_l}px;"; ?>
    }
  }

  <?php if ($f_img_url) { // 이미지 테두리가 적용되어 있을 경우 ?>
    #design_frameBox:before {
      <?php
      echo "border:{$f_img_sli}px solid;";
      echo "border-image:url({$f_img_url}) {$f_img_sli} / {$f_img_sli}px / {$f_img_out}px {$f_img_rep};";
      ?>
    }

    #design_frameBox:after {
      border: none !important;
    }

  <?php } ?>





  #design_frameBox:after {
    <?php
    if ($box_f_line['cs_value'])
      echo "border-color:" . hex2rgba($box_f_line['cs_value'], $box_f_line['cs_etc_1']) . "; ";
    $box_f_line['border'] = explode("||", $box_f_line['cs_etc_4']);
    for ($i = 0; $i < count($box_f_line['border']); $i++) {
      if ($box_f_line['border'][$i]) {
        if ($box_f_line['cs_etc_2'])
          echo "border-{$box_f_line['border'][$i]}-style:{$box_f_line['cs_etc_2']}; ";
        if ($box_f_line['cs_etc_3'])
          echo "border-{$box_f_line['border'][$i]}-width:{$box_f_line['cs_etc_3']}px; ";
      }
    }
    if ($box_f_line['cs_etc_5'])
      echo "border-top-left-radius:{$box_f_line['cs_etc_5']}px; ";
    if ($box_f_line['cs_etc_6'])
      echo "border-top-right-radius:{$box_f_line['cs_etc_6']}px; ";
    if ($box_f_line['cs_etc_7'])
      echo "border-bottom-right-radius:{$box_f_line['cs_etc_7']}px; ";
    if ($box_f_line['cs_etc_8'])
      echo "border-bottom-left-radius:{$box_f_line['cs_etc_8']}px; ";

    if ($box_f_bak['cs_value'])
      echo "background-image:url('{$box_f_bak['cs_value']}'); ";
    if ($box_f_bak['cs_etc_1'])
      echo "background-color:" . hex2rgba($box_f_bak['cs_etc_1'], $box_f_bak['cs_etc_2']) . "; ";
    if ($box_f_bak['cs_etc_3'])
      echo "background-repeat:{$box_f_bak['cs_etc_3']}; ";
    if ($box_f_bak['cs_etc_4'])
      echo "background-position:{$box_f_bak['cs_etc_4']}; ";
    if ($box_f_bak['cs_etc_5'])
      echo "background-size:{$box_f_bak['cs_etc_5']}; ";
    ?>}

#design_frameBox .characterViewer {position:relative; height:100%;}
#design_frameBox .characterViewer .ch-body {position:absolute; overflow:hidden;}
#design_frameBox .characterViewer .ch-body.pop {position:fixed !important; overflow:auto !important;}
#design_frameBox .characterViewer .ch-body ~ .ch-pannel {position:absolute;}


</style>
<script>$(function() {$("#body").wrap("<div id='design_frameBox'></div>");});</script>