Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

css: Use classname instead of `div` selector for .blocks. 

Having the `div` selector there affects the performance. See
https://chat.zulip.org/#narrow/stream/6-frontend/topic/CSS.20selector.20performance/near/1845719
for more details.
This commit is contained in:
Shubham Padia 2024-08-01 04:59:15 +00:00 committed by Tim Abbott
parent e9d0e1d30d
commit 8b96aa277a
3 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/styles/portico/markdown.css
View File

@ -454,7 +454,7 @@
margin-bottom: 10px;
border: 1px solid hsl(0deg 0% 87%);
& > div {
.tab-content {
display: none;
}
}
@ -467,7 +467,7 @@
border-radius: 6px;
}
&.no-tabs .blocks > div,
&.no-tabs .blocks > .tab-content,
&.has-tabs .blocks > .active {
display: block;
}

2
zerver/lib/markdown/tabbed_sections.py
View File

@ -33,7 +33,7 @@ NAV_LIST_ITEM_TEMPLATE = """
""".strip()
DIV_TAB_CONTENT_TEMPLATE = """
<div data-tab-key="{data_tab_key}" markdown="1">
<div class="tab-content" data-tab-key="{data_tab_key}" markdown="1">
{content}
</div>
""".strip()

10
zerver/tests/test_templates.py
View File

@ -42,10 +42,10 @@ header
<li data-tab-key="desktop-web" tabindex="0">Desktop/Web</li>
</ul>
<div class="blocks">
<div data-tab-key="ios" markdown="1"></p>
<div class="tab-content" data-tab-key="ios" markdown="1"></p>
<p>iOS instructions</p>
<p></div>
<div data-tab-key="desktop-web" markdown="1"></p>
<div class="tab-content" data-tab-key="desktop-web" markdown="1"></p>
<p>Desktop/browser instructions</p>
<p></div>
</div>
@ -60,10 +60,10 @@ header
<li data-tab-key="android" tabindex="0">Android</li>
</ul>
<div class="blocks">
<div data-tab-key="desktop-web" markdown="1"></p>
<div class="tab-content" data-tab-key="desktop-web" markdown="1"></p>
<p>Desktop/browser instructions</p>
<p></div>
<div data-tab-key="android" markdown="1"></p>
<div class="tab-content" data-tab-key="android" markdown="1"></p>
<p>Android instructions</p>
<p></div>
</div>
@ -77,7 +77,7 @@ header
<li data-tab-key="instructions-for-all-platforms" tabindex="0">Instructions for all platforms</li>
</ul>
<div class="blocks">
<div data-tab-key="instructions-for-all-platforms" markdown="1"></p>
<div class="tab-content" data-tab-key="instructions-for-all-platforms" markdown="1"></p>
<p>Instructions for all platforms</p>
<p></div>
</div>