[Docs] Show "New" icon next to new sections/pages in docs. (#3227)

skypilot-org · Feb 25, 2024 · ef1cb40 · ef1cb40
1 parent 107f3bb
commit ef1cb40
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 10 deletions.
diff --git a/docs/source/_static/custom.css b/docs/source/_static/custom.css
@@ -94,3 +94,21 @@ html[data-theme="dark"] {
   background-color: var(--pst-color-background);
   color: var(--pst-color-text-muted);
 }
+
+/* Display a "New" icon for new items (custom.js) */
+.new-item::after {
+    content: "New";
+    display: inline-block;
+    color: white; /* Keeps the text color white for contrast */
+    font-size: 12px; /* Adjusted for a smaller font size */
+
+    background-color: #0d6efd; /* Bootstrap's 'primary' blue color for Bootstrap 5 */
+
+    border-radius: 2px;
+    margin: 0px 0px 0px 4px;
+    padding: 2px 5px; /* Reduced padding for a more compact label */
+    margin-left: 6px; /* Space between the text and the label */
+
+    vertical-align: middle;
+    line-height: 1; /* Adjust line height to ensure vertical alignment */
+}
diff --git a/docs/source/_static/custom.js b/docs/source/_static/custom.js
@@ -1,13 +1,13 @@
-document.addEventListener("DOMContentLoaded", function () {
-       var script = document.createElement("script");
-       script.src = "https://widget.kapa.ai/kapa-widget.bundle.js";
-       script.setAttribute("data-website-id", "4223d017-a3d2-4b92-b191-ea4d425a23c3");
-       script.setAttribute("data-project-name", "SkyPilot");
-       script.setAttribute("data-project-color", "#4C4C4D");
-       script.setAttribute("data-project-logo", "https://avatars.githubusercontent.com/u/109387420?s=100&v=4");
-       script.setAttribute("data-modal-disclaimer", "Results are automatically generated and may be inaccurate or contain inappropriate information. Do not include any sensitive information in your query.");
-       script.setAttribute("data-modal-title", "SkyPilot Docs AI - Ask a Question.");
-       script.setAttribute("data-button-position-bottom", "85px");
+document.addEventListener('DOMContentLoaded', function () {
+       var script = document.createElement('script');
+       script.src = 'https://widget.kapa.ai/kapa-widget.bundle.js';
+       script.setAttribute('data-website-id', '4223d017-a3d2-4b92-b191-ea4d425a23c3');
+       script.setAttribute('data-project-name', 'SkyPilot');
+       script.setAttribute('data-project-color', '#4C4C4D');
+       script.setAttribute('data-project-logo', 'https://avatars.githubusercontent.com/u/109387420?s=100&v=4');
+       script.setAttribute('data-modal-disclaimer', 'Results are automatically generated and may be inaccurate or contain inappropriate information. Do not include any sensitive information in your query.');
+       script.setAttribute('data-modal-title', 'SkyPilot Docs AI - Ask a Question.');
+       script.setAttribute('data-button-position-bottom', '85px');
        script.async = true;
        document.head.appendChild(script);
 });
@@ -20,3 +20,19 @@ document.addEventListener("DOMContentLoaded", function () {
        r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
        a.appendChild(r);
 })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
+
+// New items: add 'new-item' class for for new items.
+document.addEventListener('DOMContentLoaded', () => {
+    // New items:
+    const newItems = [
+        { selector: '.caption-text', text: 'SkyServe: Model Serving' },
+        { selector: '.toctree-l1 > a', text: 'Running on Kubernetes' }
+    ];
+    newItems.forEach(({ selector, text }) => {
+        document.querySelectorAll(selector).forEach((el) => {
+            if (el.textContent.includes(text)) {
+                el.classList.add('new-item');
+            }
+        });
+    });
+});