openecomp-ui/resources/scss/common/_typography.scss

   1 /* Fonts */
   2 @font-face {
   3   font-family: Omnes-Light;
   4   src: url('../fonts/omnes-att-light.otf');
   5 }
   6
   7 @font-face {
   8   font-family: Omnes-Regular;
   9   src: url('../fonts/omnes-att-regular.otf');
  10 }
  11
  12 @font-face {
  13   font-family: Omnes-Medium;
  14   src: url('../fonts/omnes-att-medium.otf');
  15 }
  16
  17 @font-face {
  18   font-family: Omnes-Bold;
  19   src: url('../fonts/omnes-att-bold.otf');
  20 }
  21
  22 $base-font-regular: omnes-regular, "Omnes-Regular";
  23 $base-font-light: omnes-light, "Omnes-Light";
  24 $base-font-medium: omnes-medium, "Omnes-Medium";
  25 $base-font-bold: omnes-bold, "Omnes-Bold";
  26
  27 $heading-font-1: 36px;
  28 $heading-font-2: 24px;
  29 $heading-font-3: 20px;
  30 $heading-font-4: 18px;
  31 $heading-font-5: 16px;
  32
  33 $body-font-1: 14px;
  34 $body-font-2: 13px;
  35 $body-font-3: 12px;
  36
  37 $icon-font-size: 10px;
  38 $icon-font-family: FontAwesome;
  39 $radio-font-family: Arial;
  40
  41 .heading-1 {
  42   font-family: $base-font-light;
  43   font-size: $heading-font-1;
  44 }
  45
  46 .heading-2 {
  47   font-family: $base-font-light;
  48   font-size: $heading-font-2;
  49 }
  50
  51 .heading-3-light {
  52   font-family: $base-font-light;
  53   font-size: $heading-font-3;
  54 }
  55
  56 .heading-3 {
  57   font-family: $base-font-regular;
  58   font-size: $heading-font-3;
  59 }
  60
  61 .heading-3-medium {
  62   font-family: $base-font-medium;
  63   font-size: $heading-font-3;
  64 }
  65
  66 .heading-4 {
  67   font-family: $base-font-regular;
  68   font-size: $heading-font-4;
  69 }
  70
  71 .heading-4-medium {
  72   font-family: $base-font-medium;
  73   font-size: $heading-font-4;
  74 }
  75
  76 .heading-5 {
  77   font-family: $base-font-regular;
  78   font-size: $heading-font-5;
  79 }
  80
  81 .heading-5-medium {
  82   font-family: $base-font-medium;
  83   font-size: $heading-font-5;
  84 }
  85
  86 .body-1 {
  87   font-family: $base-font-regular;
  88   font-size: $body-font-1;
  89 }
  90
  91 .body-1-medium {
  92   font-family: $base-font-medium;
  93   font-size: $body-font-1;
  94 }
  95
  96 .body-2 {
  97   font-family: $base-font-regular;
  98   font-size: $body-font-2;
  99 }
 100
 101 .body-2-medium {
 102   font-family: $base-font-medium;
 103   font-size: $body-font-2;
 104 }
 105
 106 .body-3 {
 107   font-family: $base-font-regular;
 108   font-size: $body-font-3;
 109 }
 110
 111 .body-3-medium {
 112   font-family: $base-font-medium;
 113   font-size: $body-font-3;
 114 }
 115