Search code examples
cssasp.net-mvchtmlnopcommercerazorengine

Implementing Admin Layout NopCommerce?

I'v made some charts using Google Charts Api that i want to display in NopCommerce Amin Panel. However i want to follow the existing layout but it dosn't work for me. Tried using tables, tr's td's, changing class on different tags but none of this works.

How would i go about displaying my charts with default admin layout?

This is what i want to display, just 4 simple divs:

<div id="chart_div1" style="width: 900px; height: 500px;">
    </div>

<div id="chart_div2" style="width: 900px; height: 500px;">
    </div>

<div id="chart_div3" style="width: 900px; height: 500px;">
    </div>

<div id="chart_div4" style="width: 900px; height: 500px;">
    </div>

The admin panel is showing it's just that i want the same coloured tables around my charts. This is what it looks like now:

enter image description here

Thx

Solution

  • The central tables used in nopcommerce admin area are built with telerik controls.

    Direct control over their editing is very limited.

    Your best bet would be to imitate the tables styles in your own admin stylesheet to create the appearance of tables that look like the telerik theme.

    DUPLICATE TELERIK STYLES

    If you are using the default theme as you image indicates you can open:

    \Content\2013.2.611\telerik.default.min.css

    Copy the table styles you desire into your admin styles.css

    \Administration\Content\styles.css

    Any tables you add to the admin area will then look the same as the telerik grid.