Notice: These forums are now retired and closed. For active support, please Submit a Ticket or visit our official WordPress.org community pages.
Kadence Theme | Kadence Blocks | Starter Templates | WooCommerce Email Designer | Ascend | Virtue | Pinnacle

Modifying the path of SVG row dividers

Home / Forums / Ascend Theme / Modifying the path of SVG row dividers

This topic is: Resolved
[Resolved]
Posted in: Ascend Theme
October 25, 2019 at 7:36 am

Hi there
I’m using the 3rd row divider in the drop down list, where there’s a solid component overlaying a semi-transparent component. I’m trying to change the height of the solid part by adding this script to the header in theme options:

<script>document.body.onload=function(){document.getElementsByClassName(“kt-row-layout-bottom-sep”).getElementsByTagName(“path”)[1].setAttribute(“d”, “M 1000 0 l -500 50 l -500 -50 l 0 50 l 1000 0 l 0 -50 Z”)};</script>

Any advice on how to do it as my javascript isn’t working at all? Here’s the html I’m trying to target (it’s the 2nd path I’m trying to change):

<div class=”kt-row-layout-bottom-sep kt-row-sep-type-ctd”>
<svg style=”fill:#57bb5f” viewbox=”0 0 1000 100″ preserveaspectratio=”none”>
<path d=”M1000,0l-500,98l-500,-98l0,100l1000,0l0,-100Z” style=”opacity:0.4″></path>
<path d=”M1000,20l-500,78l-500,-78l0,80l1000,0l0,-80Z”></path>
</svg>
</div>

  • The forum ‘Ascend Theme’ is closed to new topics and replies.