TypoOlivero

By CS Coleman, 28 December, 2024

A typographical layout of text and paragraph simply using font-family "Times New Roman",  for testing a few standard layouts. (Don't forget the enclosing quotation marks!) Now comes bold styling, along with a few simple tweaks to the WYSIWYG text editor (CK5).

Now, let's look at small, which is the <small> tag, and see where the styles are at with that;  So, for example, let's make the following text, starting from here, small, in other words!.

For achieving a hyper-link style with NO text-decoration as the objective,  the Olivero theme didn't allow  the custom new CSS styles to display properly (ie, no underlines and no highlighting,etc.), however, testing the same new styles in Bootstrap theme is working OK. This could be a good thing;  as in it's time to start ditching Olivero (or switching themes via routing). Here's an example working active link that should have no underlines or highlighting (hover) behaviour:

EXAMPLE: ckELINK

So since it's workingclass .scriplink ???  Next, can we style simple links with NO text-decoration, as applied from external CSS stylesheet? Ie, this means that the style tag we removed earlier (style="text-decoration:none !important;" previously hard-coded 'inline' here, will no longer be needed...).

ckELINK

Here so far, a  p class ="success" is NOT WORKING.  (NO must belong to LESS functions...) Means, somehow I'm floating somewhere between the realm(s) of pure CSS versus the LESS conventions!

This is normal text, and then some small text, for example using that particular tag (Now, it turns out we can override it (that is, the bootstrap min css rule, ie) in our current main working css file, by invoking the  !important tag ! (Who knew ???)

PrettyPrint

  1. code
  2. code some more
  3. code again 
  4. re code again 

BOOTSTRAP 

Font Awesome(Use SPAN instead of 'i' getting striped out by the Editor. Example:

<span class="fa fa-info-circle fa-3x">SomeTextHERE<span>.

  • Crispy. The breading was our favorite– just the way I like it!
  • Simple steps.A cinch and is similar to a shake and bake
  • Better than the rest. Texture and flavor better than KFC! Just add some sides...
  1. Crispy. The breading was our favorite– just the way I like it!
  2. Simple steps.A cinch and is similar to a shake and bake
  3. Better than the rest. Texture and flavor better than KFC! Just add some sides...
  1. Crispy. The breading was our favorite– just the way I like it!
  2. Simple steps.A cinch and is similar to a shake and bake
  3. Better than the rest. Texture and flavor better than KFC! Just add some sides...

TYPOGRAPHY

This crispy, juicy paragraph is being styled with a few basic defaults for type fonts, and MY strong looks like this. (b is the same for now; fix LATER). 

h1 TYPOGRAPHY h1

h2 TYPOGRAPHY h2

h3 DROPCAP h3

Dpropcaps in typographic scale, are well known, along with additional CSS styles, implementing the LESS variables, and are typically located in files such as variables.less.   

Other tags are easily recognizable,such as <code>, which should look like:

@baseFontSize and @baseLineHeight
 

The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.

BLOCKQUOTE(s)

I was made to realize that I am responsible for letting the world know about my work. It is up to them to interact with it; if I do not share it, if I don’t put it out there, then no one even has a choice of whether or not they want to read it.

LOGOSTYLES

mamaROSE

Ad SPACE Bundle

WHATZ ID?1

WHATZ ID?2

WHATZ ID?3

WHATZ ID?6

MaxSlider Paragraph New Spec

82
83
84
85
86
87
88