Lihat sumber Templat:KOM300/old

<div class="container-fluid col-md-4 col-sm-6 col-xs-12 mb-3" style="float:right; padding: 0 0 0 0em; margin: 0 0 .5em 1em; border: 2px PaleVioletRed solid; border-radius: .5em;">
<div style="padding: .5em 1em .5em 1em;">
[[Berkas:Logo KOM.png|center|link=Kehidupan Orientasi Melayani|class=img-responsive img-fluid]]
</div>
<div style="background: PaleVioletRed; padding: .25em; text-align: center; margin:0;" class="lead">[[KOM 300|<span class="text-white">'''KOM Seri 300<br />Prajurit Tuhan'''</span>]]</div>

<div class="accordion" id="accordionExample">

<div class="card"> <!--- KOM 310 ----------------------------------------------------------->
<div class="card-header pt-2 mt-0" id="headingOne">
<p class="h2 mb-0">
<span class="btn btn-link collapsed center m-0 p-0" type="button" data-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
KOM 310
{{KOM300/310/Title}}
</span>
</p>
</div>
<div id="collapseOne" class="collapse {{#ifeq:{{{KOM310|}}}|yes|show|}}" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body p-0 pt-3 pe-2" style="font-size: smaller;">
{{KOM300/310}}
</div>
</div>
</div>

<div class="card"> <!--- KOM 320 ----------------------------------------------------------->
<div class="card-header pt-2 mt-0" id="headingTwo">
<p class="h2 mb-0">
<span class="btn btn-link collapsed center m-0 p-0" type="button" data-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
KOM 320
{{KOM300/320/Title}}
</span>
</p>
</div>
<div id="collapseTwo" class="collapse {{#ifeq:{{{KOM320|}}}|yes|show|}}" aria-labelledby="headingTwo" data-parent="#accordionExample">
<div class="card-body p-0 pt-3 pe-2" style="font-size: smaller;">
{{KOM300/320}}
</div>
</div>
</div>

<div class="card"> <!--- KOM 330 ----------------------------------------------------------->
<div class="card-header pt-2 mt-0" id="headingThree">
<p class="h2 mb-0">
<span class="btn btn-link collapsed center m-0 p-0" type="button" data-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
KOM 330
{{KOM300/330/Title}}</span>
</p>
</div>
<div id="collapseThree" class="collapse{{#ifeq:{{{KOM330|}}}|yes|show|}}" aria-labelledby="headingThree" data-parent="#accordionExample">
<div class="card-body p-0 pt-3 pe-2" style="font-size: smaller;">
{{KOM300/330}}
</div>
</div>
</div>

<div class="card"> <!--- KOM 340 ---------------------------------------------------------->
<div class="card-header pt-2 mt-0" id="headingFour">
<p class="h2 mb-0">
<span class="btn btn-link collapsed center m-0 p-0" type="button" data-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
KOM 340
{{KOM300/340/Title}}
</span>
</p>
</div>
<div id="collapseFour" class="collapse{{#ifeq:{{{KOM340|}}}|yes|show|}}" aria-labelledby="headingFour" data-parent="#accordionExample">
<div class="card-body p-0 pt-3 pe-2" style="font-size: smaller;">
{{KOM300/340}}
</div>
</div>
</div>

<div class="card"> <!--- KOM 350 ----------------------------------------------------------->
<div class="card-header pt-2 mt-0" id="headingFive">
<p class="h2 mb-0">
<span class="btn btn-link collapsed center m-0 p-0" type="button" data-toggle="collapse" data-bs-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
KOM 350
{{KOM300/350/Title}}
</span>
</p>
</div>
<div id="collapseFive" class="collapse{{#ifeq:{{{KOM350|}}}|yes|show|}}" aria-labelledby="headingFive" data-parent="#accordionExample">
<div class="card-body p-0 pt-3 pe-2" style="font-size: smaller;">
{{KOM300/350}}
</div>
</div>
</div>

</div> <!-- accordion -->

</div> <!-- container -->