What css to use to replicate Cardinal headings?

[FlawlessWeb]

Hey,

Usage scenario – you are using an external plugin that outputs headings. You want these headings to take on the same css as Cardinals 3 different heading styles depending upon which you have chosen; i.e. bold, bright or minimal (see attached).

So lets say the heading style you want to style is using .sampleclass for all its headings.

What CSS styles for each design style in Cardinal would I apply to .sampleclass?

Thanks.

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

For which style? It depends on the structure of html

– Kyle

[FlawlessWeb]

For each style:

So for bold style, use the following:

.sampleclass {

Code to replicate Cardinals bold heading style

}

etc…

[Kyle – SUPPORT]

I’m afraid it’s not that simple, the css for the headings depends on the structure of html (which is different in each design style) and also the css is applied to different divs, not just the headings. It would take over half an hour for me inspect the code to provide you with all the css for each design style.

If you are using a certain design style I’ll have a look and see what I can do

– Kyle

[FlawlessWeb]

This reply has been marked as private.

[Kyle – SUPPORT]

Try this:

.faq-section-title, .sp-table-caption {
  font-family: "Roboto";
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 30px;
  text-transform: uppercase;
  padding-bottom: 20px;
}
.faq-section-title:after, .sp-table-caption:after {
  bottom: 0;
  color: #111111;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 50px;
  background: #222222;
}

– Kyle

[FlawlessWeb]

This reply has been marked as private.

[Kyle – SUPPORT]

Add this:

position: relative;

to

.faq-section-title, .sp-table-caption {
  font-family: "Roboto";
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 30px;
  text-transform: uppercase;
  padding-bottom: 20px;
}

– Kyle

[FlawlessWeb]

That did the trick 🙂

Thanks Kyle.

[Kyle – SUPPORT]

No problem

– Kyle