|
|
| خط ۹۸: |
خط ۹۸: |
| </div> | | </div> |
|
| |
|
| <!-- مورد سوم - کتابخانه --> | | <!-- مورد اول - مقالات --> |
| <div style="border: 1px solid #e0e6ed; border-radius: 12px; padding: 0; background: white; box-shadow: 0 2px 8px rgba(0,0,0,0.08); overflow: hidden;"> | | <div style="border: 1px solid #e0e6ed; border-radius: 12px; padding: 0; background: white; box-shadow: 0 2px 8px rgba(0,0,0,0.08); overflow: hidden;"> |
| <h2 style="text-align: center; padding: 16px; margin: 0; background: linear-gradient(135deg, #c5e1a5 0%, #aed581 100%); color: #2c3e50; font-size: 18px; font-weight: 600;">کتابخانه</h2>
| | <h2 style="text-align: center; padding: 16px; margin: 0; background: linear-gradient(135deg, #a8e6cf 0%, #88d3ce 100%); color: #2c3e50; font-size: 18px; font-weight: 600;">اساتید</h2> |
|
| | <div style="padding: 15px; max-height: 400px; overflow-y: auto; font-size: 13px;"> |
| <div style="padding: 0;">
| | <categorytree mode="all" hideroot="true" depth="1">اساتید</categorytree> |
| <div style="display: flex; border-bottom: 1px solid #e0e6ed;">
| |
| <div onclick="showTab(1)" style="flex: 1; text-align: center; padding: 12px; cursor: pointer; background: linear-gradient(135deg, #c5e1a5 0%, #aed581 100%); color: white; font-size: 14px; font-weight: 600;">رده اول</div>
| |
| <div onclick="showTab(2)" style="flex: 1; text-align: center; padding: 12px; cursor: pointer; background: #f8f9fa; color: #2c3e50; font-size: 14px;">رده دوم</div>
| |
| </div>
| |
|
| |
| <div id="tab1" style="padding: 15px; max-height: 400px; overflow-y: auto; font-size: 13px;">
| |
| <categorytree mode="all" hideroot="true" depth="1">۰۱- باب اول: فضیلت عقل و مذمت جهل (ابواب عقل و جهل)</categorytree>
| |
| </div>
| |
|
| |
| <div id="tab2" style="padding: 15px; max-height: 400px; overflow-y: auto; font-size: 13px; display: none;"> | |
| <categorytree mode="all" hideroot="true" depth="1">نام_رده_دوم</categorytree> | |
| </div> | | </div> |
| </div> | | </div> |
| </div>
| |
|
| |
| <script>
| |
| function showTab(tabNumber) {
| |
| // مخفی کردن همه تبها
| |
| document.getElementById('tab1').style.display = 'none';
| |
| document.getElementById('tab2').style.display = 'none';
| |
|
| |
| // غیرفعال کردن همه تبها
| |
| var tabs = document.querySelectorAll('div[onclick^="showTab"]');
| |
| tabs.forEach(function(tab) {
| |
| tab.style.background = '#f8f9fa';
| |
| tab.style.color = '#2c3e50';
| |
| tab.style.fontWeight = 'normal';
| |
| });
| |
|
| |
| // نمایش تب انتخاب شده
| |
| document.getElementById('tab' + tabNumber).style.display = 'block';
| |
|
| |
| // فعال کردن تب انتخاب شده
| |
| event.target.style.background = 'linear-gradient(135deg, #c5e1a5 0%, #aed581 100%)';
| |
| event.target.style.color = 'white';
| |
| event.target.style.fontWeight = '600';
| |
| }
| |
| </script>
| |
| </div> | | </div> |