Merge pull request #105 from jason-fox/feature/spacing

Fix #104 - add defined button padding to collapsible sidebar

Customization/xsl/nav.xsl

@@ -15,6 +15,7 @@
   <xsl:param name="FILEDIR" as="xs:string?"/>
   <xsl:param name="FILENAME" as="xs:string?"/>
   <xsl:param name="BOOTSTRAP_CSS_ACTIVE_NAV_PARENT" select="'active'"/>
+  <xsl:param name="TOC_SPACER_PADDING" select="'0'"/>
   <xsl:param name="input.map.url" as="xs:string?"/>
 
   <xsl:variable name="input.map" as="document-node()?">
@@ -255,7 +256,17 @@
         <xsl:call-template name="sidebar-content"/>
       </xsl:when>
       <xsl:otherwise>
-        <div class="bs-sidebar">
+        <div>
+          <xsl:attribute name="class">
+          <xsl:choose>
+            <xsl:when test="not($TOC_SPACER_PADDING = '0')">
+                <xsl:value-of select="concat('bs-sidebar py-', $TOC_SPACER_PADDING)"/>
+            </xsl:when>
+            <xsl:otherwise>
+              <xsl:text>bs-sidebar</xsl:text>
+            </xsl:otherwise>
+          </xsl:choose>
+          </xsl:attribute>
           <xsl:call-template name="offcanvas-sidebar"/>
         </div>
       </xsl:otherwise>

Customization/xsl/utility-classes.xsl

@@ -11,12 +11,12 @@
   exclude-result-prefixes="xs dita-ot"
 >
   <xsl:param name="BOOTSTRAP_CSS_SHORTDESC" select="'text-body-secondary lead'"/>
-  <xsl:param name="BOOTSTRAP_CSS_CODEBLOCK" select="'border rounded'"/>
+  <xsl:param name="BOOTSTRAP_CSS_CODEBLOCK" select="'alert alert-secondary'"/>
   <xsl:param name="BOOTSTRAP_CSS_TOPIC_TITLE" select="''"/>
   <xsl:param name="BOOTSTRAP_CSS_SECTION_TITLE" select="'h4'"/>
   <xsl:param name="BOOTSTRAP_CSS_CARD" select="''"/>
   <xsl:param name="BOOTSTRAP_CSS_CAROUSEL" select="''"/>
-  <xsl:param name="BOOTSTRAP_CSS_CAPTION" select="'bg-secondary-subtle text-body-secondary'"/>
+  <xsl:param name="BOOTSTRAP_CSS_CAPTION" select="'alert alert-secondary p-1'"/>
   <xsl:param name="BOOTSTRAP_CSS_TABS" select="''"/>
   <xsl:param name="BOOTSTRAP_CSS_TABS_VERTICAL" select="'me-3'"/>
   <xsl:param name="BOOTSTRAP_CSS_ACCORDION" select="''"/>

README.md

@@ -215,7 +215,8 @@ Additionally, opt-in breadcrumbs and menu bars can be added using the following
 - `args.breadcrumbs` – add Bootstrap breadcrumb components
 - `menubar-toc.include` – add a Bootstrap menubar
 - `scrollspy-toc` – add a Bootstrap [scrollspy][18] navigator
-- `bidi.include` - whether to force included support for RTL languages
+- `bidi.include` – whether to force included support for RTL languages
+- `toc-spacer.padding` – specifies the vertical padding to add to the side menu
 
 ## Feedback
 

build_dita2html5-bootstrap_template.xml

@@ -227,6 +227,22 @@
       <equals arg1="${bootstrap.theme}" arg2="none"/>
     </condition>
 
+    <condition property="toc-spacer.padding" value="1">
+      <or>
+        <equals arg1="${bootstrap.theme}" arg2="darkly"/>
+        <equals arg1="${bootstrap.theme}" arg2="flatly"/>
+        <equals arg1="${bootstrap.theme}" arg2="materia"/>
+        <equals arg1="${bootstrap.theme}" arg2="pulse"/>
+        <equals arg1="${bootstrap.theme}" arg2="quartz"/>
+        <equals arg1="${bootstrap.theme}" arg2="sketchy"/>
+      </or>
+    </condition>
+     <condition property="toc-spacer.padding" value="3">
+      <or>
+        <equals arg1="${bootstrap.theme}" arg2="lux"/>
+      </or>
+    </condition>
+
     <copy
       file="${bootstrap.template.file}"
       toFile="${bootstrap.theme.file}"
@@ -239,5 +255,8 @@
       value="${bootstrap.theme}/bootstrap${bootstrap.rtl}min.css "
     />
     <property name="args.hdf" value="${bootstrap.theme.file}"/>
+    <property
+      file="${dita.plugin.net.infotexture.dita-bootstrap.dir}/cfg/${bootstrap.theme}.properties"
+    />
   </target>
 </project>

cfg/cosmo.properties

@@ -0,0 +1 @@
+bootstrap.css.figure.image=img-fluid border

cfg/lux.properties

@@ -0,0 +1 @@
+bootstrap.css.figure.image=img-fluid border

cfg/morph.properties

@@ -0,0 +1,3 @@
+bootstrap.css.carousel=border rounded border-secondary-subtle shadow pt-3 pb-2 px-1
+bootstrap.css.carousel.indicators=border rounded-5 border-secondary-subtle bg-secondary p-1 shadow
+bootstrap.css.figure.image=img-fluid border rounded shadow

cfg/pulse.properties

@@ -0,0 +1,2 @@
+bootstrap.css.carousel=border border-primary-subtle pt-3 pb-2 px-1
+bootstrap.css.figure.image=img-fluid border

cfg/yeti.properties

@@ -0,0 +1 @@
+bootstrap.css.figure.image=img-fluid border

css/collapsible-toc.css

@@ -60,17 +60,51 @@
 
 .bd-links .btn {
   padding-top: 0.25rem;
+  padding-bottom: 0rem;
   font-weight: 600;
   background-color: transparent;
   border: 0;
   box-shadow: none;
   color: var(--bs-body-color);
+  padding-left: 0.25rem !important;
+}
+
+[dir='rtl'] .bd-links .btn {
+  padding-left: 0rem !important;
+  padding-right: 0.25rem !important;
 }
 
 .bd-links svg:hover {
   color: var(--bs-link-hover-color);
 }
 
+.bd-links .ps-2 {
+  padding-left: 0.5rem !important;
+}
+
+[dir='rtl'] .bd-links .ps-2 {
+  padding-left: 0rem !important;
+  padding-right: 0.5rem !important;
+}
+
+.bd-links .ps-3 {
+  padding-left: 0.75rem !important;
+}
+
+[dir='rtl'] .bd-links .ps-3 {
+  padding-left: 0rem !important;
+  padding-right: 0.75rem !important;
+}
+
+.bd-links .ps-4 {
+  padding-left: 1rem !important;
+}
+
+[dir='rtl'] .bd-links .ps-4 {
+  padding-left: 0rem !important;
+  padding-right: 1rem !important;
+}
+
 [dir='rtl'] .bd-links svg {
   transform: rotate(180deg);
 }

insertParameters.xml

@@ -154,6 +154,11 @@
     expression="${bidi.include}"
     if:set="bidi.include"
   />
+  <param
+    name="TOC_SPACER_PADDING"
+    expression="${toc-spacer.padding}"
+    if:set="toc-spacer.padding"
+  />
   <param
     name="BOOTSTRAP_ICON_TIP"
     expression="${bootstrap.icon.tip}"

plugin.xml

@@ -72,6 +72,18 @@
       <val>yes</val>
       <val default="true">no</val>
     </param>
+    <param
+      name="toc-spacer.padding"
+      desc="Specifies the vertical padding to add to the side menu"
+      type="enum"
+    >
+      <val default="true">0</val>
+      <val>1</val>
+      <val>2</val>
+      <val>3</val>
+      <val>4</val>
+      <val>5</val>
+    </param>
     <param
       name="popovers.include"
       desc="Specifies whether to enable popovers and tooltips"

sample/index.dita

@@ -444,6 +444,9 @@
       <indexterm><parmname>--icons.include</parmname></indexterm>
       <indexterm><parmname>--popovers.include</parmname></indexterm>
       <indexterm><parmname>--dark.mode.include</parmname></indexterm>
+      <indexterm><parmname>--menubar-toc.include</parmname></indexterm>
+      <indexterm><parmname>--bidi.include</parmname></indexterm>
+      <indexterm><parmname>--toc-spacer.padding</parmname></indexterm>
       <p>Bootstrap <xref href="./icons.dita" format="dita">icons</xref>,
         <xref href="./popovers.dita" format="dita">popovers</xref>,
         <xref href="./tooltips.dita" format="dita">tooltips</xref> and the <xref
@@ -482,6 +485,8 @@
         <li>
           <parmname>--bidi.include</parmname> – whether to force included support for
           <xref href="./rtl.dita" format="dita">RTL languages</xref></li>
+        <li>
+          <parmname>--toc-spacer.padding</parmname> – specifies the vertical padding to add to the side menu</li>
       </ul>
     </section>
   </body>