0 Replies Latest reply on Jun 1, 2019 9:16 PM by 3403781

    how to define multiple font-face into skin in ADF

    3403781

      Hello Oracle Community !

       

      i have multiple font face inside Skin as below, but it seems last font-face is defined "FontAwesome" and all the rest above font-face "DroidArabicKufiRegular and 'SF Pro Text" is not known in skin,

      so, is skin support multiple font-face, please advise ?

       

      @font-face {

          font-family: 'DroidArabicKufiRegular';

          src: url(../fonts/DroidKufi-Regular.eot);

          src: url(../fonts/DroidKufi-Regular.eot?#iefix)format('embedded-opentype'), url(../fonts/DroidKufi-Regular.woff2)format('woff2'), url(../fonts/DroidKufi-Regular.woff)format('woff'), url(../fonts/DroidKufi-Regular.ttf)format('truetype');

      }

       

      @font-face {

          font-family: 'SF Pro Text';

          font-style: normal;

          font-weight: 100;

          src: url("../fonts/sf-pro-text_ultralight.woff2")format("woff2"), url("../fonts/sf-pro-text_ultralight.woff")format("woff"), url("../fonts/sf-pro-text_ultralight.ttf")format("truetype");

      }

       

      @font-face {

          font-family: "FontAwesome";

          font-style: normal;

          font-weight: normal;

          src: url(../fonts/fa-regular-400.eot);

          src: url(../fonts/fa-regular-400.eot?#iefix)format("embedded-opentype"), url(../fonts/fa-regular-400.woff2)format("woff2"), url(../fonts/fa-regular-400.woff)format("woff"), url(../fonts/fa-regular-400.ttf)format("truetype"), url(../fonts/fa-regular-400.svg#fontawesome)format("svg")

      }

       

      @font-face {

          font-family: "FontAwesome";

          font-style: normal;

          font-weight: normal;

          src: url(../fonts/fa-brads-400.eot);

          src: url(../fonts/fa-brads-400.eot?#iefix)format("embedded-opentype"), url(../fonts/fa-brads-400.woff2)format("woff2"), url(../fonts/fa-brads-400.woff)format("woff"), url(../fonts/fa-brads-400.ttf)format("truetype"), url(../fonts/fa-brads-400.svg#fontawesome)format("svg")

      }

       

      @font-face {

          font-family: "FontAwesome";

          font-style: normal;

          font-weight: normal;

          src: url(../fonts/fa-solid-900.eot);

          src: url(../fonts/fa-solid-900.eot?#iefix)format("embedded-opentype"), url(../fonts/fa-solid-900.woff2)format("woff2"), url(../fonts/fa-solid-900.woff)format("woff"), url(../fonts/fa-solid-900.ttf)format("truetype"), url(../fonts/fa-solid-900.svg#fontawesome)format("svg")

      }

       

      and i use them as below

       

      .icon-time:before {

          font-family: 'FontAwesome';

          content: "\f017";

          font-size: 15px;

          color: #528cff;

          padding: 5px;

      }

       

      @locale en {

          .AFDefaultFontFamily:alias {

              font-family: 'SF Pro Text', sans-serif;

          }

      }

       

      @locale ar {

          .AFDefaultFontFamily:alias {

              font-family: 'DroidArabicKufiRegular', sans-serif;

          }

      }