Base solution for your next web application
Open Closed

Metronic Style Question #6728

User avatar
0
jaycee26 created

Hi,

I am using v6.8 Angular/Core.

The template includes Metronic theme (I understand v5), however there are amny styles in Metronic that are not in the ASP.NET Zero template. For example. I want to use the 'kt-section' styles which are shown in the Metronic 5 preview ([https://keenthemes.com/metronic/preview/?page=components/base/typography&demo=default]

This displays as follows:

In the relevant source the HTML from the above Metronic preview page is:

<div class="kt-section">
                    <span class="kt-section__info">
						All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code>, are available.
					</span>
                    <div class="kt-section__content kt-section__content--solid">
                        <div class="row">
                            <div class="col-md-6">
                                <h1>h1. Heading 1</h1>
                                <div class="kt-space-10"></div>
                                <h2>h2. Heading 2</h2>
                                <div class="kt-space-10"></div>
                                <h3>h3. Heading 3</h3>
                                <div class="kt-space-10"></div>
                                <h4>h4. Heading 4</h4>
                                <div class="kt-space-10"></div>
                                <h5>h5. Heading 5</h5>
                                <div class="kt-space-10"></div>
                                <h6>h6. Heading 6</h6>
                            </div>
                            <div class="col-md-6">
                                <h1 class="kt-font-success">h1. Heading 1</h1>
                                <div class="kt-space-10"></div>
                                <h2 class="kt-font-info">h2. Heading 2</h2>
                                <div class="kt-space-10"></div>
                                <h3 class="kt-font-warning">h3. Heading 3</h3>
                                <div class="kt-space-10"></div>
                                <h4 class="kt-font-danger">h4. Heading 4</h4>
                                <div class="kt-space-10"></div>
                                <h5 class="kt-font-primary">h5. Heading 5</h5>
                                <div class="kt-space-10"></div>
                                <h6 class="kt-font-brand">h6. Heading 6</h6>
                            </div>
                        </div>

                    </div>
                </div>

Yet all these 'kt*' classes are not present in the ASPNET Zero CSS's so can not be used.

1). Am I missing or missunderstanding something here? 2). If they are not included, how can they be included (I have a seperate metronic license).

Thanks

Go to accepted answer
2 Answer(s)
  • User Avatar
    0
    ismcagdas created
    Support Team

    Hi,

    The online demo of Metronic is updated, it is Metronic v6 but currently AspNet Zero uses v5.x of Metronic. So, for now, instead of you should use "m--font-success" instead of "kt-font-success".

    Basically you need to replace "kt-" with "m--" in the styles.

  • User Avatar
    0
    jaycee26 created

    That works, thanks @ismcagdas!

    I also see on GitHub that upgrading to Metronic v6 is a possibly scheduled as an ASPNET Zero v7 upgrade.

    Thank you.

Assignee
No one
Labels
Non yet