기본 스킨 역변

views/marisa/css/main.css

@@ -53,7 +53,7 @@ li {
     position: relative;
     top: 0;
     left: 0;
-    height: 20px;
+    height: auto;
 }
 
 #main {
@@ -429,4 +429,28 @@ div#last_edit {
 
 #mobile_search_input {
     border-radius: 10px;
+}
+
+#top_menu_groups {
+    display: inline-block;
+}
+
+@media (max-width: 600px) {
+    #top_tool {
+        float: none;
+        display: inline;
+    }
+
+    #top_menu_groups {
+        margin-left: 20px;
+    }
+
+    #search {
+        margin-top: 10px;
+        width: 100%;
+    }
+
+    #search_input {
+        width: calc(100% - 60px);
+    }
 }

views/marisa/index.html

@@ -25,67 +25,76 @@
                     <div id="logo">
                         <a href="/">{{imp[1][4]|safe}}</a>
                     </div>
-                    <div id="top_tool" class="not_mobile">
-                        <div id="top_tool_cel">
-                            <a href="javascript:void(0);" onclick="opening('recent_cel');">
-                                <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
-                                {{'recent'|load_lang}}
-                                <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>
-                                    {{'edit'|load_lang}}
-                                </a>
-                                <hr>
-                                <a href="/recent_discuss">
-                                    <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
-                                    {{'discussion'|load_lang}}
+                    <div id="top_tool">
+                        <div id="top_menu_groups">
+                            <div id="top_tool_cel">
+                                <a href="javascript:void(0);" onclick="opening('recent_cel');">
+                                    <span class="iconify" data-icon="ic:baseline-access-time" data-inline="true"></span>
+                                    <span class="not_mobile">{{'recent'|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>
+                                        {{'edit'|load_lang}}
+                                    </a>
+                                    <hr>
+                                    <a href="/recent_discuss">
+                                        <span class="iconify" data-icon="ic:baseline-add-comment" data-inline="true"></span>
+                                        {{'discussion'|load_lang}}
+                                    </a>
+                                </div>
                             </div>
-                        </div>
-                         
-                        <div id="top_tool_cel">
-                            <a href="javascript:void(0);" onclick="opening('other_cel');">
-                                <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
-                                {{'other'|load_lang}}
-                                <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>
-                                    {{'tool'|load_lang}}
-                                </a>
-                                <hr>
-                                <a href="/skin_set">
-                                    <span class="iconify" data-icon="ic:baseline-settings" data-inline="true"></span>
-                                    {{'skin_setting'|load_lang}}
+                             
+                            <div id="top_tool_cel">
+                                <a href="javascript:void(0);" onclick="opening('other_cel');">
+                                    <span class="iconify" data-icon="ic:baseline-archive" data-inline="true"></span>
+                                    <span class="not_mobile">{{'other'|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>
+                                        {{'tool'|load_lang}}
+                                    </a>
+                                    {% if imp[2][9] != '0' %}
+                                        <hr>
+                                        <a href="/manager">
+                                            <span class="iconify" data-icon="ic:baseline-build" data-inline="true"></span>
+                                            {{'admin'|load_lang}}
+                                        </a>
+                                    {% endif %}
+                                    <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>
-                         
-                        <div id="top_tool_cel">
-                            <a href="/user">
-                                {% if imp[2][2] == 1 %}
-                                    {% if imp[2][8] != '0' %}
-                                        <span class="iconify" data-icon="ic:baseline-add-alert" data-inline="true"></span>
+                             
+                            <div id="top_tool_cel">
+                                <a href="/user">
+                                    {% 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:baseline-person-add" data-inline="true"></span>
+                                        <span class="iconify" data-icon="ic:baseline-person" data-inline="true"></span>
                                     {% endif %}
-                                {% else %}
-                                    <span class="iconify" data-icon="ic:baseline-person" data-inline="true"></span>
-                                {% endif %}
-                                {{imp[2][5]}}
-                            </a>
+                                    <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">
+                            <input id="search_input" name="search" onclick="view_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>
@@ -97,39 +106,6 @@
                             <div id="pre_search" style="display: none;"></div>
                         </form>
                     </div>
-                    <div id="top_tool_mobile" class="is_mobile">
-                        <a href="javascript:void(0);" onclick="opening('mobile_menu');">
-                            <span class="iconify" data-icon="ic:baseline-reorder" data-inline="true"></span> {{'tool'|load_lang}}
-                        </a>
-                    </div>
-                </div>
-            </div>
-            <div id="mobile_menu" class="is_mobile" style="display: none;">
-                <div id="mobile_menu_main">
-                    <form method="post" action="/search" id="mobile_search" role="search">
-                        <input id="mobile_search_input" name="search" placeholder="{{'search'|load_lang}}" autocomplete="off" type="search">
-                        <br>
-                        <button id="mobile_button_first" 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>
-                        |
-                        <a href="javascript:void(0);" onclick="opening('mobile_menu');">
-                            <span class="iconify" data-icon="ic:baseline-reorder" data-inline="true"></span>
-                        </a>
-                    </form>
-                    <h2>{{'recent'|load_lang}}</h2>
-                    <li><a href="/recent_changes">{{'edit'|load_lang}}</a></li>
-                    <li><a href="/recent_discuss">{{'discussion'|load_lang}}</a></li>
-                    <h2>{{'other'|load_lang}}</h2>
-                    <li><a href="/random">{{'random'|load_lang}}</a></li>
-                    <li><a href="/other">{{'tool'|load_lang}}</a></li>
-                    <li><a href="/skin_set">{{'skin_setting'|load_lang}}</a></li>
-                    <h2>{{'user'|load_lang}}</h2>
-                    <li><a href="/user">{{imp[2][5]}}</a></li>
                 </div>
             </div>
             <div id="main">

views/marisa/info.json

@@ -1,5 +1,5 @@
 {
     "name" : "Marisa",
-    "skin_ver" : "v1.1.2",
+    "skin_ver" : "v1.1.3",
     "require_ver" : "5"
 }

views/marisa/js/main.js

@@ -1,8 +1,37 @@
+var save_data = '';
+var open = 0;
+
 function opening(data) {
-    var element = document.getElementById(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) {
+    var element = document.getElementById(save_data);
+
+    for(var node = event.target; node != document.body; node = node.parentNode) {
+        if(save_data !== '' && open == 0) {
+            if(node.id === save_data) {
+                break;
+            } else {
+                element.style.display = 'none';
+            }
+        }
+    }
 }

views/marisa/js/search.js

@@ -32,5 +32,18 @@ function search_do() {
     }
 
     var before = '';
+    save_data = 'pre_search';
+    open = 1;
+    setTimeout(function() { open = 0; }, 100);
     setInterval(search_load, 1000);
+}
+
+function view_search() {
+    var data = document.getElementById("pre_search").innerHTML;
+    if(data !== '') {
+        document.getElementById("pre_search").style.display = 'block';
+    }
+
+    open = 1;
+    setTimeout(function() { open = 0; }, 100);
 }