Nav apraksta
Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

_Fabric.Typography.Fonts.scss 5.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
  2. //
  3. // Office UI Fabric
  4. // --------------------------------------------------
  5. // Font definitions
  6. // Font weights.
  7. $ms-light: "Segoe UI Light";
  8. $ms-regular: "Segoe UI Regular";
  9. $ms-semibold: "Segoe UI Semibold";
  10. $ms-semilight: "Segoe UI Semilight";
  11. // Font paths.
  12. $ms-font-directory: "https://appsforoffice.microsoft.com/fabric/fonts";
  13. $ms-font-path-arabic: "SegoeUI-Arabic";
  14. $ms-font-path-cyrillic: "SegoeUI-Cyrillic";
  15. $ms-font-path-easteuropean: "SegoeUI-EastEuropean";
  16. $ms-font-path-greek: "SegoeUI-Greek";
  17. $ms-font-path-hebrew: "SegoeUI-Hebrew";
  18. $ms-font-path-vietnamese: "SegoeUI-Vietnamese";
  19. $ms-font-path-westeuropean: "SegoeUI-WestEuropean";
  20. /*
  21. Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license
  22. */
  23. // Mixins to generate @font-face rules for unique languages.
  24. @mixin SegoeUILight($ms-font-language, $ms-font-path) {
  25. @font-face {
  26. font-family: "#{$ms-light} #{$ms-font-language}";
  27. src: local("Segoe UI Light"),
  28. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.woff2') format('woff2'),
  29. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.woff') format('woff'),
  30. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.ttf') format('truetype');
  31. font-weight: normal;
  32. font-style: normal;
  33. }
  34. }
  35. @mixin SegoeUIRegular($ms-font-language, $ms-font-path) {
  36. @font-face {
  37. font-family: "#{$ms-regular} #{$ms-font-language}";
  38. src: local("Segoe UI"),
  39. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.woff2') format('woff2'),
  40. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.woff') format('woff'),
  41. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.ttf') format('truetype');
  42. font-weight: normal;
  43. font-style: normal;
  44. }
  45. }
  46. @mixin SegoeUISemilight($ms-font-language, $ms-font-path) {
  47. @font-face {
  48. font-family: "#{$ms-semilight} #{$ms-font-language}";
  49. src: local("Segoe UI Semilight"),
  50. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.woff2') format('woff2'),
  51. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.woff') format('woff'),
  52. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.ttf') format('truetype');
  53. font-weight: normal;
  54. font-style: normal;
  55. }
  56. }
  57. @mixin SegoeUISemibold($ms-font-language, $ms-font-path) {
  58. @font-face {
  59. font-family: "#{$ms-semibold} #{$ms-font-language}";
  60. src: local("Segoe UI Semibold"),
  61. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.woff2') format('woff2'),
  62. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.woff') format('woff'),
  63. url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.ttf') format('truetype');
  64. font-weight: normal;
  65. font-style: normal;
  66. }
  67. }
  68. // Mixins to generate language-specific font faces.
  69. @mixin SegoeUIArabicLight {
  70. @include SegoeUILight("Arabic", $ms-font-path-arabic);
  71. }
  72. @mixin SegoeUIArabicRegular {
  73. @include SegoeUIRegular("Arabic", $ms-font-path-arabic);
  74. }
  75. @mixin SegoeUIArabicSemibold {
  76. @include SegoeUISemibold("Arabic", $ms-font-path-arabic);
  77. }
  78. @mixin SegoeUIArabicSemilight {
  79. @include SegoeUISemilight("Arabic", $ms-font-path-arabic);
  80. }
  81. @mixin SegoeUICyrillicLight {
  82. @include SegoeUILight("Cyrillic", $ms-font-path-cyrillic);
  83. }
  84. @mixin SegoeUICyrillicRegular {
  85. @include SegoeUIRegular("Cyrillic", $ms-font-path-cyrillic);
  86. }
  87. @mixin SegoeUICyrillicSemibold {
  88. @include SegoeUISemibold("Cyrillic", $ms-font-path-cyrillic);
  89. }
  90. @mixin SegoeUICyrillicSemilight {
  91. @include SegoeUISemilight("Cyrillic", $ms-font-path-cyrillic);
  92. }
  93. @mixin SegoeUIEastEuropeanLight {
  94. @include SegoeUILight("EastEuropean", $ms-font-path-easteuropean);
  95. }
  96. @mixin SegoeUIEastEuropeanRegular {
  97. @include SegoeUIRegular("EastEuropean", $ms-font-path-easteuropean);
  98. }
  99. @mixin SegoeUIEastEuropeanSemibold {
  100. @include SegoeUISemibold("EastEuropean", $ms-font-path-easteuropean);
  101. }
  102. @mixin SegoeUIEastEuropeanSemilight {
  103. @include SegoeUISemilight("EastEuropean", $ms-font-path-easteuropean);
  104. }
  105. @mixin SegoeUIGreekLight {
  106. @include SegoeUILight("Greek", $ms-font-path-greek);
  107. }
  108. @mixin SegoeUIGreekRegular {
  109. @include SegoeUIRegular("Greek", $ms-font-path-greek);
  110. }
  111. @mixin SegoeUIGreekSemibold {
  112. @include SegoeUISemibold("Greek", $ms-font-path-greek);
  113. }
  114. @mixin SegoeUIGreekSemilight {
  115. @include SegoeUISemilight("Greek", $ms-font-path-greek);
  116. }
  117. @mixin SegoeUIHebrewLight {
  118. @include SegoeUILight("Hebrew", $ms-font-path-hebrew);
  119. }
  120. @mixin SegoeUIHebrewRegular {
  121. @include SegoeUIRegular("Hebrew", $ms-font-path-hebrew);
  122. }
  123. @mixin SegoeUIHebrewSemibold {
  124. @include SegoeUISemibold("Hebrew", $ms-font-path-hebrew);
  125. }
  126. @mixin SegoeUIHebrewSemilight {
  127. @include SegoeUISemilight("Hebrew", $ms-font-path-hebrew);
  128. }
  129. @mixin SegoeUIVietnameseLight {
  130. @include SegoeUILight("Vietnamese", $ms-font-path-vietnamese);
  131. }
  132. @mixin SegoeUIVietnameseRegular {
  133. @include SegoeUIRegular("Vietnamese", $ms-font-path-vietnamese);
  134. }
  135. @mixin SegoeUIVietnameseSemibold {
  136. @include SegoeUISemibold("Vietnamese", $ms-font-path-vietnamese);
  137. }
  138. @mixin SegoeUIVietnameseSemilight {
  139. @include SegoeUISemilight("Vietnamese", $ms-font-path-vietnamese);
  140. }
  141. @mixin SegoeUIWestEuropeanLight {
  142. @include SegoeUILight("WestEuropean", $ms-font-path-westeuropean);
  143. }
  144. @mixin SegoeUIWestEuropeanRegular {
  145. @include SegoeUIRegular("WestEuropean", $ms-font-path-westeuropean);
  146. }
  147. @mixin SegoeUIWestEuropeanSemibold {
  148. @include SegoeUISemibold("WestEuropean", $ms-font-path-westeuropean);
  149. }
  150. @mixin SegoeUIWestEuropeanSemilight {
  151. @include SegoeUISemilight("WestEuropean", $ms-font-path-westeuropean);
  152. }