الگو:تب رده: تفاوت میان نسخه‌ها

@@ خط ۱: / خط ۱: @@
-<div style="border: 1px solid #ddd; border-radius: 8px; overflow: hidden;">
+<div style="max-height: {{{ارتفاع|400px}}}; overflow: auto; border: 1px solid #bccaff; padding: 2px; border-radius: 5px; background-color: #fbfcff; margin: 1em auto;">
-    <div style="display: flex; background: #f5f5f5;">
+{{#if: {{{تیتر|}}} | <div style="white-space: nowrap; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; font-size: 120%; font-weight: bold; text-align: center; padding: 5px; margin: 0px; background-color: #E8DDCD; border: 2px solid #DAC9B4; border-bottom: none;">{{{تیتر|}}}</div>}}
-        <div onclick="showTab('cat1')" style="flex: 1; text-align: center; padding: 10px; cursor: pointer; background: #4CAF50; color: white;">{{{1}}}</div>
+<tabber>
-        <div onclick="showTab('cat2')" style="flex: 1; text-align: center; padding: 10px; cursor: pointer; background: #f5f5f5; color: #333;">{{{2}}}</div>
+|-| اساتید =
-        <div onclick="showTab('cat3')" style="flex: 1; text-align: center; padding: 10px; cursor: pointer; background: #f5f5f5; color: #333;">{{{3}}}</div>
+<categorytree mode="all" hideroot="true">اساتید</categorytree>
-    </div>
+|-| مقالات =
-    <div id="cat1" style="padding: 15px; display: block;">
+<categorytree mode="all" hideroot="true">مقالات</categorytree>
-        <categorytree mode="all" hideroot="true">{{{1}}}</categorytree>
-    </div>
+|-| کتابخانه =
-    <div id="cat2" style="padding: 15px; display: none;">
+<categorytree mode="all" hideroot="true">کتابخانه</categorytree>
-        <categorytree mode="all" hideroot="true">{{{2}}}</categorytree>
-    </div>
+|-| موضوعات =
-    <div id="cat3" style="padding: 15px; display: none;">
+<categorytree mode="all" hideroot="true">موضوعات</categorytree>
-        <categorytree mode="all" hideroot="true">{{{3}}}</categorytree>
+</tabber>
-    </div>
 </div>
-<script>
-function showTab(tabId) {
-    document.getElementById('cat1').style.display = 'none';
-    document.getElementById('cat2').style.display = 'none';
-    document.getElementById('cat3').style.display = 'none';
-    var tabs = document.querySelectorAll('div[onclick^="showTab"]');
-    tabs.forEach(function(tab) {
-        tab.style.background = '#f5f5f5';
-        tab.style.color = '#333';
-    });
-    document.getElementById(tabId).style.display = 'block';
-    event.target.style.background = '#4CAF50';
-    event.target.style.color = 'white';
-}
-</script>