Change summary
docs/theme/css/chrome.css | 33 +++++++++++++++++++++++++++++----
docs/theme/index.hbs | 5 +++--
2 files changed, 32 insertions(+), 6 deletions(-)
Detailed changes
@@ -26,6 +26,14 @@ a > .hljs {
overflow-x: clip;
}
+.large-logo-img {
+ display: block;
+}
+
+.icon-logo-img {
+ display: none;
+}
+
/* Menu Bar */
#menu-bar,
@@ -34,7 +42,7 @@ a > .hljs {
margin: auto calc(0px - var(--page-padding));
}
#menu-bar {
- padding: 16px;
+ padding: 12px 16px;
position: relative;
display: flex;
flex-wrap: wrap;
@@ -77,9 +85,24 @@ a > .hljs {
}
@media only screen and (max-width: 420px) {
- #menu-bar i,
- #menu-bar .icon-button {
- padding: 0 5px;
+ .large-logo-img {
+ display: none;
+ }
+
+ .icon-logo-img {
+ display: block;
+ }
+
+ #menu-bar {
+ padding: 12px;
+ }
+
+ #menu-bar .ib-hidden-mobile {
+ display: none;
+ }
+
+ .right-buttons {
+ width: 100px; /*For center aligning the icon link*/
}
}
@@ -96,7 +119,9 @@ a > .hljs {
.right-buttons {
display: flex;
align-items: center;
+ justify-content: end;
}
+
.right-buttons a {
text-decoration: none;
}
@@ -139,7 +139,7 @@
<li role="none"><button role="menuitem" class="theme" id="dark">Dark</button></li>
</ul>
- <button id="copy-markdown-toggle" class="icon-button" type="button" title="Copy Page as Markdown" aria-label="Copy page as markdown">
+ <button id="copy-markdown-toggle" class="icon-button ib-hidden-mobile" type="button" title="Copy Page as Markdown" aria-label="Copy page as markdown">
<i class="fa fa-copy"></i>
</button>
@@ -152,7 +152,8 @@
<header class="menu-title">
<a href="/">
- <img src="https://zed.dev/logo_wordmark_1500.webp" alt="Zed Industries" style="height: 28px;">
+ <img src="https://zed.dev/logo_wordmark_1500.webp" class="large-logo-img" alt="Zed Industries" style="height: 28px;">
+ <img src="https://zed.dev/logo_icon.webp" class="icon-logo-img" alt="Zed Industries" style="height: 28px;">
</a>
</header>