로고 백터화

views/ringo/css/main.css

@@ -1,336 +1,336 @@
-html {
-    background: #eee;
-}
-
-body {
-    font-family: "나눔바른고딕", "나눔고딕", "맑은고딕", "Sans-Serif";
-    font-size: 14px;
-
-    margin: 0;
-}
-
-h1, h2, h3, h4, h5, h6 {
-    border-bottom: 1px solid gainsboro;
-    
-    padding-bottom: 10px;
-}
-
-h1.blank, h2.blank, h3.blank, h4.blank, h5.blank, h6.blank {
-    border-bottom: none;
-
-    padding-bottom: 0px;
-}
-
-header#main {
-    border-bottom: 0;
-    
-    line-height: 50px;
-    
-    padding-left: 20px;
-    padding-right: 20px;
-    
-    background-color: #99ddff;
-}
-
-header#main a {
-    color: black;
-}
-
-header#main span#right {
-    float: right;
-}
-
-header#main form.not_mobile input.search {
-    display: inline-block;
-    
-    width: 200px;
-}
-
-header#main form.not_mobile {
-    display: inline-block;
-}
-
-header a#logo {
-    height: 52px;
-
-    display: inline-block;
-
-    padding-left: 20px;
-    padding-right: 20px;
-
-    margin-left: -20px;
-}
-
-header a#logo:hover {
-    background-color: #95c3df;
-}
-
-.top_cel {
-    display: inline-block;
-}
-
-.top_cel a {
-    display: inline-block;
-    
-    height: 52px;
-    
-    padding-left: 10px;
-    padding-right: 10px;
-}
-
-.top_cel a:hover {
-    background-color: #95c3df;
-}
-
-.top_cel_in {
-    position: absolute;
-    
-    background: #efd8f7;
-    
-    line-height: initial;
-
-    z-index: 1;
-}
-
-.top_cel_in a {
-    padding: 10px;
-    
-    display: block;
-    
-    height: inherit;
-
-    padding-top: 10px;
-    padding-bottom: 10px;
-}
-
-.top_cel_in a:hover {
-    background-color: #e3baf1;
-}
-
-div#menu {
-    margin-top: 10px;
-
-    margin-left: 6px;
-}
-
-.menu_item_link {
-    border: 0;
-    background-color: white;
-    
-    padding: 10px;
-    
-    display: inline-block;
-
-    margin-left: -6px;
-}
-
-.menu_item_link:hover {
-    background-color: #eee;
-}
-
-input.search {
-    height: 35px;
-    
-    vertical-align: middle;
-    
-    border: 0;
-    
-    padding: 10px;
-}
-
-input.only_mobile.search {
-    width: calc(100% - 70px);
-    
-    display: inline-block;
-}
-
-input.search:focus-visible {
-    outline: none;
-}
-
-button.search_button {
-    width: 35px;
-    height: 35px;
-    
-    vertical-align: middle;
-    
-    margin-left: -6px;
-    
-    border: 0;
-    
-    font-size: 20px;
-    
-    line-height: 0px;
-
-    cursor: pointer;
-}
-
-button.search_button#goto {
-    background-color: #ccffbb;
-}
-
-button.search_button#goto:hover {
-    background-color: #99bf8c;
-}
-
-button.search_button#search {
-    background-color: #ffeecc;
-}
-
-button.search_button#search:hover {
-    background-color: #bcb097;
-}
-
-aside {
-    width: 250px;
-    
-    float: left;
-    
-    display: block;
-    
-    padding-top: 10px;
-    padding-left: 20px;
-    padding-right: 20px;
-    
-    background-color: #ffeaee;
-    
-    height: calc(100vh - (50px + 20px));
-}
-
-aside button {
-    width: 25%;
-}
-
-aside .side_button {
-    border: 0;
-    background-color: white;
-    
-    padding: 10px;
-}
-
-aside .side_button:hover {
-    background-color: #eee;
-
-    cursor: pointer;
-}
-
-#side_button_2 {
-    border-left: 0;
-    border-right: 0;
-}
-
-#side_button_3 {
-    border-right: 0;
-}
-
-#side_content {
-    margin-top: 20px;
-}
-
-section {
-    width: calc(100% - (250px + 40px));
-    
-    display: inline-block;
-    
-    border-left: 0px solid;
-    
-    background-color: white;
-}
-
-header#section {
-    padding-top: 11px;
-    padding-bottom: 11px;
-    
-    border-bottom: 0px solid;
-    
-    background-color: #cceeff;
-}
-
-article.main {
-    max-width: 1000px;
-    
-    padding-left: 20px;
-    padding-right: 20px;
-    
-    margin: auto;
-}
-
-article.main#main_data {
-    padding-top: 20px;
-    
-    min-height: 400px;
-}
-
-article.main#title h1 {
-    margin: 0;
-}
-
-.only_mobile, header#main form.only_mobile {
-    display: none;
-}
-
-@media screen and (max-width: 1000px) {    
-    aside {        
-        float: none;
-        
-        border-top: 0px solid;
-        
-        width: calc(100vw - 40px);
-        height: 100%;
-        
-        padding: 20px;
-    }
-    
-    section {
-        width: 100vw;
-        
-        padding-bottom: 20px;
-        
-        border-left: 0;
-    }
-    
-    .not_mobile, header#main form.not_mobile {
-        display: none;
-    }
-    
-    .only_mobile, header#main form.only_mobile {
-        display: block;
-    }
-
-    .top_cel_in {
-        left: 0;
-
-        width: 100%;
-    }
-}
-
-footer {
-    border-top: 0px solid;
-    
-    margin-top: 20px;
-    background: #eee;
-    
-    padding: 20px;
-}
-
-footer.only_mobile {
-    margin-top: 0px;
-}
-
-input, textarea, button, select {
-    border: 1px solid #aaa;
-    
-    padding: 10px;
-    
-    background-color: white;
-}
-
-#main_data button:hover {
-    background-color: #eee;
-
-    cursor: pointer;
-}
-
-#opennamu_save_button {
-    background: antiquewhite;
+html {
+    background: #eee;
+}
+
+body {
+    font-family: "나눔바른고딕", "나눔고딕", "맑은고딕", "Sans-Serif";
+    font-size: 14px;
+
+    margin: 0;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    border-bottom: 1px solid gainsboro;
+    
+    padding-bottom: 10px;
+}
+
+h1.blank, h2.blank, h3.blank, h4.blank, h5.blank, h6.blank {
+    border-bottom: none;
+
+    padding-bottom: 0px;
+}
+
+header#main {
+    border-bottom: 0;
+    
+    line-height: 50px;
+    
+    padding-left: 20px;
+    padding-right: 20px;
+    
+    background-color: #99ddff;
+}
+
+header#main a {
+    color: black;
+}
+
+header#main span#right {
+    float: right;
+}
+
+header#main form.not_mobile input.search {
+    display: inline-block;
+    
+    width: 200px;
+}
+
+header#main form.not_mobile {
+    display: inline-block;
+}
+
+header a#logo {
+    height: 52px;
+
+    display: inline-block;
+
+    padding-left: 20px;
+    padding-right: 20px;
+
+    margin-left: -20px;
+}
+
+header a#logo:hover {
+    background-color: #95c3df;
+}
+
+.top_cel {
+    display: inline-block;
+}
+
+.top_cel a {
+    display: inline-block;
+    
+    height: 52px;
+    
+    padding-left: 10px;
+    padding-right: 10px;
+}
+
+.top_cel a:hover {
+    background-color: #95c3df;
+}
+
+.top_cel_in {
+    position: absolute;
+    
+    background: #efd8f7;
+    
+    line-height: initial;
+
+    z-index: 1;
+}
+
+.top_cel_in a {
+    padding: 10px;
+    
+    display: block;
+    
+    height: inherit;
+
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+.top_cel_in a:hover {
+    background-color: #e3baf1;
+}
+
+div#menu {
+    margin-top: 10px;
+
+    margin-left: 6px;
+}
+
+.menu_item_link {
+    border: 0;
+    background-color: white;
+    
+    padding: 10px;
+    
+    display: inline-block;
+
+    margin-left: -6px;
+}
+
+.menu_item_link:hover {
+    background-color: #eee;
+}
+
+input.search {
+    height: 35px;
+    
+    vertical-align: middle;
+    
+    border: 0;
+    
+    padding: 10px;
+}
+
+input.only_mobile.search {
+    width: calc(100% - 70px);
+    
+    display: inline-block;
+}
+
+input.search:focus-visible {
+    outline: none;
+}
+
+button.search_button {
+    width: 35px;
+    height: 35px;
+    
+    vertical-align: middle;
+    
+    margin-left: -6px;
+    
+    border: 0;
+    
+    font-size: 20px;
+    
+    line-height: 0px;
+
+    cursor: pointer;
+}
+
+button.search_button#goto {
+    background-color: #ccffbb;
+}
+
+button.search_button#goto:hover {
+    background-color: #99bf8c;
+}
+
+button.search_button#search {
+    background-color: #ffeecc;
+}
+
+button.search_button#search:hover {
+    background-color: #bcb097;
+}
+
+aside {
+    width: 250px;
+    
+    float: left;
+    
+    display: block;
+    
+    padding-top: 10px;
+    padding-left: 20px;
+    padding-right: 20px;
+    
+    background-color: #ffeaee;
+    
+    height: calc(100vh - (50px + 20px));
+}
+
+aside button {
+    width: 25%;
+}
+
+aside .side_button {
+    border: 0;
+    background-color: white;
+    
+    padding: 10px;
+}
+
+aside .side_button:hover {
+    background-color: #eee;
+
+    cursor: pointer;
+}
+
+#side_button_2 {
+    border-left: 0;
+    border-right: 0;
+}
+
+#side_button_3 {
+    border-right: 0;
+}
+
+#side_content {
+    margin-top: 20px;
+}
+
+section {
+    width: calc(100% - (250px + 40px));
+    
+    display: inline-block;
+    
+    border-left: 0px solid;
+    
+    background-color: white;
+}
+
+header#section {
+    padding-top: 11px;
+    padding-bottom: 11px;
+    
+    border-bottom: 0px solid;
+    
+    background-color: #cceeff;
+}
+
+article.main {
+    max-width: 1000px;
+    
+    padding-left: 20px;
+    padding-right: 20px;
+    
+    margin: auto;
+}
+
+article.main#main_data {
+    padding-top: 20px;
+    
+    min-height: 400px;
+}
+
+article.main#title h1 {
+    margin: 0;
+}
+
+.only_mobile, header#main form.only_mobile {
+    display: none;
+}
+
+@media screen and (max-width: 1000px) {    
+    aside {        
+        float: none;
+        
+        border-top: 0px solid;
+        
+        width: calc(100vw - 40px);
+        height: 100%;
+        
+        padding: 20px;
+    }
+    
+    section {
+        width: 100vw;
+        
+        padding-bottom: 20px;
+        
+        border-left: 0;
+    }
+    
+    .not_mobile, header#main form.not_mobile {
+        display: none;
+    }
+    
+    .only_mobile, header#main form.only_mobile {
+        display: block;
+    }
+
+    .top_cel_in {
+        left: 0;
+
+        width: 100%;
+    }
+}
+
+footer {
+    border-top: 0px solid;
+    
+    margin-top: 20px;
+    background: #eee;
+    
+    padding: 20px;
+}
+
+footer.only_mobile {
+    margin-top: 0px;
+}
+
+input, textarea, button, select {
+    border: 1px solid #aaa;
+    
+    padding: 10px;
+    
+    background-color: white;
+}
+
+#main_data button:hover {
+    background-color: #eee;
+
+    cursor: pointer;
+}
+
+#opennamu_save_button {
+    background: antiquewhite;
 }

views/ringo/index.html

@@ -1,235 +1,235 @@
-<!DOCTYPE html>
-<html lang="{{'language_tag'|load_lang}}">
-    <head>
-        <meta charset="utf-8">
-        {% if imp[3][0] != 0 %}
-            <title>{{imp[0]}} {{imp[3][0]}} - {{imp[1][0]}}</title>
-        {% else %}
-            <title>{{imp[0]}} - {{imp[1][0]}}</title>
-        {% endif %}
-        {{imp[3][3]|safe}}
-        <script src="https://code.iconify.design/1/1.0.3/iconify.min.js"></script>
-        <script src="/views/ringo/js/main.js?ver=2"></script>
-        <link rel="stylesheet" href="/views/ringo/css/main.css?ver=2">
-        <link rel="shortcut icon" href="/views/main_css/file/favicon.ico?ver=1">
-        {{imp[1][5]|safe}}
-        {{imp[2][3]|safe}}
-        {% if imp[3][0] != 0 %}
-            <meta name="title" content="{{imp[0]}}{{imp[3][0]}} - {{imp[1][0]}}">
-        {% else %}
-            <meta name="title" content="{{imp[0]}} - {{imp[1][0]}}">
-        {% endif %}
-        <meta name="keywords" content="{{imp[0]}}">
-        {% if imp[2][12] != 0 and imp[2][12] == 'w' %}
-            <meta name="description" content="{{data|cut_100}}">
-        {% endif %}
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-    </head>
-    <body>
-        <header id="main">
-            <span id="left">
-                <a id="logo" href="/">{{imp[1][4]|safe}}</a>
-            </span>
-            <span id="right">
-                <div class="top_cel" id="recent_cel">
-                    <a href="javascript:ringo_opening('recent_cel_in');">
-                        <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
-                        <span class="not_mobile">{{'list'|load_lang}}</span>
-                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                    </a>
-                    <div class="top_cel_in" id="recent_cel_in" style="display: none;">
-                        <a href="/recent_changes">
-                            <span class="iconify" data-icon="ic:baseline-autorenew" data-inline="true"></span>
-                            {{'recent_change'|load_lang}}
-                        </a>
-                        <a href="/recent_discuss">
-                            <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
-                            {{'recent_discussion'|load_lang}}
-                        </a>
-                        <a href="/vote">
-                            <span class="iconify" data-icon="ic:baseline-how-to-vote" data-inline="true"></span>
-                            {{'vote_list'|load_lang}}
-                        </a>
-                    </div>
-                </div>
-                <div class="top_cel" id="other_cel">
-                    <a href="javascript:ringo_opening('other_cel_in');">
-                        <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
-                        <span class="not_mobile">{{'tool'|load_lang}}</span>
-                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                    </a>
-                    <div class="top_cel_in" id="other_cel_in" style="display: none;">
-                        <a href="/random">
-                            <span class="iconify" data-icon="ic:baseline-shuffle" data-inline="true"></span>
-                            {{'random'|load_lang}}
-                        </a>
-                        <a href="/other">
-                            <span class="iconify" data-icon="ic:baseline-build" data-inline="true"></span>
-                            {{'other_tool'|load_lang}}
-                        </a>
-                        {% if imp[2][9] != '0' %}
-                            <a href="/manager">
-                                <span class="iconify" data-icon="ic:baseline-how-to-reg" data-inline="true"></span>
-                                {{'admin_tool'|load_lang}}
-                            </a>
-                        {% endif %}
-                        <a href="/upload">
-                            <span class="iconify" data-icon="ic:baseline-cloud-upload" data-inline="true"></span>
-                            {{'upload'|load_lang}}
-                        </a>
-                        <a href="/change/skin_set">
-                            <span class="iconify" data-icon="ic:baseline-settings" data-inline="true"></span>
-                            {{'skin_setting'|load_lang}}
-                        </a>
-                    </div>
-                </div>
-                <div class="top_cel" id="user_cel">
-                    <a href="javascript:ringo_opening('user_cel_in');">
-                        {% if imp[2][2] == 1 %}
-                            {% if imp[2][8] != '0' %}
-                                <span class="iconify" data-icon="ic:baseline-add-alert" data-inline="true"></span>
-                            {% else %}
-                                <span class="iconify" data-icon="ic:baseline-person-add" data-inline="true"></span>
-                            {% endif %}
-                        {% else %}
-                            <span class="iconify" data-icon="ic:round-person-search" data-inline="true"></span>
-                        {% endif %}
-                        <span class="not_mobile">{{imp[2][5]}}</span>
-                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                    </a>
-                    <div class="top_cel_in" id="user_cel_in" style="display: none;">
-                        <a href="/user">
-                            <span class="iconify" data-icon="ic:baseline-account-box" data-inline="true"></span>
-                            {{'user_tool'|load_lang}}
-                        </a>
-                        <a href="/change">
-                            <span class="iconify" data-icon="ic:baseline-manage-accounts" data-inline="true"></span>
-                            {{'user_setting'|load_lang}}
-                        </a>
-                        {% if imp[2][2] == 1 %}
-                            <a href="/alarm">
-                                <span class="iconify" data-icon="ic:baseline-contact-mail" data-inline="true"></span>
-                                {{'alarm'|load_lang}} ({{imp[2][8]}})
-                            </a>
-                            <a href="/watch_list">
-                                <span class="iconify" data-icon="ic:round-preview" data-inline="true"></span>
-                                {{'watchlist'|load_lang}}
-                            </a>
-                            <a href="/star_doc">
-                                <span class="iconify" data-icon="ic:twotone-stars" data-inline="true"></span>
-                                {{'star_doc'|load_lang}}
-                            </a>
-                            <a href="/logout">
-                                <span class="iconify" data-icon="ic:baseline-logout" data-inline="true"></span>
-                                {{'logout'|load_lang}}
-                            </a>
-                        {% else %}
-                            <a href="/login">
-                                <span class="iconify" data-icon="ic:baseline-login" data-inline="true"></span>
-                                {{'login'|load_lang}}
-                            </a>
-                            <a href="/register">
-                                <span class="iconify" data-icon="ic:baseline-person-add-alt-1" data-inline="true"></span>
-                                {{'register'|load_lang}}
-                            </a>
-                        {% endif %}
-                    </div>
-                </div>
-                {% if imp[1][6] != '' %}
-                    <div class="top_cel" id="add_cel">
-                        <a href="javascript:ringo_opening('add_cel_in');">
-                            <span class="iconify" data-icon="ic:baseline-playlist-add" data-inline="true"></span>
-                            <span class="not_mobile">{{'added_menu'|load_lang}}</span>
-                            <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                        </a>
-                        <div class="top_cel_in" id="add_cel_in" style="display: none;">
-                            {% for added_top_menu in imp[1][6] %}
-                                <a href="{{added_top_menu[1]}}">
-                                    <span class="iconify" data-icon="ic:baseline-plus" data-inline="true"></span>
-                                    {{added_top_menu[0]}}
-                                </a>
-                            {% endfor %}
-                        </div>
-                    </div>
-                {% endif %}
-                <form class="not_mobile" method="post" action="/search" role="search" id="search">
-                    <input class="not_mobile search" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
-                    <button type="submit" id="goto" formaction="/goto" class="search_button">
-                        <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
-                    </button>
-                    <button type="submit" id="search" formaction="/search" class="search_button">
-                        <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
-                    </button>
-                </form>
-            </span>
-            <form class="only_mobile" method="post" action="/search" role="search">
-                <input class="only_mobile search" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
-                <button type="submit" id="goto" formaction="/goto" class="search_button">
-                    <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
-                </button>
-                <button type="submit" id="search" formaction="/search" class="search_button">
-                    <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
-                </button>
-            </form>
-        </header>
-        <section>
-            <header id="section">
-                <article class="main" id="title">
-                    <h1 class="blank">
-                        <span class="change_space">{{imp[0]}}</span>
-                        {% if imp[3][0] != 0 %}
-                            <sub>{{imp[3][0]}}</sub>
-                        {% endif %}
-                    </h1>
-                    {% if menu != 0 %}
-                        <div id="menu">
-                            {% for menu_data in menu %}
-                                {% if menu[0] == 1 %}
-                                    {% set menu_data_2 = menu_data[0] %}
-                                {% else %}
-                                    {% set menu_data_2 = '/' + menu_data[0] %}
-                                {% endif %}
-                                
-                                {% if menu_data|length > 2 and menu_data[2] == 1 %}
-                                    {% set menu_topic = 'topic_color' %}
-                                {% else %}
-                                    {% set menu_topic = '' %}
-                                {% endif %}
-                                
-                                <a class="menu_item_link" href="{{menu_data_2}}" id="{{menu_topic}}">
-                                    {{menu_data[1]}}
-                                </a>
-                            {% endfor %}
-                        </div>
-                    {% endif %}
-                </article>
-            </header>
-            <article class="main" id="main_data">
-                {{data|safe}}
-            </article>
-            <footer class="not_mobile">
-                <article class="main" id="footer">
-                    {{imp[1][1]|safe}}
-                    <br>
-                    <br>
-                    <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/s_logo.png"></a>
-                </article>
-            </footer>
-        </section>
-        <aside>
-            <button id="side_button_1" class="side_button selected">변경</button><!--
-         --><button id="side_button_2" class="side_button">토론</button><!--
-         --><button id="side_button_3" class="side_button">목차</button><!--
-         --><button id="side_button_4" class="side_button">각주</button>
-            <div id="side_content">
-                Loading...
-            </div>
-        </aside>
-        <footer class="only_mobile">
-            {{imp[1][1]|safe}}
-            <br>
-            <br>
-            <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/s_logo.png"></a>
-        </footer>
-    </body>
+<!DOCTYPE html>
+<html lang="{{'language_tag'|load_lang}}">
+    <head>
+        <meta charset="utf-8">
+        {% if imp[3][0] != 0 %}
+            <title>{{imp[0]}} {{imp[3][0]}} - {{imp[1][0]}}</title>
+        {% else %}
+            <title>{{imp[0]}} - {{imp[1][0]}}</title>
+        {% endif %}
+        {{imp[3][3]|safe}}
+        <script src="https://code.iconify.design/1/1.0.3/iconify.min.js"></script>
+        <script src="/views/ringo/js/main.js?ver=2"></script>
+        <link rel="stylesheet" href="/views/ringo/css/main.css?ver=2">
+        <link rel="shortcut icon" href="/views/main_css/file/favicon.ico?ver=1">
+        {{imp[1][5]|safe}}
+        {{imp[2][3]|safe}}
+        {% if imp[3][0] != 0 %}
+            <meta name="title" content="{{imp[0]}}{{imp[3][0]}} - {{imp[1][0]}}">
+        {% else %}
+            <meta name="title" content="{{imp[0]}} - {{imp[1][0]}}">
+        {% endif %}
+        <meta name="keywords" content="{{imp[0]}}">
+        {% if imp[2][12] != 0 and imp[2][12] == 'w' %}
+            <meta name="description" content="{{data|cut_100}}">
+        {% endif %}
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+    </head>
+    <body>
+        <header id="main">
+            <span id="left">
+                <a id="logo" href="/">{{imp[1][4]|safe}}</a>
+            </span>
+            <span id="right">
+                <div class="top_cel" id="recent_cel">
+                    <a href="javascript:ringo_opening('recent_cel_in');">
+                        <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
+                        <span class="not_mobile">{{'list'|load_lang}}</span>
+                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                    </a>
+                    <div class="top_cel_in" id="recent_cel_in" style="display: none;">
+                        <a href="/recent_changes">
+                            <span class="iconify" data-icon="ic:baseline-autorenew" data-inline="true"></span>
+                            {{'recent_change'|load_lang}}
+                        </a>
+                        <a href="/recent_discuss">
+                            <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
+                            {{'recent_discussion'|load_lang}}
+                        </a>
+                        <a href="/vote">
+                            <span class="iconify" data-icon="ic:baseline-how-to-vote" data-inline="true"></span>
+                            {{'vote_list'|load_lang}}
+                        </a>
+                    </div>
+                </div>
+                <div class="top_cel" id="other_cel">
+                    <a href="javascript:ringo_opening('other_cel_in');">
+                        <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
+                        <span class="not_mobile">{{'tool'|load_lang}}</span>
+                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                    </a>
+                    <div class="top_cel_in" id="other_cel_in" style="display: none;">
+                        <a href="/random">
+                            <span class="iconify" data-icon="ic:baseline-shuffle" data-inline="true"></span>
+                            {{'random'|load_lang}}
+                        </a>
+                        <a href="/other">
+                            <span class="iconify" data-icon="ic:baseline-build" data-inline="true"></span>
+                            {{'other_tool'|load_lang}}
+                        </a>
+                        {% if imp[2][9] != '0' %}
+                            <a href="/manager">
+                                <span class="iconify" data-icon="ic:baseline-how-to-reg" data-inline="true"></span>
+                                {{'admin_tool'|load_lang}}
+                            </a>
+                        {% endif %}
+                        <a href="/upload">
+                            <span class="iconify" data-icon="ic:baseline-cloud-upload" data-inline="true"></span>
+                            {{'upload'|load_lang}}
+                        </a>
+                        <a href="/change/skin_set">
+                            <span class="iconify" data-icon="ic:baseline-settings" data-inline="true"></span>
+                            {{'skin_setting'|load_lang}}
+                        </a>
+                    </div>
+                </div>
+                <div class="top_cel" id="user_cel">
+                    <a href="javascript:ringo_opening('user_cel_in');">
+                        {% if imp[2][2] == 1 %}
+                            {% if imp[2][8] != '0' %}
+                                <span class="iconify" data-icon="ic:baseline-add-alert" data-inline="true"></span>
+                            {% else %}
+                                <span class="iconify" data-icon="ic:baseline-person-add" data-inline="true"></span>
+                            {% endif %}
+                        {% else %}
+                            <span class="iconify" data-icon="ic:round-person-search" data-inline="true"></span>
+                        {% endif %}
+                        <span class="not_mobile">{{imp[2][5]}}</span>
+                        <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                    </a>
+                    <div class="top_cel_in" id="user_cel_in" style="display: none;">
+                        <a href="/user">
+                            <span class="iconify" data-icon="ic:baseline-account-box" data-inline="true"></span>
+                            {{'user_tool'|load_lang}}
+                        </a>
+                        <a href="/change">
+                            <span class="iconify" data-icon="ic:baseline-manage-accounts" data-inline="true"></span>
+                            {{'user_setting'|load_lang}}
+                        </a>
+                        {% if imp[2][2] == 1 %}
+                            <a href="/alarm">
+                                <span class="iconify" data-icon="ic:baseline-contact-mail" data-inline="true"></span>
+                                {{'alarm'|load_lang}} ({{imp[2][8]}})
+                            </a>
+                            <a href="/watch_list">
+                                <span class="iconify" data-icon="ic:round-preview" data-inline="true"></span>
+                                {{'watchlist'|load_lang}}
+                            </a>
+                            <a href="/star_doc">
+                                <span class="iconify" data-icon="ic:twotone-stars" data-inline="true"></span>
+                                {{'star_doc'|load_lang}}
+                            </a>
+                            <a href="/logout">
+                                <span class="iconify" data-icon="ic:baseline-logout" data-inline="true"></span>
+                                {{'logout'|load_lang}}
+                            </a>
+                        {% else %}
+                            <a href="/login">
+                                <span class="iconify" data-icon="ic:baseline-login" data-inline="true"></span>
+                                {{'login'|load_lang}}
+                            </a>
+                            <a href="/register">
+                                <span class="iconify" data-icon="ic:baseline-person-add-alt-1" data-inline="true"></span>
+                                {{'register'|load_lang}}
+                            </a>
+                        {% endif %}
+                    </div>
+                </div>
+                {% if imp[1][6] != '' %}
+                    <div class="top_cel" id="add_cel">
+                        <a href="javascript:ringo_opening('add_cel_in');">
+                            <span class="iconify" data-icon="ic:baseline-playlist-add" data-inline="true"></span>
+                            <span class="not_mobile">{{'added_menu'|load_lang}}</span>
+                            <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                        </a>
+                        <div class="top_cel_in" id="add_cel_in" style="display: none;">
+                            {% for added_top_menu in imp[1][6] %}
+                                <a href="{{added_top_menu[1]}}">
+                                    <span class="iconify" data-icon="ic:baseline-plus" data-inline="true"></span>
+                                    {{added_top_menu[0]}}
+                                </a>
+                            {% endfor %}
+                        </div>
+                    </div>
+                {% endif %}
+                <form class="not_mobile" method="post" action="/search" role="search" id="search">
+                    <input class="not_mobile search" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
+                    <button type="submit" id="goto" formaction="/goto" class="search_button">
+                        <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
+                    </button>
+                    <button type="submit" id="search" formaction="/search" class="search_button">
+                        <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
+                    </button>
+                </form>
+            </span>
+            <form class="only_mobile" method="post" action="/search" role="search">
+                <input class="only_mobile search" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
+                <button type="submit" id="goto" formaction="/goto" class="search_button">
+                    <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
+                </button>
+                <button type="submit" id="search" formaction="/search" class="search_button">
+                    <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
+                </button>
+            </form>
+        </header>
+        <section>
+            <header id="section">
+                <article class="main" id="title">
+                    <h1 class="blank">
+                        <span class="change_space">{{imp[0]}}</span>
+                        {% if imp[3][0] != 0 %}
+                            <sub>{{imp[3][0]}}</sub>
+                        {% endif %}
+                    </h1>
+                    {% if menu != 0 %}
+                        <div id="menu">
+                            {% for menu_data in menu %}
+                                {% if menu[0] == 1 %}
+                                    {% set menu_data_2 = menu_data[0] %}
+                                {% else %}
+                                    {% set menu_data_2 = '/' + menu_data[0] %}
+                                {% endif %}
+                                
+                                {% if menu_data|length > 2 and menu_data[2] == 1 %}
+                                    {% set menu_topic = 'topic_color' %}
+                                {% else %}
+                                    {% set menu_topic = '' %}
+                                {% endif %}
+                                
+                                <a class="menu_item_link" href="{{menu_data_2}}" id="{{menu_topic}}">
+                                    {{menu_data[1]}}
+                                </a>
+                            {% endfor %}
+                        </div>
+                    {% endif %}
+                </article>
+            </header>
+            <article class="main" id="main_data">
+                {{data|safe}}
+            </article>
+            <footer class="not_mobile">
+                <article class="main" id="footer">
+                    {{imp[1][1]|safe}}
+                    <br>
+                    <br>
+                    <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/s_logo.png"></a>
+                </article>
+            </footer>
+        </section>
+        <aside>
+            <button id="side_button_1" class="side_button selected">변경</button><!--
+         --><button id="side_button_2" class="side_button">토론</button><!--
+         --><button id="side_button_3" class="side_button">목차</button><!--
+         --><button id="side_button_4" class="side_button">각주</button>
+            <div id="side_content">
+                Loading...
+            </div>
+        </aside>
+        <footer class="only_mobile">
+            {{imp[1][1]|safe}}
+            <br>
+            <br>
+            <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/logo.svg"></a>
+        </footer>
+    </body>
 </html>

views/ringo/info.json

@@ -1,5 +1,5 @@
-{
-    "name" : "Ringo",
-    "skin_ver" : "v0.1.2",
-    "require_ver" : "3500110"
+{
+    "name" : "Ringo",
+    "skin_ver" : "v0.1.2",
+    "require_ver" : "3500110"
 }

views/ringo/js/main.js

@@ -1,50 +1,50 @@
-let ringo_save_data = '';
-let ringo_open = 0;
-let ringo_menu_list = [
-    'recent_cel',
-    'other_cel',
-    'user_cel',
-    'add_cel'
-];
-
-function ringo_opening(data) {
-    let element = [data];
-    
-    for(for_a in ringo_menu_list) {
-        if(ringo_menu_list[for_a] + '_in' !== data) {
-            element.push(ringo_menu_list[for_a] + '_in');
-        }
-    }
-
-    if((document.getElementById(element[0]).style.display == 'none' && ringo_open == 0) || ringo_save_data !== data) {
-        document.getElementById(element[0]).style.display = 'block';
-
-        for(for_a in element) {
-            if(for_a !== '0') { 
-                document.getElementById(element[for_a]).style.display = 'none';
-            }
-        }
-
-        ringo_open = 1;
-        ringo_save_data = data;
-
-        setTimeout(function() { ringo_open = 2; }, 100);
-    } else {
-        document.getElementById(element[0]).style.display = 'none';
-
-        ringo_open = 0
-    }
-}
-
-document.onclick = function(event) {
-    let cel_list = [];
-    for(for_a in ringo_menu_list) {
-        cel_list.push(document.getElementById(ringo_menu_list[for_a]));
-    }
-
-    if(ringo_save_data !== '' && ringo_open == 2) {
-        document.getElementById(ringo_save_data).style.display = 'none';
-
-        setTimeout(function() { ringo_open = 0; }, 100);
-    }
+let ringo_save_data = '';
+let ringo_open = 0;
+let ringo_menu_list = [
+    'recent_cel',
+    'other_cel',
+    'user_cel',
+    'add_cel'
+];
+
+function ringo_opening(data) {
+    let element = [data];
+    
+    for(for_a in ringo_menu_list) {
+        if(ringo_menu_list[for_a] + '_in' !== data) {
+            element.push(ringo_menu_list[for_a] + '_in');
+        }
+    }
+
+    if((document.getElementById(element[0]).style.display == 'none' && ringo_open == 0) || ringo_save_data !== data) {
+        document.getElementById(element[0]).style.display = 'block';
+
+        for(for_a in element) {
+            if(for_a !== '0') { 
+                document.getElementById(element[for_a]).style.display = 'none';
+            }
+        }
+
+        ringo_open = 1;
+        ringo_save_data = data;
+
+        setTimeout(function() { ringo_open = 2; }, 100);
+    } else {
+        document.getElementById(element[0]).style.display = 'none';
+
+        ringo_open = 0
+    }
+}
+
+document.onclick = function(event) {
+    let cel_list = [];
+    for(for_a in ringo_menu_list) {
+        cel_list.push(document.getElementById(ringo_menu_list[for_a]));
+    }
+
+    if(ringo_save_data !== '' && ringo_open == 2) {
+        document.getElementById(ringo_save_data).style.display = 'none';
+
+        setTimeout(function() { ringo_open = 0; }, 100);
+    }
 }

views/tenshi/css/dark.css

@@ -1,49 +1,49 @@
-html, #main {
-    background: black;
-    color: white;
-}
-
-#top {
-    background: black;
-}
-
-.cel_in_cel, #background, div#pre_search, #toc, #cate, #redirect {
-    background: #1f2023;
-    border-color: #1f2023;
-}
-
-#bottom {
-    background: black;
-    color: white;
-}
-
-#top .cel_in_cel a {
-    color: white;
-}
-
-#mobile_search_input, #mobile_search_input::placeholder {
-    background: gray;
-    color: white;
-}
-
-#titlt_a {
-    color: white;
-}
-
-#search_input, textarea, input, button, select, #toc, #cate, #redirect { 
-    border-color: #1f2023; 
-    background: #1f2023;
-    color: white;
-}
-
-#search_input:hover, #search_input:focus {
-    color: white;
-}
-
-#search_input::placeholder {
-    color: white;
-}
-
-button#opennamu_save_button {
-    background: #083808;
+html, #main {
+    background: black;
+    color: white;
+}
+
+#top {
+    background: black;
+}
+
+.cel_in_cel, #background, div#pre_search, #toc, #cate, #redirect {
+    background: #1f2023;
+    border-color: #1f2023;
+}
+
+#bottom {
+    background: black;
+    color: white;
+}
+
+#top .cel_in_cel a {
+    color: white;
+}
+
+#mobile_search_input, #mobile_search_input::placeholder {
+    background: gray;
+    color: white;
+}
+
+#titlt_a {
+    color: white;
+}
+
+#search_input, textarea, input, button, select, #toc, #cate, #redirect { 
+    border-color: #1f2023; 
+    background: #1f2023;
+    color: white;
+}
+
+#search_input:hover, #search_input:focus {
+    color: white;
+}
+
+#search_input::placeholder {
+    color: white;
+}
+
+button#opennamu_save_button {
+    background: #083808;
 }

views/tenshi/css/main.css

@@ -1,469 +1,469 @@
-body, textarea, input, pre, code {
-    font-family: 'Apple SD Gothic', '맑은고딕', 'Nanum Gothic', 'Noto Sans KR', sans-serif;
-}
-
-body {
-    max-width: 100%;
-    
-    word-break: break-all;
-    word-wrap: break-word;
-    
-    margin: 0;
-    
-    font-size: 14px;
-}
-
-select {
-    padding: 5px;
-}
-
-html {
-    background: #eeeeee;
-}
-
-#background {
-    background: #eeeeee;
-}
-
-#main {
-    margin: auto;
-    margin-top: -20px;
-    
-    padding: 20px;
-    padding-bottom: 20px;
-    
-    min-height: 350px;
-    
-    background: white;
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-#bottom {
-    width: 100%;
-    
-    background: #eeeeee;
-    
-    margin-top: 10px;
-    padding-bottom: 20px;
-}
-
-#bottom_main {
-    margin: auto;
-    
-    padding-top: 20px;
-}
-
-#tool {
-    float: right;
-    
-    border: none;
-}
-
-@media (min-width: 780px) and (max-width: 1180px) {
-    #main {
-        width: calc(100% - 45px);
-    }
-
-    #top_main, #bottom_main {
-        width: 90%;
-    }
-
-    .is_mobile {
-        display: none;
-    }
-}
-
-
-@media (min-width: 1180px) and (max-width: 2000px) {
-    #main, #top_main, #bottom_main {
-        width: 1000px;
-    }
-    
-    .is_mobile {
-        display: none;
-    }
-}
-
-@media (min-width: 2000px) {
-    #main, #top_main, #bottom_main {
-        width: 55%;
-    }
-
-    .is_mobile {
-        display: none;
-    }
-}
-
-@media (max-width: 780px) {
-    #main {
-        width: 90%;
-        
-        border-left: none;
-        border-right: none;
-    }
-
-    #top_main, #bottom_main {
-        width: 90%;
-    }
-
-    .not_mobile {
-        display: none;
-    }
-
-    #tool {
-        float: none;
-        
-        width: 90%;
-        
-        margin-top: 0px;
-        margin-bottom: 10px;
-    }
-}
-
-h1, h2, h3, h4, h5, h6 {
-    border-bottom: 1px solid gainsboro;
-    
-    padding-bottom: 10px;
-}
-
-#main_top {
-    width: 100%;
-}
-
-/* top */
-#top {
-    width: 100%;
-    line-height: 50px;
-    
-    position: relative;
-    top: 0;
-    left: 0;
-
-    background: #2780e3;
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-#top_main {
-    margin: auto;
-}
-
-#top_tool {
-    float: right;
-    color: white;
-}
-
-#top_tool_group {
-    display: inline-block;
-    
-    margin-right: 10px;
-}
-
-#top_tool_cel {
-    display: inline-block;
-    
-    margin-right: -12px;
-}
-
-.top_in_cel {
-    padding-left: 10px;
-    padding-right: 10px;
-    
-    transition: .2s ease-in-out;
-}
-
-.top_in_cel:hover {
-    background: #022988;
-    
-    transition: .2s ease-in-out;
-}
-
-#top_in_user {
-    margin-right: -13px;
-}
-
-#tool_cel {
-    display: inline-block;
-}
-
-#top a {
-    color: white;
-    
-    display: block;
-}
-
-#logo {
-    display: inline-block;
-}
-
-#logo a {
-    padding-left: 20px;
-    padding-right: 20px;
-}
-
-.cel_in_cel {
-    padding: 10px;
-    
-    line-height: initial;
-    
-    position: absolute;
-    
-    background: white;
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-#top .cel_in_cel a {
-    color: black;
-    
-    padding-left: 0;
-    padding-right: 0;
-}
-
-/* search */
-#search {
-    display: inline-block;
-    width: 300px;
-}
-
-#search_input {
-    width: 220px;
-    height: 35px;
-    
-    padding-left: 10px;
-    
-    background-color: white;
-    border: solid 2px #2780e3;
-    color: black;
-    box-shadow: none;
-    
-    transition: .2s ease-in-out;
-}
-
-#search_input::placeholder {
-    color: black;
-}
-
-#search_input:hover, #search_input:focus {
-    border: solid 2px #f4aba1;
-    
-    transition: .2s ease-in-out;
-}
-
-#pre_search {
-    padding: 10px;
-    border: 1px solid #4a4a4a;
-    width: 200px;
-    color: black;
-    margin-top: 5px;
-    background: white;
-    position: absolute;
-}
-
-#pre_search a {
-    color: dodgerblue;
-}
-
-#search button {
-    padding: 0;
-    
-    border: none;
-    
-    background: transparent;
-    box-shadow: none;
-    
-    color: white;
-}
-
-/* content */
-a {
-    color: dodgerblue;
-}
-
-#toc {
-    max-width: 300px;
-}
-
-/*
-pre, #toc, #cate, #redirect {
-    border: 1px solid #aaa;
-}
-*/
-
-#redirect, #cate, #toc, blockquote, button#opennamu_save_button, button#opennamu_preview_button {
-    border: 0;
-    
-    padding: 10px;
-    
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-button#opennamu_save_button {
-    background: #92f7f4;
-}
-
-button#opennamu_preview_button {
-    margin-left: 5px;
-}
-
-#cate {
-    background: #ccf5bc;
-}
-
-#redirect {
-    background: #d9edf7;
-}
-
-#toc {
-    background: lightyellow;
-    padding: 20px;
-}
-
-textarea, input, pre {    
-    border: 0;
-    
-    padding: 5px;
-    
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-pre {
-    padding: 10px;
-}
-
-#syntax {
-    background: #f0f0f0;
-    padding: 5px;
-}
-
-#syntax code {
-    background: transparent;
-}
-
-table {
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-}
-
-button {
-    border: 0;
-    
-    padding: 10px;
-    
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-    background: papayawhip;
-    
-    cursor: pointer;
-}
-
-input[type="checkbox"], input[type="radio"] {
-    box-shadow: None;
-    background: transparent;
-}
-
-select {
-    padding: 0;
-    padding-left: 5px;
-    padding-right: 5px;
-    
-    background: white;
-    border: 0;
-    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
-    
-    min-height: 30px;
-}
-
-/* nav_bar */
-#nav_bar {
-    z-index: 100;
-    
-    font-size: 25px;
-    
-    position: fixed;
-    bottom: 0;
-    right: 0;
-    
-    background: #fa635c;
-    box-shadow: -1px -1px 4px 0 rgba(0,0,0,0.16), -1px -1px 10px 0 rgba(0,0,0,0.12);
-    
-    text-align: center;
-}
-
-#go_toc {
-    display: inline-block;
-
-    padding-right: 10px;
-    padding-left: 10px;
-    padding-top: 5px;
-    padding-bottom: 5px;
-    
-    width: 25px;
-}
-
-#go_top {
-    display: inline-block;
-    
-    padding-right: 10px;
-    padding-left: 10px;
-    
-    width: 25px;
-}
-
-#go_bottom {
-    display: inline-block;
-
-    padding-right: 10px;
-    padding-left: 10px;
-    
-    width: 25px;
-}
-
-#nav_bar a {
-    color: white;
-}
-
-/* content */
-a:hover {
-    text-decoration: underline;
-}
-
-#top a:hover {
-    text-decoration: none;
-}
-
-h1#title {
-    margin-bottom: 10px;
-}
-
-div#last_edit {
-    margin-bottom: 20px;
-}
-
-@media (max-width: 600px) {
-    #top_tool {
-        float: none;
-        display: inline;
-    }
-
-    #top_tool_group {
-        margin-left: 20px;
-    }
-
-    #search {
-        width: 100%;
-    }
-
-    #search_input {
-        width: calc(100% - 60px);
-    }
-}
-
-#titlt_a {
-    color: initial;
-}
-
-blockquote {
-    background-color: #ffefff;
-
-    padding: 15px 40px 15px 15px;
-    border-left: 4px solid #ffb3ff;
-    
-    margin-bottom: 20px;
+body, textarea, input, pre, code {
+    font-family: 'Apple SD Gothic', '맑은고딕', 'Nanum Gothic', 'Noto Sans KR', sans-serif;
+}
+
+body {
+    max-width: 100%;
+    
+    word-break: break-all;
+    word-wrap: break-word;
+    
+    margin: 0;
+    
+    font-size: 14px;
+}
+
+select {
+    padding: 5px;
+}
+
+html {
+    background: #eeeeee;
+}
+
+#background {
+    background: #eeeeee;
+}
+
+#main {
+    margin: auto;
+    margin-top: -20px;
+    
+    padding: 20px;
+    padding-bottom: 20px;
+    
+    min-height: 350px;
+    
+    background: white;
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+#bottom {
+    width: 100%;
+    
+    background: #eeeeee;
+    
+    margin-top: 10px;
+    padding-bottom: 20px;
+}
+
+#bottom_main {
+    margin: auto;
+    
+    padding-top: 20px;
+}
+
+#tool {
+    float: right;
+    
+    border: none;
+}
+
+@media (min-width: 780px) and (max-width: 1180px) {
+    #main {
+        width: calc(100% - 45px);
+    }
+
+    #top_main, #bottom_main {
+        width: 90%;
+    }
+
+    .is_mobile {
+        display: none;
+    }
+}
+
+
+@media (min-width: 1180px) and (max-width: 2000px) {
+    #main, #top_main, #bottom_main {
+        width: 1000px;
+    }
+    
+    .is_mobile {
+        display: none;
+    }
+}
+
+@media (min-width: 2000px) {
+    #main, #top_main, #bottom_main {
+        width: 55%;
+    }
+
+    .is_mobile {
+        display: none;
+    }
+}
+
+@media (max-width: 780px) {
+    #main {
+        width: 90%;
+        
+        border-left: none;
+        border-right: none;
+    }
+
+    #top_main, #bottom_main {
+        width: 90%;
+    }
+
+    .not_mobile {
+        display: none;
+    }
+
+    #tool {
+        float: none;
+        
+        width: 90%;
+        
+        margin-top: 0px;
+        margin-bottom: 10px;
+    }
+}
+
+h1, h2, h3, h4, h5, h6 {
+    border-bottom: 1px solid gainsboro;
+    
+    padding-bottom: 10px;
+}
+
+#main_top {
+    width: 100%;
+}
+
+/* top */
+#top {
+    width: 100%;
+    line-height: 50px;
+    
+    position: relative;
+    top: 0;
+    left: 0;
+
+    background: #2780e3;
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+#top_main {
+    margin: auto;
+}
+
+#top_tool {
+    float: right;
+    color: white;
+}
+
+#top_tool_group {
+    display: inline-block;
+    
+    margin-right: 10px;
+}
+
+#top_tool_cel {
+    display: inline-block;
+    
+    margin-right: -12px;
+}
+
+.top_in_cel {
+    padding-left: 10px;
+    padding-right: 10px;
+    
+    transition: .2s ease-in-out;
+}
+
+.top_in_cel:hover {
+    background: #022988;
+    
+    transition: .2s ease-in-out;
+}
+
+#top_in_user {
+    margin-right: -13px;
+}
+
+#tool_cel {
+    display: inline-block;
+}
+
+#top a {
+    color: white;
+    
+    display: block;
+}
+
+#logo {
+    display: inline-block;
+}
+
+#logo a {
+    padding-left: 20px;
+    padding-right: 20px;
+}
+
+.cel_in_cel {
+    padding: 10px;
+    
+    line-height: initial;
+    
+    position: absolute;
+    
+    background: white;
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+#top .cel_in_cel a {
+    color: black;
+    
+    padding-left: 0;
+    padding-right: 0;
+}
+
+/* search */
+#search {
+    display: inline-block;
+    width: 300px;
+}
+
+#search_input {
+    width: 220px;
+    height: 35px;
+    
+    padding-left: 10px;
+    
+    background-color: white;
+    border: solid 2px #2780e3;
+    color: black;
+    box-shadow: none;
+    
+    transition: .2s ease-in-out;
+}
+
+#search_input::placeholder {
+    color: black;
+}
+
+#search_input:hover, #search_input:focus {
+    border: solid 2px #f4aba1;
+    
+    transition: .2s ease-in-out;
+}
+
+#pre_search {
+    padding: 10px;
+    border: 1px solid #4a4a4a;
+    width: 200px;
+    color: black;
+    margin-top: 5px;
+    background: white;
+    position: absolute;
+}
+
+#pre_search a {
+    color: dodgerblue;
+}
+
+#search button {
+    padding: 0;
+    
+    border: none;
+    
+    background: transparent;
+    box-shadow: none;
+    
+    color: white;
+}
+
+/* content */
+a {
+    color: dodgerblue;
+}
+
+#toc {
+    max-width: 300px;
+}
+
+/*
+pre, #toc, #cate, #redirect {
+    border: 1px solid #aaa;
+}
+*/
+
+#redirect, #cate, #toc, blockquote, button#opennamu_save_button, button#opennamu_preview_button {
+    border: 0;
+    
+    padding: 10px;
+    
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+button#opennamu_save_button {
+    background: #92f7f4;
+}
+
+button#opennamu_preview_button {
+    margin-left: 5px;
+}
+
+#cate {
+    background: #ccf5bc;
+}
+
+#redirect {
+    background: #d9edf7;
+}
+
+#toc {
+    background: lightyellow;
+    padding: 20px;
+}
+
+textarea, input, pre {    
+    border: 0;
+    
+    padding: 5px;
+    
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+pre {
+    padding: 10px;
+}
+
+#syntax {
+    background: #f0f0f0;
+    padding: 5px;
+}
+
+#syntax code {
+    background: transparent;
+}
+
+table {
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+}
+
+button {
+    border: 0;
+    
+    padding: 10px;
+    
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+    background: papayawhip;
+    
+    cursor: pointer;
+}
+
+input[type="checkbox"], input[type="radio"] {
+    box-shadow: None;
+    background: transparent;
+}
+
+select {
+    padding: 0;
+    padding-left: 5px;
+    padding-right: 5px;
+    
+    background: white;
+    border: 0;
+    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
+    
+    min-height: 30px;
+}
+
+/* nav_bar */
+#nav_bar {
+    z-index: 100;
+    
+    font-size: 25px;
+    
+    position: fixed;
+    bottom: 0;
+    right: 0;
+    
+    background: #fa635c;
+    box-shadow: -1px -1px 4px 0 rgba(0,0,0,0.16), -1px -1px 10px 0 rgba(0,0,0,0.12);
+    
+    text-align: center;
+}
+
+#go_toc {
+    display: inline-block;
+
+    padding-right: 10px;
+    padding-left: 10px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    
+    width: 25px;
+}
+
+#go_top {
+    display: inline-block;
+    
+    padding-right: 10px;
+    padding-left: 10px;
+    
+    width: 25px;
+}
+
+#go_bottom {
+    display: inline-block;
+
+    padding-right: 10px;
+    padding-left: 10px;
+    
+    width: 25px;
+}
+
+#nav_bar a {
+    color: white;
+}
+
+/* content */
+a:hover {
+    text-decoration: underline;
+}
+
+#top a:hover {
+    text-decoration: none;
+}
+
+h1#title {
+    margin-bottom: 10px;
+}
+
+div#last_edit {
+    margin-bottom: 20px;
+}
+
+@media (max-width: 600px) {
+    #top_tool {
+        float: none;
+        display: inline;
+    }
+
+    #top_tool_group {
+        margin-left: 20px;
+    }
+
+    #search {
+        width: 100%;
+    }
+
+    #search_input {
+        width: calc(100% - 60px);
+    }
+}
+
+#titlt_a {
+    color: initial;
+}
+
+blockquote {
+    background-color: #ffefff;
+
+    padding: 15px 40px 15px 15px;
+    border-left: 4px solid #ffb3ff;
+    
+    margin-bottom: 20px;
 }

views/tenshi/index.html

@@ -1,225 +1,225 @@
-<!DOCTYPE html>
-<html lang="{{'language_tag'|load_lang}}">
-    <head>
-        <meta charset="utf-8">
-        {% if imp[3][0] != 0 %}
-            <title>{{imp[0]}} {{imp[3][0]}} - {{imp[1][0]}}</title>
-        {% else %}
-            <title>{{imp[0]}} - {{imp[1][0]}}</title>
-        {% endif %}
-        {{imp[3][3]|safe}}
-        <link rel="stylesheet" href="/views/tenshi/css/main.css?ver=20">
-        {% if request.cookies.get('main_css_darkmode', '') == '1' %}
-            <link rel="stylesheet" href="/views/tenshi/css/dark.css?ver=8">
-        {% endif %}
-        <script src="/views/tenshi/js/skin_set.js?ver=9"></script>
-        <script src="/views/tenshi/js/main.js?ver=3"></script>
-        <script src="https://code.iconify.design/1/1.0.3/iconify.min.js"></script>
-        <link rel="shortcut icon" href="/views/main_css/file/favicon.ico?ver=1">
-        {{imp[1][5]|safe}}
-        {{imp[2][3]|safe}}
-        {% if imp[3][0] != 0 %}
-            <meta name="title" content="{{imp[0]}}{{imp[3][0]}} - {{imp[1][0]}}">
-        {% else %}
-            <meta name="title" content="{{imp[0]}} - {{imp[1][0]}}">
-        {% endif %}
-        <meta name="keywords" content="{{imp[0]}}">
-        {% if imp[2][12] != 0 and imp[2][12] == 'w' %}
-            <meta name="description" content="{{data|cut_100}}">
-        {% endif %}
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-    </head>
-    <body>
-        <div id="background">
-            <div id="top">
-                <div id="top_main">
-                    <div id="logo">
-                        <a href="/" class="top_in_cel">{{imp[1][4]|safe}}</a>
-                    </div>
-                    <div id="top_tool">
-                        <div id="top_tool_group">
-                            <div id="top_tool_cel">
-                                <a href="javascript:opening('recent_cel');" class="top_in_cel">
-                                    <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
-                                    <span class="not_mobile">{{'list'|load_lang}}</span>
-                                    <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                                </a>
-                                <div id="recent_cel" class="cel_in_cel" style="display: none;">
-                                    <a href="/recent_changes">
-                                        <span class="iconify" data-icon="ic:baseline-autorenew" data-inline="true"></span>
-                                        {{'recent_change'|load_lang}}
-                                    </a>
-                                    <hr>
-                                    <a href="/recent_discuss">
-                                        <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
-                                        {{'recent_discussion'|load_lang}}
-                                    </a>
-                                    <hr>
-                                    <a href="/vote">
-                                        <span class="iconify" data-icon="ic:baseline-how-to-vote" data-inline="true"></span>
-                                        {{'vote_list'|load_lang}}
-                                    </a>
-                                </div>
-                            </div>
-                             
-                            <div id="top_tool_cel">
-                                <a href="javascript:opening('other_cel');" class="top_in_cel">
-                                    <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
-                                    <span class="not_mobile">{{'tool'|load_lang}}</span>
-                                    <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
-                                </a>
-                                <div id="other_cel" class="cel_in_cel" style="display: none;">
-                                    <a href="/random">
-                                        <span class="iconify" data-icon="ic:baseline-shuffle" data-inline="true"></span>
-                                        {{'random'|load_lang}}
-                                    </a>
-                                    <hr>
-                                    <a href="/other">
-                                        <span class="iconify" data-icon="ic:baseline-build" data-inline="true"></span>
-                                        {{'other_tool'|load_lang}}
-                                    </a>
-                                    {% if imp[2][9] != '0' %}
-                                        <hr>
-                                        <a href="/manager">
-                                            <span class="iconify" data-icon="ic:baseline-how-to-reg" data-inline="true"></span>
-                                            {{'admin_tool'|load_lang}}
-                                        </a>
-                                    {% endif %}
-                                    <hr>
-                                    <a href="/upload">
-                                        <span class="iconify" data-icon="ic:baseline-cloud-upload" data-inline="true"></span>
-                                        {{'upload'|load_lang}}
-                                    </a>
-                                    <hr>
-                                    <a href="/skin_set">
-                                        <span class="iconify" data-icon="ic:baseline-settings" data-inline="true"></span>
-                                        {{'skin_setting'|load_lang}}
-                                    </a>
-                                </div>
-                            </div>
-                             
-                            <div id="top_tool_cel" id="top_in_user">
-                                <a href="/user" class="top_in_cel">
-                                    {% if imp[2][2] == 1 %}
-                                        {% if imp[2][8] != '0' %}
-                                            <span class="iconify" data-icon="ic:baseline-add-alert" data-inline="true"></span>
-                                        {% else %}
-                                            <span class="iconify" data-icon="ic:baseline-person" data-inline="true"></span>
-                                        {% endif %}
-                                    {% else %}
-                                        <span class="iconify" data-icon="ic:round-person-search" data-inline="true"></span>
-                                    {% endif %}
-                                    <span class="not_mobile">{{imp[2][5]}}</span>
-                                </a>
-                            </div>
-                        </div>
-                         
-                        <form method="post" action="/search" id="search" role="search">
-                            <input id="search_input" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
-                            |
-                            <button type="submit" formaction="/goto">
-                                <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
-                            </button>
-                            |
-                            <button type="submit" formaction="/search">
-                                <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
-                            </button>
-                            <div id="pre_search" style="display: none;"></div>
-                        </form>
-                    </div>
-                </div>
-            </div>
-            <div id="main">
-                <div id="main_top">
-                    {% if menu != 0 %}
-                        <div id="tool" class="not_mobile">
-                            {% if menu[0] == 1 %}
-                                {% for sub_d in menu %}
-                                    <div id="tool_cel">
-                                        {% if sub_d|length > 2 and sub_d[2] == 1 %}
-                                            <a class="menu-item" href="{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
-                                        {% else %}
-                                            <a class="menu-item" href="{{sub_d[0]}}">{{sub_d[1]}}</a>
-                                        {% endif %}
-                                    </div>
-                                    {% if menu[loop.index] %}
-                                        |
-                                    {% endif %}
-                                {% endfor %}
-                            {% else %}
-                                {% for sub_d in menu %}
-                                    <div id="tool_cel">
-                                        {% if sub_d|length > 2 and sub_d[2] == 1 %}
-                                            <a class="menu-item" href="/{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
-                                        {% else %}
-                                            <a class="menu-item" href="/{{sub_d[0]}}">{{sub_d[1]}}</a>
-                                        {% endif %}
-                                    </div>
-                                    {% if menu[loop.index] %}
-                                        |
-                                    {% endif %}
-                                {% endfor %}
-                            {% endif %}
-                        </div>
-                    {% endif %}
-                    <h1 id="title">
-                        <a id="titlt_a" href="#"><span class="change_space">{{imp[0]}}</span></a>
-                        {% if imp[3][0] != 0 %}
-                            <sub>{{imp[3][0]}}</sub>
-                        {% endif %}
-                    </h1>
-                    <div id="last_edit">
-                        {% if imp[3][1] != 0 %}
-                            {{'last_edit_time'|load_lang}} : {{imp[3][1]}}
-                        {% endif %}
-                    </div>
-                    {% if menu != 0 %}
-                        <div id="tool" class="is_mobile">
-                            {% for sub_d in menu %}
-                                <div id="tool_cel">
-                                    {% if sub_d|length > 2 and sub_d[2] == 1 %}
-                                        <a class="menu-item" href="/{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
-                                    {% else %}
-                                        <a class="menu-item" href="/{{sub_d[0]}}">{{sub_d[1]}}</a>
-                                    {% endif %}
-                                </div>
-                                {% if menu[loop.index] %}
-                                    |
-                                {% endif %}
-                            {% endfor %}
-                        </div>
-                    {% endif %}
-                </div>
-                <div id="main_data">
-                    {{data|safe}}
-                </div>
-            </div>
-        </div>
-        <div id="bottom">
-            <div id="bottom_main">
-                {{imp[1][1]|safe}}
-                <br>
-                <br>
-                <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/s_logo.png"></a>
-            </div>
-        </div>
-        <div id="nav_bar">
-            <div id="go_top">
-                <a href="#top">
-                    <span class="iconify" data-icon="ic:baseline-arrow-upward" data-inline="true"></span>
-                </a>
-            </div>
-            <div id="go_bottom">
-                <a href="#bottom">
-                    <span class="iconify" data-icon="ic:baseline-arrow-downward" data-inline="true"></span>
-                </a>
-            </div>
-            <div id="go_toc">
-                <a href="#toc">
-                    <span class="iconify" data-icon="ic:baseline-list" data-inline="true"></span>
-                </a>
-            </div>
-        </div>
-        <script>window.addEventListener('DOMContentLoaded', skin_set);</script>
-    </body>
+<!DOCTYPE html>
+<html lang="{{'language_tag'|load_lang}}">
+    <head>
+        <meta charset="utf-8">
+        {% if imp[3][0] != 0 %}
+            <title>{{imp[0]}} {{imp[3][0]}} - {{imp[1][0]}}</title>
+        {% else %}
+            <title>{{imp[0]}} - {{imp[1][0]}}</title>
+        {% endif %}
+        {{imp[3][3]|safe}}
+        <link rel="stylesheet" href="/views/tenshi/css/main.css?ver=20">
+        {% if request.cookies.get('main_css_darkmode', '') == '1' %}
+            <link rel="stylesheet" href="/views/tenshi/css/dark.css?ver=8">
+        {% endif %}
+        <script src="/views/tenshi/js/skin_set.js?ver=9"></script>
+        <script src="/views/tenshi/js/main.js?ver=3"></script>
+        <script src="https://code.iconify.design/1/1.0.3/iconify.min.js"></script>
+        <link rel="shortcut icon" href="/views/main_css/file/favicon.ico?ver=1">
+        {{imp[1][5]|safe}}
+        {{imp[2][3]|safe}}
+        {% if imp[3][0] != 0 %}
+            <meta name="title" content="{{imp[0]}}{{imp[3][0]}} - {{imp[1][0]}}">
+        {% else %}
+            <meta name="title" content="{{imp[0]}} - {{imp[1][0]}}">
+        {% endif %}
+        <meta name="keywords" content="{{imp[0]}}">
+        {% if imp[2][12] != 0 and imp[2][12] == 'w' %}
+            <meta name="description" content="{{data|cut_100}}">
+        {% endif %}
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+    </head>
+    <body>
+        <div id="background">
+            <div id="top">
+                <div id="top_main">
+                    <div id="logo">
+                        <a href="/" class="top_in_cel">{{imp[1][4]|safe}}</a>
+                    </div>
+                    <div id="top_tool">
+                        <div id="top_tool_group">
+                            <div id="top_tool_cel">
+                                <a href="javascript:opening('recent_cel');" class="top_in_cel">
+                                    <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
+                                    <span class="not_mobile">{{'list'|load_lang}}</span>
+                                    <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                                </a>
+                                <div id="recent_cel" class="cel_in_cel" style="display: none;">
+                                    <a href="/recent_changes">
+                                        <span class="iconify" data-icon="ic:baseline-autorenew" data-inline="true"></span>
+                                        {{'recent_change'|load_lang}}
+                                    </a>
+                                    <hr>
+                                    <a href="/recent_discuss">
+                                        <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
+                                        {{'recent_discussion'|load_lang}}
+                                    </a>
+                                    <hr>
+                                    <a href="/vote">
+                                        <span class="iconify" data-icon="ic:baseline-how-to-vote" data-inline="true"></span>
+                                        {{'vote_list'|load_lang}}
+                                    </a>
+                                </div>
+                            </div>
+                             
+                            <div id="top_tool_cel">
+                                <a href="javascript:opening('other_cel');" class="top_in_cel">
+                                    <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
+                                    <span class="not_mobile">{{'tool'|load_lang}}</span>
+                                    <span class="iconify" data-icon="ic:baseline-arrow-drop-down" data-inline="true"></span>
+                                </a>
+                                <div id="other_cel" class="cel_in_cel" style="display: none;">
+                                    <a href="/random">
+                                        <span class="iconify" data-icon="ic:baseline-shuffle" data-inline="true"></span>
+                                        {{'random'|load_lang}}
+                                    </a>
+                                    <hr>
+                                    <a href="/other">
+                                        <span class="iconify" data-icon="ic:baseline-build" data-inline="true"></span>
+                                        {{'other_tool'|load_lang}}
+                                    </a>
+                                    {% if imp[2][9] != '0' %}
+                                        <hr>
+                                        <a href="/manager">
+                                            <span class="iconify" data-icon="ic:baseline-how-to-reg" data-inline="true"></span>
+                                            {{'admin_tool'|load_lang}}
+                                        </a>
+                                    {% endif %}
+                                    <hr>
+                                    <a href="/upload">
+                                        <span class="iconify" data-icon="ic:baseline-cloud-upload" data-inline="true"></span>
+                                        {{'upload'|load_lang}}
+                                    </a>
+                                    <hr>
+                                    <a href="/skin_set">
+                                        <span class="iconify" data-icon="ic:baseline-settings" data-inline="true"></span>
+                                        {{'skin_setting'|load_lang}}
+                                    </a>
+                                </div>
+                            </div>
+                             
+                            <div id="top_tool_cel" id="top_in_user">
+                                <a href="/user" class="top_in_cel">
+                                    {% if imp[2][2] == 1 %}
+                                        {% if imp[2][8] != '0' %}
+                                            <span class="iconify" data-icon="ic:baseline-add-alert" data-inline="true"></span>
+                                        {% else %}
+                                            <span class="iconify" data-icon="ic:baseline-person" data-inline="true"></span>
+                                        {% endif %}
+                                    {% else %}
+                                        <span class="iconify" data-icon="ic:round-person-search" data-inline="true"></span>
+                                    {% endif %}
+                                    <span class="not_mobile">{{imp[2][5]}}</span>
+                                </a>
+                            </div>
+                        </div>
+                         
+                        <form method="post" action="/search" id="search" role="search">
+                            <input id="search_input" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
+                            |
+                            <button type="submit" formaction="/goto">
+                                <span class="iconify" data-icon="ic:round-find-in-page" data-inline="true"></span>
+                            </button>
+                            |
+                            <button type="submit" formaction="/search">
+                                <span class="iconify" data-icon="ic:baseline-search" data-inline="true"></span>
+                            </button>
+                            <div id="pre_search" style="display: none;"></div>
+                        </form>
+                    </div>
+                </div>
+            </div>
+            <div id="main">
+                <div id="main_top">
+                    {% if menu != 0 %}
+                        <div id="tool" class="not_mobile">
+                            {% if menu[0] == 1 %}
+                                {% for sub_d in menu %}
+                                    <div id="tool_cel">
+                                        {% if sub_d|length > 2 and sub_d[2] == 1 %}
+                                            <a class="menu-item" href="{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
+                                        {% else %}
+                                            <a class="menu-item" href="{{sub_d[0]}}">{{sub_d[1]}}</a>
+                                        {% endif %}
+                                    </div>
+                                    {% if menu[loop.index] %}
+                                        |
+                                    {% endif %}
+                                {% endfor %}
+                            {% else %}
+                                {% for sub_d in menu %}
+                                    <div id="tool_cel">
+                                        {% if sub_d|length > 2 and sub_d[2] == 1 %}
+                                            <a class="menu-item" href="/{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
+                                        {% else %}
+                                            <a class="menu-item" href="/{{sub_d[0]}}">{{sub_d[1]}}</a>
+                                        {% endif %}
+                                    </div>
+                                    {% if menu[loop.index] %}
+                                        |
+                                    {% endif %}
+                                {% endfor %}
+                            {% endif %}
+                        </div>
+                    {% endif %}
+                    <h1 id="title">
+                        <a id="titlt_a" href="#"><span class="change_space">{{imp[0]}}</span></a>
+                        {% if imp[3][0] != 0 %}
+                            <sub>{{imp[3][0]}}</sub>
+                        {% endif %}
+                    </h1>
+                    <div id="last_edit">
+                        {% if imp[3][1] != 0 %}
+                            {{'last_edit_time'|load_lang}} : {{imp[3][1]}}
+                        {% endif %}
+                    </div>
+                    {% if menu != 0 %}
+                        <div id="tool" class="is_mobile">
+                            {% for sub_d in menu %}
+                                <div id="tool_cel">
+                                    {% if sub_d|length > 2 and sub_d[2] == 1 %}
+                                        <a class="menu-item" href="/{{sub_d[0]}}" id="topic_color">{{sub_d[1]}}</a>
+                                    {% else %}
+                                        <a class="menu-item" href="/{{sub_d[0]}}">{{sub_d[1]}}</a>
+                                    {% endif %}
+                                </div>
+                                {% if menu[loop.index] %}
+                                    |
+                                {% endif %}
+                            {% endfor %}
+                        </div>
+                    {% endif %}
+                </div>
+                <div id="main_data">
+                    {{data|safe}}
+                </div>
+            </div>
+        </div>
+        <div id="bottom">
+            <div id="bottom_main">
+                {{imp[1][1]|safe}}
+                <br>
+                <br>
+                <a href="https://github.com/openNAMU/openNAMU"><img id="b_logo" src="/views/main_css/file/logo.svg"></a>
+            </div>
+        </div>
+        <div id="nav_bar">
+            <div id="go_top">
+                <a href="#top">
+                    <span class="iconify" data-icon="ic:baseline-arrow-upward" data-inline="true"></span>
+                </a>
+            </div>
+            <div id="go_bottom">
+                <a href="#bottom">
+                    <span class="iconify" data-icon="ic:baseline-arrow-downward" data-inline="true"></span>
+                </a>
+            </div>
+            <div id="go_toc">
+                <a href="#toc">
+                    <span class="iconify" data-icon="ic:baseline-list" data-inline="true"></span>
+                </a>
+            </div>
+        </div>
+        <script>window.addEventListener('DOMContentLoaded', skin_set);</script>
+    </body>
 </html>

views/tenshi/info.json

@@ -1,5 +1,5 @@
-{
-    "name" : "Tenshi",
-    "skin_ver" : "v2.0.2",
-    "require_ver" : "3500110"
+{
+    "name" : "Tenshi",
+    "skin_ver" : "v2.0.2",
+    "require_ver" : "3500110"
 }

views/tenshi/js/main.js

@@ -1,29 +1,29 @@
-var save_data = '';
-var open = 0;
-
-function opening(data) {
-    save_data = data;
-    if(data === 'recent_cel') {
-        var element = document.getElementById(data);
-        var element_2 = document.getElementById('other_cel');
-    } else {
-        var element = document.getElementById(data);
-        var element_2 = document.getElementById('recent_cel');
-    }
-
-    if(element.style.display == 'none') {
-        element.style.display = 'block';
-        element_2.style.display = 'none';
-    } else {
-        element.style.display = 'none';
-    }
-
-    open = 1;
-    setTimeout(function() { open = 0; }, 100);
-}
-
-document.onclick = function(event) {
-    if(save_data !== '' && open == 0) {
-        document.getElementById(save_data).style.display = 'none';
-    }
+var save_data = '';
+var open = 0;
+
+function opening(data) {
+    save_data = data;
+    if(data === 'recent_cel') {
+        var element = document.getElementById(data);
+        var element_2 = document.getElementById('other_cel');
+    } else {
+        var element = document.getElementById(data);
+        var element_2 = document.getElementById('recent_cel');
+    }
+
+    if(element.style.display == 'none') {
+        element.style.display = 'block';
+        element_2.style.display = 'none';
+    } else {
+        element.style.display = 'none';
+    }
+
+    open = 1;
+    setTimeout(function() { open = 0; }, 100);
+}
+
+document.onclick = function(event) {
+    if(save_data !== '' && open == 0) {
+        document.getElementById(save_data).style.display = 'none';
+    }
 }

views/tenshi/js/skin_set.js

@@ -1,53 +1,53 @@
-function regex_data(data) {
-    return new RegExp('(?:^|; )' + data + '=([^;]*)');
-}
-
-function get_post() {
-    check = document.getElementById('invert');
-    if(check.checked === true) {
-        document.cookie = 'main_css_darkmode=1;';
-    } else {
-        document.cookie = 'main_css_darkmode=0;';
-    }
-
-    history.go(0);
-}
-
-function skin_set() {
-    if(window.location.pathname === '/skin_set') {
-        var set_language = {
-            "en-US" : {
-                "save" : "Save",
-                "darkmode" : "Darkmode"
-            }, "ko-KR" : {
-                "save" : "저장",
-                "darkmode" : "다크모드"
-            }
-        }
-
-        var language = cookies.match(regex_data('language'))[1];
-        var user_language = cookies.match(regex_data('user_language'))[1];
-        if(user_language in set_language) {
-            language = user_language;
-        }
-
-        if(!language in set_language) {
-            language = "en-US";
-        }
-
-        var set_data = {};
-
-        if(
-            cookies.match(regex_data('main_css_darkmode')) &&
-            cookies.match(regex_data('main_css_darkmode'))[1] === '1'
-        ) {
-            set_data["invert"] = "checked";
-        }
-
-        document.getElementById("main_skin_set").innerHTML = ' \
-            <input ' + set_data["invert"] + ' type="checkbox" id="invert" name="invert" value="invert"> ' + set_language[language]['darkmode'] + ' \
-            <hr class="main_hr"> \
-            <button onclick="get_post();">' + set_language[language]['save'] + '</button> \
-        ';
-    }
+function regex_data(data) {
+    return new RegExp('(?:^|; )' + data + '=([^;]*)');
+}
+
+function get_post() {
+    check = document.getElementById('invert');
+    if(check.checked === true) {
+        document.cookie = 'main_css_darkmode=1;';
+    } else {
+        document.cookie = 'main_css_darkmode=0;';
+    }
+
+    history.go(0);
+}
+
+function skin_set() {
+    if(window.location.pathname === '/skin_set') {
+        var set_language = {
+            "en-US" : {
+                "save" : "Save",
+                "darkmode" : "Darkmode"
+            }, "ko-KR" : {
+                "save" : "저장",
+                "darkmode" : "다크모드"
+            }
+        }
+
+        var language = cookies.match(regex_data('language'))[1];
+        var user_language = cookies.match(regex_data('user_language'))[1];
+        if(user_language in set_language) {
+            language = user_language;
+        }
+
+        if(!language in set_language) {
+            language = "en-US";
+        }
+
+        var set_data = {};
+
+        if(
+            cookies.match(regex_data('main_css_darkmode')) &&
+            cookies.match(regex_data('main_css_darkmode'))[1] === '1'
+        ) {
+            set_data["invert"] = "checked";
+        }
+
+        document.getElementById("main_skin_set").innerHTML = ' \
+            <input ' + set_data["invert"] + ' type="checkbox" id="invert" name="invert" value="invert"> ' + set_language[language]['darkmode'] + ' \
+            <hr class="main_hr"> \
+            <button onclick="get_post();">' + set_language[language]['save'] + '</button> \
+        ';
+    }
 }