doc: scripts: gen_devicetree_rest: add sidebar with binding overview

doc/_extensions/zephyr/domain/static/css/board.css

@@ -4,69 +4,6 @@
  */
 
 /* Board overview "card" on board documentation pages */
-.sidebar.board-overview {
-    border-radius: 12px;
-    padding: 0px;
-    background: var(--admonition-note-background-color);
-    color: var(--admonition-note-title-color);
-    border-color: var(--admonition-note-title-background-color);
-}
-
-@media screen and (max-width: 480px) {
-    .sidebar.board-overview {
-        float: none;
-        margin-left: 0;
-    }
-}
-
-.sidebar.board-overview {
-    color: var(--admonition-note-color);
-}
-
-.sidebar.board-overview .sidebar-title {
-    font-family: var(--header-font-family);
-    background: var(--admonition-note-title-background-color);
-    color: var(--admonition-note-title-color);
-    border-radius: 12px 12px 0px 0px;
-    margin: 0px;
-    text-align: center;
-}
-
-.sidebar.board-overview figure {
-    padding: 1rem;
-    margin-bottom: -1rem;
-}
-
-.sidebar.board-overview figure img {
-    height: auto !important;
-}
-
-.sidebar.board-overview figure figcaption p {
-    margin-bottom: 0px;
-}
-
-.sidebar.board-overview dl.field-list {
-    align-items: center;
-    margin-top: 12px !important;
-    margin-bottom: 12px !important;
-    grid-template-columns: auto 1fr !important;
-    padding-right: 1em;
-}
-
-.sidebar.board-overview dl.field-list>dt {
-    background: transparent !important;
-}
-
-.sidebar.board-overview dl.field-list>dd {
-    margin-left: 1em;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}
-
-.sidebar.board-overview dl.field-list>dd code {
-    font-size: 0.9em;
-}
-
 .sidebar.board-overview #board-github-link {
     text-align: center;
     margin-bottom: 1em;

doc/_scripts/gen_devicetree_rest.py

@@ -499,6 +499,17 @@ def write_orphans(bindings, base_binding, vnd_lookup, driver_sources, out_dir):
     logging.info('done writing :orphan: files; %d files needed updates',
                  num_written)
 
+def make_sidebar(compatible, vendor_name, vendor_ref_target, driver_path=None):
+    lines = [
+        ".. sidebar:: Overview",
+        "",
+        f"   :Name: ``{compatible}``",
+        f"   :Vendor: :ref:`{vendor_name} <{vendor_ref_target}>`",
+    ]
+    if driver_path:
+        lines.append(f"   :Driver: :zephyr_file:`{driver_path}`")
+    return "\n".join(lines) + "\n"
+
 def print_binding_page(binding, base_names, vnd_lookup, driver_sources,dup_compats,
                        string_io):
     # Print the rst content for 'binding' to 'string_io'. The
@@ -550,24 +561,18 @@ def print_binding_page(binding, base_names, vnd_lookup, driver_sources,dup_compa
     {underline}
     ''', string_io)
 
-    # Vendor: <link-to-vendor-section>
     vnd = compatible_vnd(compatible)
-    print('Vendor: '
-          f':ref:`{vnd_lookup.vendor(vnd)} <{vnd_lookup.target(vnd)}>`\n',
-          file=string_io)
-
-    # Link to driver implementation (if it exists).
-    compatible = re.sub("[-,.@/+]", "_", compatible.lower())
-    if compatible in driver_sources:
-        print_block(
-            f"""\
-            .. note::
-
-               An implementation of a driver matching this compatible is available in
-               :zephyr_file:`{driver_sources[compatible]}`.
-        """,
-            string_io,
-        )
+    vendor_name = vnd_lookup.vendor(vnd)
+    vendor_target = vnd_lookup.target(vnd)
+    driver_path = driver_sources.get(re.sub("[-,.@/+]", "_", compatible.lower()))
+
+    sidebar_content = make_sidebar(
+        compatible=compatible,
+        vendor_name=vendor_name,
+        vendor_ref_target=vendor_target,
+        driver_path=driver_path,
+    )
+    print_block(sidebar_content, string_io)
 
     # Binding description.
     if binding.bus:

doc/_static/css/custom.css

@@ -1,4 +1,4 @@
 /**
  * Copyright (c) 2019-2020, Juan Linietsky, Ariel Manzur and the Godot community
  * Copyright (c) 2021, Teslabs Engineering S.L.
  * Copyright (c) 2023-2025, The Linux Foundation.
@@ -927,6 +927,70 @@
     filter: var(--graphviz-filter);
 }
 
+/* Sidebar */
+.rst-content .sidebar {
+    border-radius: 12px;
+    padding: 0px;
+    background: var(--admonition-note-background-color);
+    color: var(--admonition-note-title-color);
+    border-color: var(--admonition-note-title-background-color);
+}
+
+@media screen and (max-width: 480px) {
+    .rst-content .sidebar {
+        float: none;
+        margin-left: 0;
+    }
+}
+
+.rst-content .sidebar {
+    color: var(--admonition-note-color);
+}
+
+.rst-content .sidebar .sidebar-title {
+    font-family: var(--header-font-family);
+    background: var(--admonition-note-title-background-color);
+    color: var(--admonition-note-title-color);
+    border-radius: 12px 12px 0px 0px;
+    margin: 0px;
+    text-align: center;
+}
+
+.rst-content .sidebar figure {
+    padding: 1rem;
+    margin-bottom: -1rem;
+}
+
+.rst-content .sidebar figure img {
+    height: auto !important;
+}
+
+.rst-content .sidebar figure figcaption p {
+    margin-bottom: 0px;
+}
+
+.rst-content .sidebar dl.field-list {
+    align-items: center;
+    margin-top: 12px !important;
+    margin-bottom: 12px !important;
+    grid-template-columns: auto 1fr !important;
+    padding-right: 1em;
+}
+
+.rst-content .sidebar dl.field-list>dt {
+    background: transparent !important;
+}
+
+.rst-content .sidebar dl.field-list>dd {
+    margin-left: 1em;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+.rst-content .sidebar dl.field-list>dd code {
+    font-size: 0.9em;
+}
+
 /* Home page grid display */
 .grid {
     list-style-type: none !important;