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

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

@ -33,7 +33,7 @@ NAV_LIST_ITEM_TEMPLATE = """
""".strip() """.strip()
DIV_TAB_CONTENT_TEMPLATE = """ 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} {content}
</div> </div>
""".strip() """.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> <li data-tab-key="desktop-web" tabindex="0">Desktop/Web</li>
</ul> </ul>
<div class="blocks"> <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>iOS instructions</p>
<p></div> <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>Desktop/browser instructions</p>
<p></div> <p></div>
</div> </div>
@ -60,10 +60,10 @@ header
<li data-tab-key="android" tabindex="0">Android</li> <li data-tab-key="android" tabindex="0">Android</li>
</ul> </ul>
<div class="blocks"> <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>Desktop/browser instructions</p>
<p></div> <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>Android instructions</p>
<p></div> <p></div>
</div> </div>
@ -77,7 +77,7 @@ header
<li data-tab-key="instructions-for-all-platforms" tabindex="0">Instructions for all platforms</li> <li data-tab-key="instructions-for-all-platforms" tabindex="0">Instructions for all platforms</li>
</ul> </ul>
<div class="blocks"> <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>Instructions for all platforms</p>
<p></div> <p></div>
</div> </div>