Template:Village pump page header: Difference between revisions

Revision as of 15:20, 28 September 2026

Template documentation[create]

Editors can experiment in this template's sandbox and testcases pages.
Please add categories to the /doc subpage. Subpages of this template.

@@ Line 1: / Line 1: @@
-<includeonly><div style="background: #ffffff; border: 1px solid #dcdfe6; border-radius: 12px; padding: 14px; margin-bottom: 1.2em; box-shadow: 0 2px 8px rgba(0,0,0,0.04); box-sizing: border-box; width: 100%; max-width: 100%;">
+<includeonly><templatestyles src="Village pump page header/styles.css" />
+<div class="vph">
-<!-- APP-STYLE SCROLLABLE TAB BAR -->
-<div style="overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 12px; padding-bottom: 4px; border-bottom: 1px solid #e4e7ed; width: 100%; max-width: 100%; box-sizing: border-box;">
+  <!-- TABS NAVIGATION BAR (Horizontal Fix) -->
-  <table style="border-collapse: collapse; background: transparent; border: none; margin: 0; padding: 0;">
+  <div class="vph-tabs">
-     <tr>
+     <div class="vph-tab-item">[[Bharatpedia:Village_pump_(policy)|<span class="vph-tab {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(policy) | vph-tab-active }}">📜 Policy</span>]]</div>
-      <td style="padding-right: 6px; white-space: nowrap;">[[Bharatpedia:Village_pump_(policy)|<span style="background: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(policy) | #2563eb | #f2f4f7 }}; color: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(policy) | #ffffff | #344054 }}; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; text-decoration: none;">📜 Policy</span>]]</td>
+    <div class="vph-tab-item">[[Bharatpedia:Village_pump_(technical)|<span class="vph-tab {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(technical) | vph-tab-active }}">⚙️ Technical</span>]]</div>
-      <td style="padding-right: 6px; white-space: nowrap;">[[Bharatpedia:Village_pump_(technical)|<span style="background: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(technical) | #2563eb | #f2f4f7 }}; color: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(technical) | #ffffff | #344054 }}; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; text-decoration: none;">⚙️ Technical</span>]]</td>
+    <div class="vph-tab-item">[[Bharatpedia:Village_pump_(proposals)|<span class="vph-tab {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(proposals) | vph-tab-active }}">💡 Proposals</span>]]</div>
-      <td style="padding-right: 6px; white-space: nowrap;">[[Bharatpedia:Village_pump_(proposals)|<span style="background: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(proposals) | #2563eb | #f2f4f7 }}; color: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(proposals) | #ffffff | #344054 }}; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; text-decoration: none;">💡 Proposals</span>]]</td>
+    <div class="vph-tab-item">[[Bharatpedia:Village_pump_(idea_lab)|<span class="vph-tab {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(idea_lab) | vph-tab-active }}">🧪 Idea Lab</span>]]</div>
-      <td style="padding-right: 6px; white-space: nowrap;">[[Bharatpedia:Village_pump_(idea_lab)|<span style="background: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(idea_lab) | #2563eb | #f2f4f7 }}; color: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(idea_lab) | #ffffff | #344054 }}; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; text-decoration: none;">🧪 Idea Lab</span>]]</td>
+    <div class="vph-tab-item">[[Bharatpedia:Village_pump_(miscellaneous)|<span class="vph-tab {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(miscellaneous) | vph-tab-active }}">💬 Misc</span>]]</div>
-      <td style="white-space: nowrap;">[[Bharatpedia:Village_pump_(miscellaneous)|<span style="background: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(miscellaneous) | #2563eb | #f2f4f7 }}; color: {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(miscellaneous) | #ffffff | #344054 }}; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; text-decoration: none;">💬 Misc</span>]]</td>
+   </div>
-    </tr>
-   </table>
+  <!-- HEADING TITLE -->
-</div>
+  <div class="vph-title">{{{1|Village pump}}}</div>
-<!-- HEADING TITLE -->
+  <!-- SHORTCUTS LINE -->
-<div style="font-size: 22px; font-weight: 700; color: #1e293b; margin-bottom: 4px; word-wrap: break-word; overflow-wrap: anywhere; word-break: break-word;">
+  {{#if:{{{3|}}}|
-  {{{1|Village pump}}}
+  <div class="vph-shortcuts">
-</div>
+    <strong style="color: #334155;">Shortcuts:</strong> [[{{{3}}}]] {{#if:{{{4|}}}| • [[{{{4}}}]]}} {{#if:{{{5|}}}| • [[{{{5}}}]]}}
+  </div>
-<!-- STANDARD LEFT-ALIGNED SHORTCUTS LINE -->
+  }}
-{{#if:{{{3|}}}|
-<div style="font-size: 12px; color: #64748b; margin-bottom: 8px; word-wrap: break-word; overflow-wrap: anywhere; word-break: break-word;">
+  <!-- DESCRIPTION TEXT -->
-  <strong style="color: #334155;">Shortcuts:</strong> [[{{{3}}}]] {{#if:{{{4|}}}| • [[{{{4}}}]]}} {{#if:{{{5|}}}| • [[{{{5}}}]]}}
+  {{#if:{{{2|}}}|
-</div>
+  <div class="vph-contents">
-}}
+    {{{2}}}
+  </div>
-<!-- DESCRIPTION CONTENT (YAHAN FIX LAGAYA GAYA HAI) -->
+  }}
-{{#if:{{{2|}}}|
-<div style="font-size: 13px; line-height: 1.5; color: #475569; margin-bottom: 12px; word-wrap: break-word; overflow-wrap: anywhere; word-break: break-word; white-space: normal; max-width: 100%; display: block;">
+  <!-- PRIMARY ACTION BUTTON -->
-  {{{2}}}
+  <div style="overflow-wrap: break-word; word-break: break-word; max-width: 100%;">
-</div>
+    [{{fullurl:{{FULLPAGENAME}}|action=edit&section=new}} <span class="vph-button">➕ {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(policy) | Start a new policy discussion | {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(technical) | Start a new technical discussion | {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(proposals) | Start a new proposal | {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(idea_lab) | Share a new idea | {{#ifeq: {{FULLPAGENAME}} | Bharatpedia:Village_pump_(miscellaneous) | Start a new discussion | Start a new discussion }} }} }} }} }}</span>]
-}}
+  </div>
-<!-- PRIMARY ACTION BUTTON -->
-<div style="word-wrap: break-word; overflow-wrap: anywhere; word-break: break-word;">
-  <span style="display: inline-block; background: #2563eb; border-radius: 6px; padding: 8px 16px; font-weight: 600; font-size: 13px; box-shadow: 0 2px 4px rgba(37,99,235,0.2); max-width: 100%; box-sizing: border-box;">[{{fullurl:{{FULLPAGENAME}}|action=edit&section=new}} <span style="color: #ffffff; text-decoration: none;">➕ Start a new proposal</span>]</span>
-</div>
 </div></includeonly><noinclude>
 {{Documentation}}
 </noinclude>