Immersive Toon

immersivetoon.user.js

// ==UserScript==
// @name        ImmersiveToon
// @namespace   sn-immersive-toon
// @description Immersive Naver Webtoon
// @include     http://m.comic.naver.com/*
// @version     1.3.3
// @grant       none
// ==/UserScript==

document.addEventListener("DOMContentLoaded", () => {
  function insertGlobalStyle(styleSheet) {
    var style = document.createElement("style");
    style.textContent = styleSheet;
    document.head.appendChild(style);
  }

  if (!window.SmarttoonViewer) { // Outside
    insertGlobalStyle(`
body { min-height: auto !important; }
.bx_tab ul, ul.bx_tab { display:flex; }
.bx_tab li { flex: 1; }
.toon_view_lst { background: white !important; }
.toon_view_lst > ul { 
  display: flex; flex-direction: column; align-items: center;
}
.u_pg3 a {
  background-image:
    url("http://static.naver.net/m/comic/im/ib_l2.gif"),
    linear-gradient(to bottom, #f8f8f8 0%, #efefef 100%);
  background-repeat: no-repeat;
}
*:not([class$=flick-panel]) > .toon_lst { 
  -moz-column-width: 400px;
  column-width: 400px;
}
.toon_lst li .lst {
  display: flex;
}
.toon_lst li .lst a {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.u_ts {
  display: flex;
  justify-content: center;
}
header h1 a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
header h1 a span {
  display: flex;
}
.ico_adult, .ico_store2, .ico_smart, .aside_info [class^="ico_"], .ico_android, .ico_ios {
  vertical-align: baseline !important;
}
`);
  }
  else { // Inside
    insertGlobalStyle(`
.viewer_end_ly .viewer_end {
  flex-direction: column;
  display: flex;
}
.viewer_end_ly .viewer_inner {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
}
.viewer_da_ly .ly_box {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.product_lst {
  display: flex;
}
.product_lst a {
  box-sizing: border-box;
}
.product_lst li {
  flex: 1;
}
.product_lst .tit {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
}
`);
  }
});