Theme Features

This blogger provided essential theme is customized for achieving 90+ Score on mobile devices and 98+ Score on Desktops in Google Page Insight Lighthouse test with following features.

Buttons

Normal Buttons Preview

Default Preview Download Link Cart Info

Normal Buttons HTML Code

  <a class="button btn" href="#">Default</a>
  <a class="button btn preview" href="#">Preview</a>
  <a class="button btn download" href="#">Download</a>
  <a class="button btn link" href="#">Link</a>
  <a class="button btn cart" href="#">Cart</a>
  <a class="button btn share" href="#">Share</a>
  <a class="button btn info" href="#">Info</a>

Coroled Buttons Preview

Default Preview Download Link Cart Info

Colored Buttons HTML Code

  <a class="button btn colored-button" href="#" style="background-color: #31c0a7;">Default</a>
  <a class="button btn preview colored-button" href="#" style="background-color: #52c807;">Preview</a>
  <a class="button btn download colored-button" href="#" style="background-color: #959853;">Download</a>
  <a class="button btn link colored-button" href="#" style="background-color: #123654;">Link</a>
  <a class="button btn cart colored-button" href="#" style="background-color: #959a32;">Cart</a>
  <a class="button btn share colored-button" href="#" style="background-color: #659242;">Share</a>
  <a class="button btn info colored-button" href="#" style="background-color: #365942;">Info</a>

Alerts

Alert Info

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

HTML with Classes to be used for Alert Info

<div class="alert-message alert-info">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
  when an unknown printer took a galley of type and scrambled it to make a type
  specimen book.
</div>

Alert Success

HTML with Classes to be used for Alert Success

<div class="alert-message alert-success">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
  when an unknown printer took a galley of type and scrambled it to make a type
  specimen book.
</div>

Alert Warning

HTML with Classes to be used for Alert Warning

<div class="alert-message alert-warning">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
  when an unknown printer took a galley of type and scrambled it to make a type
  specimen book.
</div>

Alert Error

HTML with Classes to be used for Alert Error

<div class="alert-message alert-error">
  Lorem Ipsum is simply dummy text of the printing and typesetting industry.
  Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
  when an unknown printer took a galley of type and scrambled it to make a type
  specimen book.
</div>

Code Box

def add(x, y):
  return x + y

HTML with Classes to be used for Code Box

<pre class="code-box">
  def add(x, y):
    return x + y
</pre>

Simple Table

Firstname	Lastname	Email	Firstname	Lastname	Email
John	Doe	john@example.com	John	Doe	john@example.com
Mary	Moe	mary@example.com	John	Doe	john@example.com
July	Dooley	july@example.com	John	Doe	john@example.com