resources/scss/common/_typography.scss

   1 /**
   2  * ============LICENSE_START=======================================================
   3  * org.onap.aai
   4  * ================================================================================
   5  * Copyright © 2017 AT&T Intellectual Property. All rights reserved.
   6  * Copyright © 2017 Amdocs
   7  * ================================================================================
   8  * Licensed under the Apache License, Version 2.0 (the "License");
   9  * you may not use this file except in compliance with the License.
  10  * You may obtain a copy of the License at
  11  *
  12  *       http://www.apache.org/licenses/LICENSE-2.0
  13  *
  14  * Unless required by applicable law or agreed to in writing, software
  15  * distributed under the License is distributed on an "AS IS" BASIS,
  16  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  17  * See the License for the specific language governing permissions and
  18  * limitations under the License.
  19  * ============LICENSE_END=========================================================
  20  *
  21  * ECOMP is a trademark and service mark of AT&T Intellectual Property.
  22  */
  23
  24 $base-font-regular: "Arial";
  25 $base-font-light: "Arial";
  26 $base-font-medium: "Arial";
  27 $base-font-bold: "Arial";
  28
  29 $heading-font-1: 24px;
  30 $heading-font-2: 20px;
  31 $heading-font-3: 18px;
  32 $heading-font-4: 16px;
  33
  34 $body-font-1: 16px;
  35 $body-font-2: 14px;
  36 $body-font-3: 13px;
  37 $body-font-4: 12px;
  38
  39 $focus-font-1: 55px;
  40 $focus-font-2: 50px;
  41 $focus-font-3: 45px;
  42 $focus-font-4: 40px;
  43
  44 .heading-1 {
  45   font-family: $base-font-light;
  46   font-size: $heading-font-1;
  47 }
  48
  49 .heading-2 {
  50   font-family: $base-font-light;
  51   font-size: $heading-font-2;
  52 }
  53
  54 .heading-3 {
  55   font-family: $base-font-regular;
  56   font-size: $heading-font-3;
  57 }
  58
  59 .heading-3-medium {
  60   font-family: $base-font-medium;
  61   font-size: $heading-font-3;
  62 }
  63
  64 .heading-4 {
  65   font-family: $base-font-regular;
  66   font-size: $heading-font-4;
  67 }
  68
  69 .heading-4-medium {
  70   font-family: $base-font-medium;
  71   font-size: $heading-font-4;
  72 }
  73
  74 .body-1 {
  75   font-family: $base-font-regular;
  76   font-size: $body-font-1;
  77 }
  78
  79 .body-1-medium {
  80   font-family: $base-font-medium;
  81   font-size: $body-font-1;
  82 }
  83
  84 .body-2 {
  85   font-family: $base-font-regular;
  86   font-size: $body-font-2;
  87 }
  88
  89 .body-2-medium {
  90   font-family: $base-font-medium;
  91   font-size: $body-font-2;
  92 }
  93
  94 .body-3 {
  95   font-family: $base-font-regular;
  96   font-size: $body-font-3;
  97 }
  98
  99 .body-3-medium {
 100   font-family: $base-font-medium;
 101   font-size: $body-font-3;
 102 }
 103