starryeyez024

// ----
// libsass (v3.5.4)
// ----

// redhat-theme
:root {
  --foo: 20px;
}

$padding: var( --foo);

starryeyez024

<div class"wrapper">
  
 <div class="box red--tint-1">
   <h1 class="pfe-headline-3">red--tint-1 </h1>
 </div>
 <div class="box red">
   <h1 class="pfe-headline-3">red </h1>
 </div>
 <div class="box red--shade-3">
   <h1 class="pfe-headline-3">red--shade-3 </h1>

starryeyez024

// ----
// Sass (vundefined)
// Compass (vundefined)
// ----

$repo: pfe;

$pfe-vars: (
  container-spacer:              16px,
  container-padding:             16px,

starryeyez024

// ----
// libsass (v3.5.4)
// ----

@function to-string($value) {
  @return inspect($value);
}

@function var-factory($var, $lib: "theme", $type: "color", $repo: "pfe") {
    //  structure: --repo-lib--type--var

starryeyez024

<br/>

<div class="blue">
 blue
</div>

<div class="test-var">
 blue?
</div>
<div class="test-rgba-var">

starryeyez024

<br/>
<p>
  <a>regular link</a>
</p>
<div class="">
  <a>no class</a>
</div>
<div class="primary">
  <a>primary</a>
</div>

starryeyez024

<br/>
<div class="test">
  code
</div>

starryeyez024

<br/>
<div style="width:312px;background:#eee">

<div class="cta">
<a href="#">hello world fsda fdsa dsaf dsa</a>
</div>

</div>

starryeyez024

<br/>
<p class="lighter">
  hello
</p>
<p class="normal">
  hello
</p>
<p class="bold">
  hello
</p>

starryeyez024

<div class="container">
  <nav id="utility-nav">
        <div class="item-list"><ul><li id="utility-search" class="switch first" title="Search"><a href="/en/search" class="expand" onclick="return false;">Search</a></li>
<li id="utility-account" class="switch" title="Accounts"><a href="https://sso.qa.redhat.com/auth/realms/redhat-external/protocol/saml/clients/legacy-idp-servlets" class="expand" onclick="return false;">Log in</a></li>
<li id="utility-globe" class="switch last" title="Global Preferences"><a href="/en/about/global" class="expand" onclick="return false;">English</a></li>
</ul></div>      </nav>
</div>

<div class="container">
        <div class="logo-mobile-wrap">