@sage/design-tokens 14.8.0 → 14.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (474) hide show
  1. package/css/frozenproduct/all.css +14 -10
  2. package/css/frozenproduct/large/components/container.css +5 -2
  3. package/css/frozenproduct/large/components/nav.css +6 -4
  4. package/css/frozenproduct/large/components/page.css +4 -0
  5. package/css/frozenproduct/large/global.css +10 -6
  6. package/css/frozenproduct/small/components/container.css +5 -2
  7. package/css/frozenproduct/small/components/nav.css +6 -4
  8. package/css/frozenproduct/small/components/page.css +4 -0
  9. package/css/frozenproduct/small/global.css +4 -0
  10. package/css/marketing/all.css +13 -6
  11. package/css/marketing/large/components/container.css +5 -2
  12. package/css/marketing/large/components/nav.css +6 -4
  13. package/css/marketing/large/components/page.css +4 -0
  14. package/css/marketing/large/global.css +10 -6
  15. package/css/marketing/small/components/container.css +5 -2
  16. package/css/marketing/small/components/nav.css +6 -4
  17. package/css/marketing/small/components/page.css +4 -0
  18. package/css/marketing/small/global.css +4 -0
  19. package/css/product/all.css +13 -6
  20. package/css/product/large/components/container.css +5 -2
  21. package/css/product/large/components/nav.css +6 -4
  22. package/css/product/large/components/page.css +4 -0
  23. package/css/product/large/global.css +10 -6
  24. package/css/product/small/components/container.css +5 -2
  25. package/css/product/small/components/nav.css +6 -4
  26. package/css/product/small/components/page.css +4 -0
  27. package/css/product/small/global.css +4 -0
  28. package/ios/frozenproduct/large/dark/components/container.h +5 -2
  29. package/ios/frozenproduct/large/dark/components/nav.h +2 -0
  30. package/ios/frozenproduct/large/dark/components/page.h +4 -0
  31. package/ios/frozenproduct/large/global.h +6 -2
  32. package/ios/frozenproduct/large/light/components/container.h +5 -2
  33. package/ios/frozenproduct/large/light/components/nav.h +2 -0
  34. package/ios/frozenproduct/large/light/components/page.h +4 -0
  35. package/ios/frozenproduct/small/dark/components/container.h +5 -2
  36. package/ios/frozenproduct/small/dark/components/nav.h +2 -0
  37. package/ios/frozenproduct/small/dark/components/page.h +4 -0
  38. package/ios/frozenproduct/small/global.h +4 -0
  39. package/ios/frozenproduct/small/light/components/container.h +5 -2
  40. package/ios/frozenproduct/small/light/components/nav.h +2 -0
  41. package/ios/frozenproduct/small/light/components/page.h +4 -0
  42. package/ios/marketing/large/dark/components/container.h +5 -2
  43. package/ios/marketing/large/dark/components/nav.h +2 -0
  44. package/ios/marketing/large/dark/components/page.h +4 -0
  45. package/ios/marketing/large/global.h +6 -2
  46. package/ios/marketing/large/light/components/container.h +5 -2
  47. package/ios/marketing/large/light/components/nav.h +2 -0
  48. package/ios/marketing/large/light/components/page.h +4 -0
  49. package/ios/marketing/small/dark/components/container.h +5 -2
  50. package/ios/marketing/small/dark/components/nav.h +2 -0
  51. package/ios/marketing/small/dark/components/page.h +4 -0
  52. package/ios/marketing/small/global.h +4 -0
  53. package/ios/marketing/small/light/components/container.h +5 -2
  54. package/ios/marketing/small/light/components/nav.h +2 -0
  55. package/ios/marketing/small/light/components/page.h +4 -0
  56. package/ios/product/large/dark/components/container.h +5 -2
  57. package/ios/product/large/dark/components/nav.h +2 -0
  58. package/ios/product/large/dark/components/page.h +4 -0
  59. package/ios/product/large/global.h +6 -2
  60. package/ios/product/large/light/components/container.h +5 -2
  61. package/ios/product/large/light/components/nav.h +2 -0
  62. package/ios/product/large/light/components/page.h +4 -0
  63. package/ios/product/small/dark/components/container.h +5 -2
  64. package/ios/product/small/dark/components/nav.h +2 -0
  65. package/ios/product/small/dark/components/page.h +4 -0
  66. package/ios/product/small/global.h +4 -0
  67. package/ios/product/small/light/components/container.h +5 -2
  68. package/ios/product/small/light/components/nav.h +2 -0
  69. package/ios/product/small/light/components/page.h +4 -0
  70. package/js/common/frozenproduct/large/dark/components/badge.js +1 -1
  71. package/js/common/frozenproduct/large/dark/components/container.d.ts +5 -0
  72. package/js/common/frozenproduct/large/dark/components/container.js +45 -4
  73. package/js/common/frozenproduct/large/dark/components/nav.d.ts +6 -0
  74. package/js/common/frozenproduct/large/dark/components/nav.js +42 -8
  75. package/js/common/frozenproduct/large/dark/components/page.d.ts +12 -0
  76. package/js/common/frozenproduct/large/dark/components/page.js +108 -0
  77. package/js/common/frozenproduct/large/dark/components/profile.js +1 -1
  78. package/js/common/frozenproduct/large/global.d.ts +12 -0
  79. package/js/common/frozenproduct/large/global.js +136 -8
  80. package/js/common/frozenproduct/large/light/components/badge.js +1 -1
  81. package/js/common/frozenproduct/large/light/components/container.d.ts +5 -0
  82. package/js/common/frozenproduct/large/light/components/container.js +45 -4
  83. package/js/common/frozenproduct/large/light/components/nav.d.ts +6 -0
  84. package/js/common/frozenproduct/large/light/components/nav.js +42 -8
  85. package/js/common/frozenproduct/large/light/components/page.d.ts +12 -0
  86. package/js/common/frozenproduct/large/light/components/page.js +108 -0
  87. package/js/common/frozenproduct/large/light/components/profile.js +1 -1
  88. package/js/common/frozenproduct/small/dark/components/container.d.ts +5 -0
  89. package/js/common/frozenproduct/small/dark/components/container.js +45 -4
  90. package/js/common/frozenproduct/small/dark/components/nav.d.ts +6 -0
  91. package/js/common/frozenproduct/small/dark/components/nav.js +42 -8
  92. package/js/common/frozenproduct/small/dark/components/page.d.ts +12 -0
  93. package/js/common/frozenproduct/small/dark/components/page.js +108 -0
  94. package/js/common/frozenproduct/small/global.d.ts +12 -0
  95. package/js/common/frozenproduct/small/global.js +128 -0
  96. package/js/common/frozenproduct/small/light/components/container.d.ts +5 -0
  97. package/js/common/frozenproduct/small/light/components/container.js +45 -4
  98. package/js/common/frozenproduct/small/light/components/nav.d.ts +6 -0
  99. package/js/common/frozenproduct/small/light/components/nav.js +42 -8
  100. package/js/common/frozenproduct/small/light/components/page.d.ts +12 -0
  101. package/js/common/frozenproduct/small/light/components/page.js +108 -0
  102. package/js/common/marketing/large/dark/components/badge.js +1 -1
  103. package/js/common/marketing/large/dark/components/container.d.ts +5 -0
  104. package/js/common/marketing/large/dark/components/container.js +45 -4
  105. package/js/common/marketing/large/dark/components/nav.d.ts +6 -0
  106. package/js/common/marketing/large/dark/components/nav.js +42 -8
  107. package/js/common/marketing/large/dark/components/page.d.ts +12 -0
  108. package/js/common/marketing/large/dark/components/page.js +108 -0
  109. package/js/common/marketing/large/dark/components/profile.js +1 -1
  110. package/js/common/marketing/large/global.d.ts +12 -0
  111. package/js/common/marketing/large/global.js +136 -8
  112. package/js/common/marketing/large/light/components/badge.js +1 -1
  113. package/js/common/marketing/large/light/components/container.d.ts +5 -0
  114. package/js/common/marketing/large/light/components/container.js +45 -4
  115. package/js/common/marketing/large/light/components/nav.d.ts +6 -0
  116. package/js/common/marketing/large/light/components/nav.js +42 -8
  117. package/js/common/marketing/large/light/components/page.d.ts +12 -0
  118. package/js/common/marketing/large/light/components/page.js +108 -0
  119. package/js/common/marketing/large/light/components/profile.js +1 -1
  120. package/js/common/marketing/small/dark/components/container.d.ts +5 -0
  121. package/js/common/marketing/small/dark/components/container.js +45 -4
  122. package/js/common/marketing/small/dark/components/nav.d.ts +6 -0
  123. package/js/common/marketing/small/dark/components/nav.js +42 -8
  124. package/js/common/marketing/small/dark/components/page.d.ts +12 -0
  125. package/js/common/marketing/small/dark/components/page.js +108 -0
  126. package/js/common/marketing/small/global.d.ts +12 -0
  127. package/js/common/marketing/small/global.js +128 -0
  128. package/js/common/marketing/small/light/components/container.d.ts +5 -0
  129. package/js/common/marketing/small/light/components/container.js +45 -4
  130. package/js/common/marketing/small/light/components/nav.d.ts +6 -0
  131. package/js/common/marketing/small/light/components/nav.js +42 -8
  132. package/js/common/marketing/small/light/components/page.d.ts +12 -0
  133. package/js/common/marketing/small/light/components/page.js +108 -0
  134. package/js/common/product/large/dark/components/badge.js +1 -1
  135. package/js/common/product/large/dark/components/container.d.ts +5 -0
  136. package/js/common/product/large/dark/components/container.js +45 -4
  137. package/js/common/product/large/dark/components/nav.d.ts +6 -0
  138. package/js/common/product/large/dark/components/nav.js +42 -8
  139. package/js/common/product/large/dark/components/page.d.ts +12 -0
  140. package/js/common/product/large/dark/components/page.js +108 -0
  141. package/js/common/product/large/dark/components/profile.js +1 -1
  142. package/js/common/product/large/global.d.ts +12 -0
  143. package/js/common/product/large/global.js +136 -8
  144. package/js/common/product/large/light/components/badge.js +1 -1
  145. package/js/common/product/large/light/components/container.d.ts +5 -0
  146. package/js/common/product/large/light/components/container.js +45 -4
  147. package/js/common/product/large/light/components/nav.d.ts +6 -0
  148. package/js/common/product/large/light/components/nav.js +42 -8
  149. package/js/common/product/large/light/components/page.d.ts +12 -0
  150. package/js/common/product/large/light/components/page.js +108 -0
  151. package/js/common/product/large/light/components/profile.js +1 -1
  152. package/js/common/product/small/dark/components/container.d.ts +5 -0
  153. package/js/common/product/small/dark/components/container.js +45 -4
  154. package/js/common/product/small/dark/components/nav.d.ts +6 -0
  155. package/js/common/product/small/dark/components/nav.js +42 -8
  156. package/js/common/product/small/dark/components/page.d.ts +12 -0
  157. package/js/common/product/small/dark/components/page.js +108 -0
  158. package/js/common/product/small/global.d.ts +12 -0
  159. package/js/common/product/small/global.js +128 -0
  160. package/js/common/product/small/light/components/container.d.ts +5 -0
  161. package/js/common/product/small/light/components/container.js +45 -4
  162. package/js/common/product/small/light/components/nav.d.ts +6 -0
  163. package/js/common/product/small/light/components/nav.js +42 -8
  164. package/js/common/product/small/light/components/page.d.ts +12 -0
  165. package/js/common/product/small/light/components/page.js +108 -0
  166. package/js/es6/frozenproduct/large/dark/components/badge.js +1 -1
  167. package/js/es6/frozenproduct/large/dark/components/container.d.ts +3 -0
  168. package/js/es6/frozenproduct/large/dark/components/container.js +5 -2
  169. package/js/es6/frozenproduct/large/dark/components/nav.d.ts +2 -0
  170. package/js/es6/frozenproduct/large/dark/components/nav.js +6 -4
  171. package/js/es6/frozenproduct/large/dark/components/page.d.ts +24 -0
  172. package/js/es6/frozenproduct/large/dark/components/page.js +24 -0
  173. package/js/es6/frozenproduct/large/dark/components/profile.js +1 -1
  174. package/js/es6/frozenproduct/large/global.d.ts +24 -0
  175. package/js/es6/frozenproduct/large/global.js +30 -6
  176. package/js/es6/frozenproduct/large/light/components/badge.js +1 -1
  177. package/js/es6/frozenproduct/large/light/components/container.d.ts +3 -0
  178. package/js/es6/frozenproduct/large/light/components/container.js +5 -2
  179. package/js/es6/frozenproduct/large/light/components/nav.d.ts +2 -0
  180. package/js/es6/frozenproduct/large/light/components/nav.js +6 -4
  181. package/js/es6/frozenproduct/large/light/components/page.d.ts +24 -0
  182. package/js/es6/frozenproduct/large/light/components/page.js +24 -0
  183. package/js/es6/frozenproduct/large/light/components/profile.js +1 -1
  184. package/js/es6/frozenproduct/small/dark/components/container.d.ts +3 -0
  185. package/js/es6/frozenproduct/small/dark/components/container.js +5 -2
  186. package/js/es6/frozenproduct/small/dark/components/nav.d.ts +2 -0
  187. package/js/es6/frozenproduct/small/dark/components/nav.js +6 -4
  188. package/js/es6/frozenproduct/small/dark/components/page.d.ts +24 -0
  189. package/js/es6/frozenproduct/small/dark/components/page.js +24 -0
  190. package/js/es6/frozenproduct/small/global.d.ts +24 -0
  191. package/js/es6/frozenproduct/small/global.js +24 -0
  192. package/js/es6/frozenproduct/small/light/components/container.d.ts +3 -0
  193. package/js/es6/frozenproduct/small/light/components/container.js +5 -2
  194. package/js/es6/frozenproduct/small/light/components/nav.d.ts +2 -0
  195. package/js/es6/frozenproduct/small/light/components/nav.js +6 -4
  196. package/js/es6/frozenproduct/small/light/components/page.d.ts +24 -0
  197. package/js/es6/frozenproduct/small/light/components/page.js +24 -0
  198. package/js/es6/marketing/large/dark/components/badge.js +1 -1
  199. package/js/es6/marketing/large/dark/components/container.d.ts +3 -0
  200. package/js/es6/marketing/large/dark/components/container.js +5 -2
  201. package/js/es6/marketing/large/dark/components/nav.d.ts +2 -0
  202. package/js/es6/marketing/large/dark/components/nav.js +6 -4
  203. package/js/es6/marketing/large/dark/components/page.d.ts +24 -0
  204. package/js/es6/marketing/large/dark/components/page.js +24 -0
  205. package/js/es6/marketing/large/dark/components/profile.js +1 -1
  206. package/js/es6/marketing/large/global.d.ts +24 -0
  207. package/js/es6/marketing/large/global.js +30 -6
  208. package/js/es6/marketing/large/light/components/badge.js +1 -1
  209. package/js/es6/marketing/large/light/components/container.d.ts +3 -0
  210. package/js/es6/marketing/large/light/components/container.js +5 -2
  211. package/js/es6/marketing/large/light/components/nav.d.ts +2 -0
  212. package/js/es6/marketing/large/light/components/nav.js +6 -4
  213. package/js/es6/marketing/large/light/components/page.d.ts +24 -0
  214. package/js/es6/marketing/large/light/components/page.js +24 -0
  215. package/js/es6/marketing/large/light/components/profile.js +1 -1
  216. package/js/es6/marketing/small/dark/components/container.d.ts +3 -0
  217. package/js/es6/marketing/small/dark/components/container.js +5 -2
  218. package/js/es6/marketing/small/dark/components/nav.d.ts +2 -0
  219. package/js/es6/marketing/small/dark/components/nav.js +6 -4
  220. package/js/es6/marketing/small/dark/components/page.d.ts +24 -0
  221. package/js/es6/marketing/small/dark/components/page.js +24 -0
  222. package/js/es6/marketing/small/global.d.ts +24 -0
  223. package/js/es6/marketing/small/global.js +24 -0
  224. package/js/es6/marketing/small/light/components/container.d.ts +3 -0
  225. package/js/es6/marketing/small/light/components/container.js +5 -2
  226. package/js/es6/marketing/small/light/components/nav.d.ts +2 -0
  227. package/js/es6/marketing/small/light/components/nav.js +6 -4
  228. package/js/es6/marketing/small/light/components/page.d.ts +24 -0
  229. package/js/es6/marketing/small/light/components/page.js +24 -0
  230. package/js/es6/product/large/dark/components/badge.js +1 -1
  231. package/js/es6/product/large/dark/components/container.d.ts +3 -0
  232. package/js/es6/product/large/dark/components/container.js +5 -2
  233. package/js/es6/product/large/dark/components/nav.d.ts +2 -0
  234. package/js/es6/product/large/dark/components/nav.js +6 -4
  235. package/js/es6/product/large/dark/components/page.d.ts +24 -0
  236. package/js/es6/product/large/dark/components/page.js +24 -0
  237. package/js/es6/product/large/dark/components/profile.js +1 -1
  238. package/js/es6/product/large/global.d.ts +24 -0
  239. package/js/es6/product/large/global.js +30 -6
  240. package/js/es6/product/large/light/components/badge.js +1 -1
  241. package/js/es6/product/large/light/components/container.d.ts +3 -0
  242. package/js/es6/product/large/light/components/container.js +5 -2
  243. package/js/es6/product/large/light/components/nav.d.ts +2 -0
  244. package/js/es6/product/large/light/components/nav.js +6 -4
  245. package/js/es6/product/large/light/components/page.d.ts +24 -0
  246. package/js/es6/product/large/light/components/page.js +24 -0
  247. package/js/es6/product/large/light/components/profile.js +1 -1
  248. package/js/es6/product/small/dark/components/container.d.ts +3 -0
  249. package/js/es6/product/small/dark/components/container.js +5 -2
  250. package/js/es6/product/small/dark/components/nav.d.ts +2 -0
  251. package/js/es6/product/small/dark/components/nav.js +6 -4
  252. package/js/es6/product/small/dark/components/page.d.ts +24 -0
  253. package/js/es6/product/small/dark/components/page.js +24 -0
  254. package/js/es6/product/small/global.d.ts +24 -0
  255. package/js/es6/product/small/global.js +24 -0
  256. package/js/es6/product/small/light/components/container.d.ts +3 -0
  257. package/js/es6/product/small/light/components/container.js +5 -2
  258. package/js/es6/product/small/light/components/nav.d.ts +2 -0
  259. package/js/es6/product/small/light/components/nav.js +6 -4
  260. package/js/es6/product/small/light/components/page.d.ts +24 -0
  261. package/js/es6/product/small/light/components/page.js +24 -0
  262. package/js/umd/frozenproduct/large/dark/components/badge.js +1 -1
  263. package/js/umd/frozenproduct/large/dark/components/container.js +45 -4
  264. package/js/umd/frozenproduct/large/dark/components/nav.js +42 -8
  265. package/js/umd/frozenproduct/large/dark/components/page.js +108 -0
  266. package/js/umd/frozenproduct/large/dark/components/profile.js +1 -1
  267. package/js/umd/frozenproduct/large/global.js +136 -8
  268. package/js/umd/frozenproduct/large/light/components/badge.js +1 -1
  269. package/js/umd/frozenproduct/large/light/components/container.js +45 -4
  270. package/js/umd/frozenproduct/large/light/components/nav.js +42 -8
  271. package/js/umd/frozenproduct/large/light/components/page.js +108 -0
  272. package/js/umd/frozenproduct/large/light/components/profile.js +1 -1
  273. package/js/umd/frozenproduct/small/dark/components/container.js +45 -4
  274. package/js/umd/frozenproduct/small/dark/components/nav.js +42 -8
  275. package/js/umd/frozenproduct/small/dark/components/page.js +108 -0
  276. package/js/umd/frozenproduct/small/global.js +128 -0
  277. package/js/umd/frozenproduct/small/light/components/container.js +45 -4
  278. package/js/umd/frozenproduct/small/light/components/nav.js +42 -8
  279. package/js/umd/frozenproduct/small/light/components/page.js +108 -0
  280. package/js/umd/marketing/large/dark/components/badge.js +1 -1
  281. package/js/umd/marketing/large/dark/components/container.js +45 -4
  282. package/js/umd/marketing/large/dark/components/nav.js +42 -8
  283. package/js/umd/marketing/large/dark/components/page.js +108 -0
  284. package/js/umd/marketing/large/dark/components/profile.js +1 -1
  285. package/js/umd/marketing/large/global.js +136 -8
  286. package/js/umd/marketing/large/light/components/badge.js +1 -1
  287. package/js/umd/marketing/large/light/components/container.js +45 -4
  288. package/js/umd/marketing/large/light/components/nav.js +42 -8
  289. package/js/umd/marketing/large/light/components/page.js +108 -0
  290. package/js/umd/marketing/large/light/components/profile.js +1 -1
  291. package/js/umd/marketing/small/dark/components/container.js +45 -4
  292. package/js/umd/marketing/small/dark/components/nav.js +42 -8
  293. package/js/umd/marketing/small/dark/components/page.js +108 -0
  294. package/js/umd/marketing/small/global.js +128 -0
  295. package/js/umd/marketing/small/light/components/container.js +45 -4
  296. package/js/umd/marketing/small/light/components/nav.js +42 -8
  297. package/js/umd/marketing/small/light/components/page.js +108 -0
  298. package/js/umd/product/large/dark/components/badge.js +1 -1
  299. package/js/umd/product/large/dark/components/container.js +45 -4
  300. package/js/umd/product/large/dark/components/nav.js +42 -8
  301. package/js/umd/product/large/dark/components/page.js +108 -0
  302. package/js/umd/product/large/dark/components/profile.js +1 -1
  303. package/js/umd/product/large/global.js +136 -8
  304. package/js/umd/product/large/light/components/badge.js +1 -1
  305. package/js/umd/product/large/light/components/container.js +45 -4
  306. package/js/umd/product/large/light/components/nav.js +42 -8
  307. package/js/umd/product/large/light/components/page.js +108 -0
  308. package/js/umd/product/large/light/components/profile.js +1 -1
  309. package/js/umd/product/small/dark/components/container.js +45 -4
  310. package/js/umd/product/small/dark/components/nav.js +42 -8
  311. package/js/umd/product/small/dark/components/page.js +108 -0
  312. package/js/umd/product/small/global.js +128 -0
  313. package/js/umd/product/small/light/components/container.js +45 -4
  314. package/js/umd/product/small/light/components/nav.js +42 -8
  315. package/js/umd/product/small/light/components/page.js +108 -0
  316. package/json/flat/frozenproduct/large/dark/components/badge.json +1 -1
  317. package/json/flat/frozenproduct/large/dark/components/container.json +5 -2
  318. package/json/flat/frozenproduct/large/dark/components/nav.json +6 -4
  319. package/json/flat/frozenproduct/large/dark/components/page.json +4 -0
  320. package/json/flat/frozenproduct/large/dark/components/profile.json +1 -1
  321. package/json/flat/frozenproduct/large/global.json +10 -6
  322. package/json/flat/frozenproduct/large/light/components/badge.json +1 -1
  323. package/json/flat/frozenproduct/large/light/components/container.json +5 -2
  324. package/json/flat/frozenproduct/large/light/components/nav.json +6 -4
  325. package/json/flat/frozenproduct/large/light/components/page.json +4 -0
  326. package/json/flat/frozenproduct/large/light/components/profile.json +1 -1
  327. package/json/flat/frozenproduct/small/dark/components/container.json +5 -2
  328. package/json/flat/frozenproduct/small/dark/components/nav.json +6 -4
  329. package/json/flat/frozenproduct/small/dark/components/page.json +4 -0
  330. package/json/flat/frozenproduct/small/global.json +4 -0
  331. package/json/flat/frozenproduct/small/light/components/container.json +5 -2
  332. package/json/flat/frozenproduct/small/light/components/nav.json +6 -4
  333. package/json/flat/frozenproduct/small/light/components/page.json +4 -0
  334. package/json/flat/marketing/large/dark/components/badge.json +1 -1
  335. package/json/flat/marketing/large/dark/components/container.json +5 -2
  336. package/json/flat/marketing/large/dark/components/nav.json +6 -4
  337. package/json/flat/marketing/large/dark/components/page.json +4 -0
  338. package/json/flat/marketing/large/dark/components/profile.json +1 -1
  339. package/json/flat/marketing/large/global.json +10 -6
  340. package/json/flat/marketing/large/light/components/badge.json +1 -1
  341. package/json/flat/marketing/large/light/components/container.json +5 -2
  342. package/json/flat/marketing/large/light/components/nav.json +6 -4
  343. package/json/flat/marketing/large/light/components/page.json +4 -0
  344. package/json/flat/marketing/large/light/components/profile.json +1 -1
  345. package/json/flat/marketing/small/dark/components/container.json +5 -2
  346. package/json/flat/marketing/small/dark/components/nav.json +6 -4
  347. package/json/flat/marketing/small/dark/components/page.json +4 -0
  348. package/json/flat/marketing/small/global.json +4 -0
  349. package/json/flat/marketing/small/light/components/container.json +5 -2
  350. package/json/flat/marketing/small/light/components/nav.json +6 -4
  351. package/json/flat/marketing/small/light/components/page.json +4 -0
  352. package/json/flat/product/large/dark/components/badge.json +1 -1
  353. package/json/flat/product/large/dark/components/container.json +5 -2
  354. package/json/flat/product/large/dark/components/nav.json +6 -4
  355. package/json/flat/product/large/dark/components/page.json +4 -0
  356. package/json/flat/product/large/dark/components/profile.json +1 -1
  357. package/json/flat/product/large/global.json +10 -6
  358. package/json/flat/product/large/light/components/badge.json +1 -1
  359. package/json/flat/product/large/light/components/container.json +5 -2
  360. package/json/flat/product/large/light/components/nav.json +6 -4
  361. package/json/flat/product/large/light/components/page.json +4 -0
  362. package/json/flat/product/large/light/components/profile.json +1 -1
  363. package/json/flat/product/small/dark/components/container.json +5 -2
  364. package/json/flat/product/small/dark/components/nav.json +6 -4
  365. package/json/flat/product/small/dark/components/page.json +4 -0
  366. package/json/flat/product/small/global.json +4 -0
  367. package/json/flat/product/small/light/components/container.json +5 -2
  368. package/json/flat/product/small/light/components/nav.json +6 -4
  369. package/json/flat/product/small/light/components/page.json +4 -0
  370. package/json/nested/frozenproduct/large/dark/components/badge.json +1 -1
  371. package/json/nested/frozenproduct/large/dark/components/container.json +7 -2
  372. package/json/nested/frozenproduct/large/dark/components/nav.json +10 -4
  373. package/json/nested/frozenproduct/large/dark/components/page.json +32 -0
  374. package/json/nested/frozenproduct/large/dark/components/profile.json +1 -1
  375. package/json/nested/frozenproduct/large/global.json +38 -6
  376. package/json/nested/frozenproduct/large/light/components/badge.json +1 -1
  377. package/json/nested/frozenproduct/large/light/components/container.json +7 -2
  378. package/json/nested/frozenproduct/large/light/components/nav.json +10 -4
  379. package/json/nested/frozenproduct/large/light/components/page.json +32 -0
  380. package/json/nested/frozenproduct/large/light/components/profile.json +1 -1
  381. package/json/nested/frozenproduct/small/dark/components/container.json +7 -2
  382. package/json/nested/frozenproduct/small/dark/components/nav.json +10 -4
  383. package/json/nested/frozenproduct/small/dark/components/page.json +32 -0
  384. package/json/nested/frozenproduct/small/global.json +32 -0
  385. package/json/nested/frozenproduct/small/light/components/container.json +7 -2
  386. package/json/nested/frozenproduct/small/light/components/nav.json +10 -4
  387. package/json/nested/frozenproduct/small/light/components/page.json +32 -0
  388. package/json/nested/marketing/large/dark/components/badge.json +1 -1
  389. package/json/nested/marketing/large/dark/components/container.json +7 -2
  390. package/json/nested/marketing/large/dark/components/nav.json +10 -4
  391. package/json/nested/marketing/large/dark/components/page.json +32 -0
  392. package/json/nested/marketing/large/dark/components/profile.json +1 -1
  393. package/json/nested/marketing/large/global.json +38 -6
  394. package/json/nested/marketing/large/light/components/badge.json +1 -1
  395. package/json/nested/marketing/large/light/components/container.json +7 -2
  396. package/json/nested/marketing/large/light/components/nav.json +10 -4
  397. package/json/nested/marketing/large/light/components/page.json +32 -0
  398. package/json/nested/marketing/large/light/components/profile.json +1 -1
  399. package/json/nested/marketing/small/dark/components/container.json +7 -2
  400. package/json/nested/marketing/small/dark/components/nav.json +10 -4
  401. package/json/nested/marketing/small/dark/components/page.json +32 -0
  402. package/json/nested/marketing/small/global.json +32 -0
  403. package/json/nested/marketing/small/light/components/container.json +7 -2
  404. package/json/nested/marketing/small/light/components/nav.json +10 -4
  405. package/json/nested/marketing/small/light/components/page.json +32 -0
  406. package/json/nested/product/large/dark/components/badge.json +1 -1
  407. package/json/nested/product/large/dark/components/container.json +7 -2
  408. package/json/nested/product/large/dark/components/nav.json +10 -4
  409. package/json/nested/product/large/dark/components/page.json +32 -0
  410. package/json/nested/product/large/dark/components/profile.json +1 -1
  411. package/json/nested/product/large/global.json +38 -6
  412. package/json/nested/product/large/light/components/badge.json +1 -1
  413. package/json/nested/product/large/light/components/container.json +7 -2
  414. package/json/nested/product/large/light/components/nav.json +10 -4
  415. package/json/nested/product/large/light/components/page.json +32 -0
  416. package/json/nested/product/large/light/components/profile.json +1 -1
  417. package/json/nested/product/small/dark/components/container.json +7 -2
  418. package/json/nested/product/small/dark/components/nav.json +10 -4
  419. package/json/nested/product/small/dark/components/page.json +32 -0
  420. package/json/nested/product/small/global.json +32 -0
  421. package/json/nested/product/small/light/components/container.json +7 -2
  422. package/json/nested/product/small/light/components/nav.json +10 -4
  423. package/json/nested/product/small/light/components/page.json +32 -0
  424. package/package.json +1 -1
  425. package/sage-design-tokens-14.9.1.tgz +0 -0
  426. package/scss/frozenproduct/large/components/button.scss +13 -13
  427. package/scss/frozenproduct/large/components/container.scss +5 -2
  428. package/scss/frozenproduct/large/components/form.scss +7 -7
  429. package/scss/frozenproduct/large/components/link.scss +2 -2
  430. package/scss/frozenproduct/large/components/nav.scss +11 -9
  431. package/scss/frozenproduct/large/components/page.scss +5 -1
  432. package/scss/frozenproduct/large/components/popover.scss +2 -2
  433. package/scss/frozenproduct/large/components/progress.scss +6 -6
  434. package/scss/frozenproduct/large/components/status.scss +3 -3
  435. package/scss/frozenproduct/large/components/tab.scss +7 -7
  436. package/scss/frozenproduct/large/components/table.scss +10 -10
  437. package/scss/frozenproduct/large/global.scss +6 -2
  438. package/scss/frozenproduct/small/components/container.scss +5 -2
  439. package/scss/frozenproduct/small/components/nav.scss +6 -4
  440. package/scss/frozenproduct/small/components/page.scss +4 -0
  441. package/scss/frozenproduct/small/global.scss +4 -0
  442. package/scss/marketing/large/components/container.scss +5 -2
  443. package/scss/marketing/large/components/nav.scss +6 -4
  444. package/scss/marketing/large/components/page.scss +4 -0
  445. package/scss/marketing/large/global.scss +6 -2
  446. package/scss/marketing/small/components/button.scss +13 -13
  447. package/scss/marketing/small/components/container.scss +15 -12
  448. package/scss/marketing/small/components/form.scss +7 -7
  449. package/scss/marketing/small/components/link.scss +2 -2
  450. package/scss/marketing/small/components/nav.scss +11 -9
  451. package/scss/marketing/small/components/page.scss +5 -1
  452. package/scss/marketing/small/components/popover.scss +2 -2
  453. package/scss/marketing/small/components/progress.scss +6 -6
  454. package/scss/marketing/small/components/status.scss +3 -3
  455. package/scss/marketing/small/components/tab.scss +7 -7
  456. package/scss/marketing/small/components/table.scss +10 -10
  457. package/scss/marketing/small/global.scss +4 -0
  458. package/scss/product/large/components/button.scss +13 -13
  459. package/scss/product/large/components/container.scss +15 -12
  460. package/scss/product/large/components/form.scss +7 -7
  461. package/scss/product/large/components/link.scss +2 -2
  462. package/scss/product/large/components/nav.scss +11 -9
  463. package/scss/product/large/components/page.scss +5 -1
  464. package/scss/product/large/components/popover.scss +2 -2
  465. package/scss/product/large/components/progress.scss +6 -6
  466. package/scss/product/large/components/status.scss +3 -3
  467. package/scss/product/large/components/tab.scss +7 -7
  468. package/scss/product/large/components/table.scss +10 -10
  469. package/scss/product/large/global.scss +6 -2
  470. package/scss/product/small/components/container.scss +5 -2
  471. package/scss/product/small/components/nav.scss +6 -4
  472. package/scss/product/small/components/page.scss +4 -0
  473. package/scss/product/small/global.scss +4 -0
  474. package/sage-design-tokens-14.8.0.tgz +0 -0
package/css/frozenproduct/all.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-heading-l: 700 25px/1.25 Sage UI;
103
103
  --global-typography-subheading-m: 500 16px/1.25 Sage UI;
104
104
  --global-typography-subheading-l: 500 17px/1.25 Sage UI;
105
+ --global-typography-section-heading-s: 700 16px/1.25 Sage UI;
106
+ --global-typography-section-heading-m: 700 19px/1.25 Sage UI;
105
107
  --global-typography-body-regular-s: 400 14px/1.5 Sage UI;
106
108
  --global-typography-body-regular-m: 400 14px/1.5 Sage UI;
107
109
  --global-typography-body-regular-l: 400 16px/1.5 Sage UI;
@@ -1116,10 +1118,13 @@
1116
1118
  --container-size-dialog-max-width-xxs: 300;
1117
1119
  --container-size-dialog-max-width-xs: 380;
1118
1120
  --container-size-dialog-max-width-s: 540;
1119
- --container-size-dialog-max-width-m: 750;
1120
- --container-size-dialog-max-width-l: 850;
1121
+ --container-size-dialog-max-width-m: 850;
1122
+ --container-size-dialog-max-width-l: 1080;
1121
1123
  --container-size-dialog-max-width-xl: 960;
1122
1124
  --container-size-dialog-max-width-xxl: 1080;
1125
+ --container-size-dialog-min-width-s: 288;
1126
+ --container-size-dialog-min-width-m: 288;
1127
+ --container-size-dialog-min-width-l: 288;
1123
1128
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
1124
1129
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
1125
1130
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
@@ -1790,6 +1795,8 @@
1790
1795
  --logo-space-ai-xg-m: var(--global-space-micro-l); /* Space between star icon and text */
1791
1796
 
1792
1797
  /* nav component tokens */
1798
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
1799
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
1793
1800
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
1794
1801
  --nav-color-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* nav bar bg */
1795
1802
  --nav-color-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
@@ -1805,10 +1812,10 @@
1805
1812
  --nav-color-topnav-item-bg-active: light-dark(var(--modes-color-interactive-nav-active-light), var(--modes-color-interactive-nav-active-dark));
1806
1813
  --nav-color-topnav-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
1807
1814
  --nav-color-topnav-item-bg-hover: light-dark(var(--modes-color-interactive-nav-hover-light), var(--modes-color-interactive-nav-hover-dark));
1808
- --nav-typography-label-s: var(--global-typography-component-firm-s);
1815
+ --nav-typography-label-s: var(--global-typography-component-firm-xs);
1809
1816
  --nav-typography-label-m: var(--global-typography-component-firm-m);
1810
1817
  --nav-typography-label-l: var(--global-typography-component-firm-l);
1811
- --nav-typography-default-s: var(--global-typography-component-moderate-s);
1818
+ --nav-typography-default-s: var(--global-typography-component-moderate-xs);
1812
1819
  --nav-typography-default-m: var(--global-typography-component-moderate-m);
1813
1820
  --nav-typography-default-l: var(--global-typography-component-moderate-l);
1814
1821
  --nav-color-item-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
@@ -1943,6 +1950,8 @@
1943
1950
  --page-typography-h3: var(--global-typography-heading-s);
1944
1951
  --page-typography-h4: var(--global-typography-subheading-l);
1945
1952
  --page-typography-h5: var(--global-typography-subheading-m);
1953
+ --page-typography-section-heading-s: var(--global-typography-section-heading-s);
1954
+ --page-typography-section-heading-m: var(--global-typography-section-heading-m);
1946
1955
  --page-typography-p-regular-typical: var(--global-typography-body-regular-s);
1947
1956
  --page-typography-p-regular-large: var(--global-typography-body-regular-l);
1948
1957
  --page-typography-p-medium-typical: var(--global-typography-body-medium-s);
@@ -2577,17 +2586,12 @@
2577
2586
  --global-typography-heading-m: 700 24px/1.25 Sage UI;
2578
2587
  --global-typography-heading-l: 700 30px/1.25 Sage UI;
2579
2588
  --global-typography-subheading-l: 500 18px/1.25 Sage UI;
2580
- --global-typography-component-firm-xs: 500 12px/1.5 Sage UI;
2581
- --global-typography-component-moderate-xs: 400 12px/1.5 Sage UI;
2582
- --global-typography-component-placeholdertext-xs: 500 11px/1.5 Sage UI;
2589
+ --global-typography-section-heading-m: 700 21px/1.25 Sage UI;
2583
2590
  --global-typography-component-placeholdertext-m: 500 18px/1.5 Sage UI;
2584
2591
  --global-typography-component-placeholdertext-ml: 500 24px/1.5 Sage UI;
2585
2592
  --global-typography-component-placeholdertext-l: 500 30px/1.5 Sage UI;
2586
2593
  --global-typography-component-placeholdertext-xl: 500 40px/1.5 Sage UI;
2587
2594
  --global-typography-component-placeholdertext-xxl: 500 52px/1.5 Sage UI;
2588
- --global-typography-component-notification-m: 500 12px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
2589
- --global-font-size-adaptive-step-minus2: 11px;
2590
- --global-font-size-adaptive-step-minus1: 12px;
2591
2595
  --global-font-size-adaptive-step2: 18px;
2592
2596
  --global-font-size-adaptive-step3: 21px;
2593
2597
  --global-font-size-adaptive-step4: 24px;
package/css/frozenproduct/large/components/container.css CHANGED
@@ -7,10 +7,13 @@
7
7
  --container-size-dialog-max-width-xxs: 300;
8
8
  --container-size-dialog-max-width-xs: 380;
9
9
  --container-size-dialog-max-width-s: 540;
10
- --container-size-dialog-max-width-m: 750;
11
- --container-size-dialog-max-width-l: 850;
10
+ --container-size-dialog-max-width-m: 850;
11
+ --container-size-dialog-max-width-l: 1080;
12
12
  --container-size-dialog-max-width-xl: 960;
13
13
  --container-size-dialog-max-width-xxl: 1080;
14
+ --container-size-dialog-min-width-s: 288;
15
+ --container-size-dialog-min-width-m: 288;
16
+ --container-size-dialog-min-width-l: 288;
14
17
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
15
18
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
16
19
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
package/css/frozenproduct/large/components/nav.css CHANGED
@@ -3,6 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
7
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
6
8
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
7
9
  --nav-color-bg-default: var(--modes-color-generic-bg-nought); /* nav bar bg */
8
10
  --nav-color-item-bg-enabled: var(--modes-color-none);
@@ -18,16 +20,16 @@
18
20
  --nav-color-topnav-item-bg-active: var(--modes-color-interactive-nav-active);
19
21
  --nav-color-topnav-item-bg-enabled: var(--modes-color-none);
20
22
  --nav-color-topnav-item-bg-hover: var(--modes-color-interactive-nav-hover);
21
- --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-s);
23
+ --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-xs);
22
24
  --nav-typography-adaptive-label-m: var(--global-typography-adaptive-component-firm-m);
23
25
  --nav-typography-adaptive-label-l: var(--global-typography-adaptive-component-firm-l);
24
- --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-s);
26
+ --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-xs);
25
27
  --nav-typography-adaptive-default-m: var(--global-typography-adaptive-component-moderate-m);
26
28
  --nav-typography-adaptive-default-l: var(--global-typography-adaptive-component-moderate-l);
27
- --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-s);
29
+ --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-xs);
28
30
  --nav-typography-responsive-label-m: var(--global-typography-responsive-component-firm-m);
29
31
  --nav-typography-responsive-label-l: var(--global-typography-responsive-component-firm-l);
30
- --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-s);
32
+ --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-xs);
31
33
  --nav-typography-responsive-default-m: var(--global-typography-responsive-component-moderate-m);
32
34
  --nav-typography-responsive-default-l: var(--global-typography-responsive-component-moderate-l);
33
35
  --nav-color-item-bg-active: var(--modes-color-interactive-monochrome-active);
package/css/frozenproduct/large/components/page.css CHANGED
@@ -9,6 +9,8 @@
9
9
  --page-typography-responsive-h3: var(--global-typography-responsive-heading-s);
10
10
  --page-typography-responsive-h4: var(--global-typography-responsive-subheading-l);
11
11
  --page-typography-responsive-h5: var(--global-typography-responsive-subheading-m);
12
+ --page-typography-responsive-section-heading-s: var(--global-typography-responsive-section-heading-s);
13
+ --page-typography-responsive-section-heading-m: var(--global-typography-responsive-section-heading-m);
12
14
  --page-typography-responsive-p-regular-typical: var(--global-typography-responsive-body-regular-s);
13
15
  --page-typography-responsive-p-regular-large: var(--global-typography-responsive-body-regular-l);
14
16
  --page-typography-responsive-p-medium-typical: var(--global-typography-responsive-body-medium-s);
@@ -18,6 +20,8 @@
18
20
  --page-typography-adaptive-h3: var(--global-typography-adaptive-heading-s);
19
21
  --page-typography-adaptive-h4: var(--global-typography-adaptive-subheading-l);
20
22
  --page-typography-adaptive-h5: var(--global-typography-adaptive-subheading-m);
23
+ --page-typography-adaptive-section-heading-s: var(--global-typography-adaptive-section-heading-s);
24
+ --page-typography-adaptive-section-heading-m: var(--global-typography-adaptive-section-heading-m);
21
25
  --page-typography-adaptive-p-regular-typical: var(--global-typography-adaptive-body-regular-s);
22
26
  --page-typography-adaptive-p-regular-large: var(--global-typography-adaptive-body-regular-l);
23
27
  --page-typography-adaptive-p-medium-typical: var(--global-typography-adaptive-body-medium-s);
package/css/frozenproduct/large/global.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-responsive-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-responsive-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-responsive-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-responsive-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-responsive-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-responsive-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-responsive-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-responsive-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -138,17 +140,19 @@
138
140
  --global-typography-adaptive-heading-l: 700 30px/1.25 Sage UI;
139
141
  --global-typography-adaptive-subheading-m: 500 16px/1.25 Sage UI;
140
142
  --global-typography-adaptive-subheading-l: 500 18px/1.25 Sage UI;
143
+ --global-typography-adaptive-section-heading-s: 700 16px/1.25 Sage UI;
144
+ --global-typography-adaptive-section-heading-m: 700 21px/1.25 Sage UI;
141
145
  --global-typography-adaptive-body-regular-s: 400 14px/1.5 Sage UI;
142
146
  --global-typography-adaptive-body-regular-m: 400 14px/1.5 Sage UI;
143
147
  --global-typography-adaptive-body-regular-l: 400 16px/1.5 Sage UI;
144
148
  --global-typography-adaptive-body-medium-s: 500 14px/1.5 Sage UI;
145
149
  --global-typography-adaptive-body-medium-m: 500 14px/1.5 Sage UI;
146
150
  --global-typography-adaptive-body-medium-l: 500 16px/1.5 Sage UI;
147
- --global-typography-adaptive-component-firm-xs: 500 12px/1.5 Sage UI;
151
+ --global-typography-adaptive-component-firm-xs: 500 13px/1.5 Sage UI;
148
152
  --global-typography-adaptive-component-firm-s: 500 14px/1.5 Sage UI;
149
153
  --global-typography-adaptive-component-firm-m: 500 14px/1.5 Sage UI;
150
154
  --global-typography-adaptive-component-firm-l: 500 16px/1.5 Sage UI;
151
- --global-typography-adaptive-component-moderate-xs: 400 12px/1.5 Sage UI;
155
+ --global-typography-adaptive-component-moderate-xs: 400 13px/1.5 Sage UI;
152
156
  --global-typography-adaptive-component-moderate-s: 400 14px/1.5 Sage UI;
153
157
  --global-typography-adaptive-component-moderate-m: 400 14px/1.5 Sage UI;
154
158
  --global-typography-adaptive-component-moderate-l: 400 16px/1.5 Sage UI;
@@ -161,16 +165,16 @@
161
165
  --global-typography-adaptive-component-underlined-firm-s: 500 14px/1.5 Sage UI;
162
166
  --global-typography-adaptive-component-underlined-firm-m: 500 14px/1.5 Sage UI;
163
167
  --global-typography-adaptive-component-underlined-firm-l: 500 16px/1.5 Sage UI;
164
- --global-typography-adaptive-component-placeholdertext-xs: 500 11px/1.5 Sage UI;
168
+ --global-typography-adaptive-component-placeholdertext-xs: 500 12px/1.5 Sage UI;
165
169
  --global-typography-adaptive-component-placeholdertext-s: 500 14px/1.5 Sage UI;
166
170
  --global-typography-adaptive-component-placeholdertext-m: 500 18px/1.5 Sage UI;
167
171
  --global-typography-adaptive-component-placeholdertext-ml: 500 24px/1.5 Sage UI;
168
172
  --global-typography-adaptive-component-placeholdertext-l: 500 30px/1.5 Sage UI;
169
173
  --global-typography-adaptive-component-placeholdertext-xl: 500 40px/1.5 Sage UI;
170
174
  --global-typography-adaptive-component-placeholdertext-xxl: 500 52px/1.5 Sage UI;
171
- --global-typography-adaptive-component-notification-m: 500 12px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
172
- --global-font-size-adaptive-step-minus2: 11px;
173
- --global-font-size-adaptive-step-minus1: 12px;
175
+ --global-typography-adaptive-component-notification-m: 500 13px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
176
+ --global-font-size-adaptive-step-minus2: 12px;
177
+ --global-font-size-adaptive-step-minus1: 13px;
174
178
  --global-font-size-adaptive-step0: 14px;
175
179
  --global-font-size-adaptive-step1: 16px;
176
180
  --global-font-size-adaptive-step2: 18px;
package/css/frozenproduct/small/components/container.css CHANGED
@@ -7,10 +7,13 @@
7
7
  --container-size-dialog-max-width-xxs: 300;
8
8
  --container-size-dialog-max-width-xs: 380;
9
9
  --container-size-dialog-max-width-s: 540;
10
- --container-size-dialog-max-width-m: 750;
11
- --container-size-dialog-max-width-l: 850;
10
+ --container-size-dialog-max-width-m: 850;
11
+ --container-size-dialog-max-width-l: 1080;
12
12
  --container-size-dialog-max-width-xl: 960;
13
13
  --container-size-dialog-max-width-xxl: 1080;
14
+ --container-size-dialog-min-width-s: 288;
15
+ --container-size-dialog-min-width-m: 288;
16
+ --container-size-dialog-min-width-l: 288;
14
17
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
15
18
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
16
19
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
package/css/frozenproduct/small/components/nav.css CHANGED
@@ -3,6 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
7
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
6
8
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
7
9
  --nav-color-bg-default: var(--modes-color-generic-bg-nought); /* nav bar bg */
8
10
  --nav-color-item-bg-enabled: var(--modes-color-none);
@@ -18,16 +20,16 @@
18
20
  --nav-color-topnav-item-bg-active: var(--modes-color-interactive-nav-active);
19
21
  --nav-color-topnav-item-bg-enabled: var(--modes-color-none);
20
22
  --nav-color-topnav-item-bg-hover: var(--modes-color-interactive-nav-hover);
21
- --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-s);
23
+ --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-xs);
22
24
  --nav-typography-adaptive-label-m: var(--global-typography-adaptive-component-firm-m);
23
25
  --nav-typography-adaptive-label-l: var(--global-typography-adaptive-component-firm-l);
24
- --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-s);
26
+ --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-xs);
25
27
  --nav-typography-adaptive-default-m: var(--global-typography-adaptive-component-moderate-m);
26
28
  --nav-typography-adaptive-default-l: var(--global-typography-adaptive-component-moderate-l);
27
- --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-s);
29
+ --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-xs);
28
30
  --nav-typography-responsive-label-m: var(--global-typography-responsive-component-firm-m);
29
31
  --nav-typography-responsive-label-l: var(--global-typography-responsive-component-firm-l);
30
- --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-s);
32
+ --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-xs);
31
33
  --nav-typography-responsive-default-m: var(--global-typography-responsive-component-moderate-m);
32
34
  --nav-typography-responsive-default-l: var(--global-typography-responsive-component-moderate-l);
33
35
  --nav-color-item-bg-active: var(--modes-color-interactive-monochrome-active);
package/css/frozenproduct/small/components/page.css CHANGED
@@ -9,6 +9,8 @@
9
9
  --page-typography-responsive-h3: var(--global-typography-responsive-heading-s);
10
10
  --page-typography-responsive-h4: var(--global-typography-responsive-subheading-l);
11
11
  --page-typography-responsive-h5: var(--global-typography-responsive-subheading-m);
12
+ --page-typography-responsive-section-heading-s: var(--global-typography-responsive-section-heading-s);
13
+ --page-typography-responsive-section-heading-m: var(--global-typography-responsive-section-heading-m);
12
14
  --page-typography-responsive-p-regular-typical: var(--global-typography-responsive-body-regular-s);
13
15
  --page-typography-responsive-p-regular-large: var(--global-typography-responsive-body-regular-l);
14
16
  --page-typography-responsive-p-medium-typical: var(--global-typography-responsive-body-medium-s);
@@ -18,6 +20,8 @@
18
20
  --page-typography-adaptive-h3: var(--global-typography-adaptive-heading-s);
19
21
  --page-typography-adaptive-h4: var(--global-typography-adaptive-subheading-l);
20
22
  --page-typography-adaptive-h5: var(--global-typography-adaptive-subheading-m);
23
+ --page-typography-adaptive-section-heading-s: var(--global-typography-adaptive-section-heading-s);
24
+ --page-typography-adaptive-section-heading-m: var(--global-typography-adaptive-section-heading-m);
21
25
  --page-typography-adaptive-p-regular-typical: var(--global-typography-adaptive-body-regular-s);
22
26
  --page-typography-adaptive-p-regular-large: var(--global-typography-adaptive-body-regular-l);
23
27
  --page-typography-adaptive-p-medium-typical: var(--global-typography-adaptive-body-medium-s);
package/css/frozenproduct/small/global.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-responsive-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-responsive-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-responsive-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-responsive-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-responsive-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-responsive-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-responsive-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-responsive-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -138,6 +140,8 @@
138
140
  --global-typography-adaptive-heading-l: 700 25px/1.25 Sage UI;
139
141
  --global-typography-adaptive-subheading-m: 500 16px/1.25 Sage UI;
140
142
  --global-typography-adaptive-subheading-l: 500 17px/1.25 Sage UI;
143
+ --global-typography-adaptive-section-heading-s: 700 16px/1.25 Sage UI;
144
+ --global-typography-adaptive-section-heading-m: 700 19px/1.25 Sage UI;
141
145
  --global-typography-adaptive-body-regular-s: 400 14px/1.5 Sage UI;
142
146
  --global-typography-adaptive-body-regular-m: 400 14px/1.5 Sage UI;
143
147
  --global-typography-adaptive-body-regular-l: 400 16px/1.5 Sage UI;
package/css/marketing/all.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -1116,10 +1118,13 @@
1116
1118
  --container-size-dialog-max-width-xxs: 300;
1117
1119
  --container-size-dialog-max-width-xs: 380;
1118
1120
  --container-size-dialog-max-width-s: 540;
1119
- --container-size-dialog-max-width-m: 750;
1120
- --container-size-dialog-max-width-l: 850;
1121
+ --container-size-dialog-max-width-m: 850;
1122
+ --container-size-dialog-max-width-l: 1080;
1121
1123
  --container-size-dialog-max-width-xl: 960;
1122
1124
  --container-size-dialog-max-width-xxl: 1080;
1125
+ --container-size-dialog-min-width-s: 288;
1126
+ --container-size-dialog-min-width-m: 288;
1127
+ --container-size-dialog-min-width-l: 288;
1123
1128
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
1124
1129
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
1125
1130
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
@@ -1790,6 +1795,8 @@
1790
1795
  --logo-space-ai-xg-m: var(--global-space-micro-l); /* Space between star icon and text */
1791
1796
 
1792
1797
  /* nav component tokens */
1798
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
1799
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
1793
1800
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
1794
1801
  --nav-color-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* nav bar bg */
1795
1802
  --nav-color-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
@@ -1805,10 +1812,10 @@
1805
1812
  --nav-color-topnav-item-bg-active: light-dark(var(--modes-color-interactive-nav-active-light), var(--modes-color-interactive-nav-active-dark));
1806
1813
  --nav-color-topnav-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
1807
1814
  --nav-color-topnav-item-bg-hover: light-dark(var(--modes-color-interactive-nav-hover-light), var(--modes-color-interactive-nav-hover-dark));
1808
- --nav-typography-label-s: var(--global-typography-component-firm-s);
1815
+ --nav-typography-label-s: var(--global-typography-component-firm-xs);
1809
1816
  --nav-typography-label-m: var(--global-typography-component-firm-m);
1810
1817
  --nav-typography-label-l: var(--global-typography-component-firm-l);
1811
- --nav-typography-default-s: var(--global-typography-component-moderate-s);
1818
+ --nav-typography-default-s: var(--global-typography-component-moderate-xs);
1812
1819
  --nav-typography-default-m: var(--global-typography-component-moderate-m);
1813
1820
  --nav-typography-default-l: var(--global-typography-component-moderate-l);
1814
1821
  --nav-color-item-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
@@ -1943,6 +1950,8 @@
1943
1950
  --page-typography-h3: var(--global-typography-heading-s);
1944
1951
  --page-typography-h4: var(--global-typography-subheading-l);
1945
1952
  --page-typography-h5: var(--global-typography-subheading-m);
1953
+ --page-typography-section-heading-s: var(--global-typography-section-heading-s);
1954
+ --page-typography-section-heading-m: var(--global-typography-section-heading-m);
1946
1955
  --page-typography-p-regular-typical: var(--global-typography-body-regular-s);
1947
1956
  --page-typography-p-regular-large: var(--global-typography-body-regular-l);
1948
1957
  --page-typography-p-medium-typical: var(--global-typography-body-medium-s);
@@ -2573,8 +2582,6 @@
2573
2582
  --global-space-macro-l: 32px;
2574
2583
  --global-space-macro-xl: 40px;
2575
2584
  --global-space-macro-xxl: 48px;
2576
- --global-font-size-adaptive-step-minus2: 11px;
2577
- --global-font-size-adaptive-step-minus1: 12px;
2578
2585
  --global-font-size-adaptive-step2: 18px;
2579
2586
  --global-font-size-adaptive-step3: 21px;
2580
2587
  --global-font-size-adaptive-step4: 24px;
package/css/marketing/large/components/container.css CHANGED
@@ -7,10 +7,13 @@
7
7
  --container-size-dialog-max-width-xxs: 300;
8
8
  --container-size-dialog-max-width-xs: 380;
9
9
  --container-size-dialog-max-width-s: 540;
10
- --container-size-dialog-max-width-m: 750;
11
- --container-size-dialog-max-width-l: 850;
10
+ --container-size-dialog-max-width-m: 850;
11
+ --container-size-dialog-max-width-l: 1080;
12
12
  --container-size-dialog-max-width-xl: 960;
13
13
  --container-size-dialog-max-width-xxl: 1080;
14
+ --container-size-dialog-min-width-s: 288;
15
+ --container-size-dialog-min-width-m: 288;
16
+ --container-size-dialog-min-width-l: 288;
14
17
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
15
18
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
16
19
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
package/css/marketing/large/components/nav.css CHANGED
@@ -3,6 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
7
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
6
8
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
7
9
  --nav-color-bg-default: var(--modes-color-generic-bg-nought); /* nav bar bg */
8
10
  --nav-color-item-bg-enabled: var(--modes-color-none);
@@ -18,16 +20,16 @@
18
20
  --nav-color-topnav-item-bg-active: var(--modes-color-interactive-nav-active);
19
21
  --nav-color-topnav-item-bg-enabled: var(--modes-color-none);
20
22
  --nav-color-topnav-item-bg-hover: var(--modes-color-interactive-nav-hover);
21
- --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-s);
23
+ --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-xs);
22
24
  --nav-typography-adaptive-label-m: var(--global-typography-adaptive-component-firm-m);
23
25
  --nav-typography-adaptive-label-l: var(--global-typography-adaptive-component-firm-l);
24
- --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-s);
26
+ --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-xs);
25
27
  --nav-typography-adaptive-default-m: var(--global-typography-adaptive-component-moderate-m);
26
28
  --nav-typography-adaptive-default-l: var(--global-typography-adaptive-component-moderate-l);
27
- --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-s);
29
+ --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-xs);
28
30
  --nav-typography-responsive-label-m: var(--global-typography-responsive-component-firm-m);
29
31
  --nav-typography-responsive-label-l: var(--global-typography-responsive-component-firm-l);
30
- --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-s);
32
+ --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-xs);
31
33
  --nav-typography-responsive-default-m: var(--global-typography-responsive-component-moderate-m);
32
34
  --nav-typography-responsive-default-l: var(--global-typography-responsive-component-moderate-l);
33
35
  --nav-color-item-bg-active: var(--modes-color-interactive-monochrome-active);
package/css/marketing/large/components/page.css CHANGED
@@ -9,6 +9,8 @@
9
9
  --page-typography-responsive-h3: var(--global-typography-responsive-heading-s);
10
10
  --page-typography-responsive-h4: var(--global-typography-responsive-subheading-l);
11
11
  --page-typography-responsive-h5: var(--global-typography-responsive-subheading-m);
12
+ --page-typography-responsive-section-heading-s: var(--global-typography-responsive-section-heading-s);
13
+ --page-typography-responsive-section-heading-m: var(--global-typography-responsive-section-heading-m);
12
14
  --page-typography-responsive-p-regular-typical: var(--global-typography-responsive-body-regular-s);
13
15
  --page-typography-responsive-p-regular-large: var(--global-typography-responsive-body-regular-l);
14
16
  --page-typography-responsive-p-medium-typical: var(--global-typography-responsive-body-medium-s);
@@ -18,6 +20,8 @@
18
20
  --page-typography-adaptive-h3: var(--global-typography-adaptive-heading-s);
19
21
  --page-typography-adaptive-h4: var(--global-typography-adaptive-subheading-l);
20
22
  --page-typography-adaptive-h5: var(--global-typography-adaptive-subheading-m);
23
+ --page-typography-adaptive-section-heading-s: var(--global-typography-adaptive-section-heading-s);
24
+ --page-typography-adaptive-section-heading-m: var(--global-typography-adaptive-section-heading-m);
21
25
  --page-typography-adaptive-p-regular-typical: var(--global-typography-adaptive-body-regular-s);
22
26
  --page-typography-adaptive-p-regular-large: var(--global-typography-adaptive-body-regular-l);
23
27
  --page-typography-adaptive-p-medium-typical: var(--global-typography-adaptive-body-medium-s);
package/css/marketing/large/global.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-responsive-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-responsive-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-responsive-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-responsive-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-responsive-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-responsive-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-responsive-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-responsive-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -138,17 +140,19 @@
138
140
  --global-typography-adaptive-heading-l: 700 30px/1.25 Sage UI;
139
141
  --global-typography-adaptive-subheading-m: 500 16px/1.25 Sage UI;
140
142
  --global-typography-adaptive-subheading-l: 500 18px/1.25 Sage UI;
143
+ --global-typography-adaptive-section-heading-s: 700 16px/1.25 Sage UI;
144
+ --global-typography-adaptive-section-heading-m: 700 21px/1.25 Sage UI;
141
145
  --global-typography-adaptive-body-regular-s: 400 14px/1.5 Sage UI;
142
146
  --global-typography-adaptive-body-regular-m: 400 14px/1.5 Sage UI;
143
147
  --global-typography-adaptive-body-regular-l: 400 16px/1.5 Sage UI;
144
148
  --global-typography-adaptive-body-medium-s: 500 14px/1.5 Sage UI;
145
149
  --global-typography-adaptive-body-medium-m: 500 14px/1.5 Sage UI;
146
150
  --global-typography-adaptive-body-medium-l: 500 16px/1.5 Sage UI;
147
- --global-typography-adaptive-component-firm-xs: 500 12px/1.5 Sage UI;
151
+ --global-typography-adaptive-component-firm-xs: 500 13px/1.5 Sage UI;
148
152
  --global-typography-adaptive-component-firm-s: 500 14px/1.5 Sage UI;
149
153
  --global-typography-adaptive-component-firm-m: 500 14px/1.5 Sage UI;
150
154
  --global-typography-adaptive-component-firm-l: 500 16px/1.5 Sage UI;
151
- --global-typography-adaptive-component-moderate-xs: 400 12px/1.5 Sage UI;
155
+ --global-typography-adaptive-component-moderate-xs: 400 13px/1.5 Sage UI;
152
156
  --global-typography-adaptive-component-moderate-s: 400 14px/1.5 Sage UI;
153
157
  --global-typography-adaptive-component-moderate-m: 400 14px/1.5 Sage UI;
154
158
  --global-typography-adaptive-component-moderate-l: 400 16px/1.5 Sage UI;
@@ -161,16 +165,16 @@
161
165
  --global-typography-adaptive-component-underlined-firm-s: 500 14px/1.5 Sage UI;
162
166
  --global-typography-adaptive-component-underlined-firm-m: 500 14px/1.5 Sage UI;
163
167
  --global-typography-adaptive-component-underlined-firm-l: 500 16px/1.5 Sage UI;
164
- --global-typography-adaptive-component-placeholdertext-xs: 500 11px/1.5 Sage UI;
168
+ --global-typography-adaptive-component-placeholdertext-xs: 500 12px/1.5 Sage UI;
165
169
  --global-typography-adaptive-component-placeholdertext-s: 500 14px/1.5 Sage UI;
166
170
  --global-typography-adaptive-component-placeholdertext-m: 500 18px/1.5 Sage UI;
167
171
  --global-typography-adaptive-component-placeholdertext-ml: 500 24px/1.5 Sage UI;
168
172
  --global-typography-adaptive-component-placeholdertext-l: 500 30px/1.5 Sage UI;
169
173
  --global-typography-adaptive-component-placeholdertext-xl: 500 40px/1.5 Sage UI;
170
174
  --global-typography-adaptive-component-placeholdertext-xxl: 500 52px/1.5 Sage UI;
171
- --global-typography-adaptive-component-notification-m: 500 12px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
172
- --global-font-size-adaptive-step-minus2: 11px;
173
- --global-font-size-adaptive-step-minus1: 12px;
175
+ --global-typography-adaptive-component-notification-m: 500 13px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
176
+ --global-font-size-adaptive-step-minus2: 12px;
177
+ --global-font-size-adaptive-step-minus1: 13px;
174
178
  --global-font-size-adaptive-step0: 14px;
175
179
  --global-font-size-adaptive-step1: 16px;
176
180
  --global-font-size-adaptive-step2: 18px;
package/css/marketing/small/components/container.css CHANGED
@@ -7,10 +7,13 @@
7
7
  --container-size-dialog-max-width-xxs: 300;
8
8
  --container-size-dialog-max-width-xs: 380;
9
9
  --container-size-dialog-max-width-s: 540;
10
- --container-size-dialog-max-width-m: 750;
11
- --container-size-dialog-max-width-l: 850;
10
+ --container-size-dialog-max-width-m: 850;
11
+ --container-size-dialog-max-width-l: 1080;
12
12
  --container-size-dialog-max-width-xl: 960;
13
13
  --container-size-dialog-max-width-xxl: 1080;
14
+ --container-size-dialog-min-width-s: 288;
15
+ --container-size-dialog-min-width-m: 288;
16
+ --container-size-dialog-min-width-l: 288;
14
17
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
15
18
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
16
19
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
package/css/marketing/small/components/nav.css CHANGED
@@ -3,6 +3,8 @@
3
3
  */
4
4
 
5
5
  :root {
6
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
7
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
6
8
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
7
9
  --nav-color-bg-default: var(--modes-color-generic-bg-nought); /* nav bar bg */
8
10
  --nav-color-item-bg-enabled: var(--modes-color-none);
@@ -18,16 +20,16 @@
18
20
  --nav-color-topnav-item-bg-active: var(--modes-color-interactive-nav-active);
19
21
  --nav-color-topnav-item-bg-enabled: var(--modes-color-none);
20
22
  --nav-color-topnav-item-bg-hover: var(--modes-color-interactive-nav-hover);
21
- --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-s);
23
+ --nav-typography-adaptive-label-s: var(--global-typography-adaptive-component-firm-xs);
22
24
  --nav-typography-adaptive-label-m: var(--global-typography-adaptive-component-firm-m);
23
25
  --nav-typography-adaptive-label-l: var(--global-typography-adaptive-component-firm-l);
24
- --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-s);
26
+ --nav-typography-adaptive-default-s: var(--global-typography-adaptive-component-moderate-xs);
25
27
  --nav-typography-adaptive-default-m: var(--global-typography-adaptive-component-moderate-m);
26
28
  --nav-typography-adaptive-default-l: var(--global-typography-adaptive-component-moderate-l);
27
- --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-s);
29
+ --nav-typography-responsive-label-s: var(--global-typography-responsive-component-firm-xs);
28
30
  --nav-typography-responsive-label-m: var(--global-typography-responsive-component-firm-m);
29
31
  --nav-typography-responsive-label-l: var(--global-typography-responsive-component-firm-l);
30
- --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-s);
32
+ --nav-typography-responsive-default-s: var(--global-typography-responsive-component-moderate-xs);
31
33
  --nav-typography-responsive-default-m: var(--global-typography-responsive-component-moderate-m);
32
34
  --nav-typography-responsive-default-l: var(--global-typography-responsive-component-moderate-l);
33
35
  --nav-color-item-bg-active: var(--modes-color-interactive-monochrome-active);
package/css/marketing/small/components/page.css CHANGED
@@ -9,6 +9,8 @@
9
9
  --page-typography-responsive-h3: var(--global-typography-responsive-heading-s);
10
10
  --page-typography-responsive-h4: var(--global-typography-responsive-subheading-l);
11
11
  --page-typography-responsive-h5: var(--global-typography-responsive-subheading-m);
12
+ --page-typography-responsive-section-heading-s: var(--global-typography-responsive-section-heading-s);
13
+ --page-typography-responsive-section-heading-m: var(--global-typography-responsive-section-heading-m);
12
14
  --page-typography-responsive-p-regular-typical: var(--global-typography-responsive-body-regular-s);
13
15
  --page-typography-responsive-p-regular-large: var(--global-typography-responsive-body-regular-l);
14
16
  --page-typography-responsive-p-medium-typical: var(--global-typography-responsive-body-medium-s);
@@ -18,6 +20,8 @@
18
20
  --page-typography-adaptive-h3: var(--global-typography-adaptive-heading-s);
19
21
  --page-typography-adaptive-h4: var(--global-typography-adaptive-subheading-l);
20
22
  --page-typography-adaptive-h5: var(--global-typography-adaptive-subheading-m);
23
+ --page-typography-adaptive-section-heading-s: var(--global-typography-adaptive-section-heading-s);
24
+ --page-typography-adaptive-section-heading-m: var(--global-typography-adaptive-section-heading-m);
21
25
  --page-typography-adaptive-p-regular-typical: var(--global-typography-adaptive-body-regular-s);
22
26
  --page-typography-adaptive-p-regular-large: var(--global-typography-adaptive-body-regular-l);
23
27
  --page-typography-adaptive-p-medium-typical: var(--global-typography-adaptive-body-medium-s);
package/css/marketing/small/global.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-responsive-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-responsive-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-responsive-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-responsive-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-responsive-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-responsive-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-responsive-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-responsive-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -138,6 +140,8 @@
138
140
  --global-typography-adaptive-heading-l: 700 25px/1.25 Sage UI;
139
141
  --global-typography-adaptive-subheading-m: 500 16px/1.25 Sage UI;
140
142
  --global-typography-adaptive-subheading-l: 500 17px/1.25 Sage UI;
143
+ --global-typography-adaptive-section-heading-s: 700 16px/1.25 Sage UI;
144
+ --global-typography-adaptive-section-heading-m: 700 19px/1.25 Sage UI;
141
145
  --global-typography-adaptive-body-regular-s: 400 14px/1.5 Sage UI;
142
146
  --global-typography-adaptive-body-regular-m: 400 14px/1.5 Sage UI;
143
147
  --global-typography-adaptive-body-regular-l: 400 16px/1.5 Sage UI;
package/css/product/all.css CHANGED
@@ -102,6 +102,8 @@
102
102
  --global-typography-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;
103
103
  --global-typography-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
104
104
  --global-typography-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;
105
+ --global-typography-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;
106
+ --global-typography-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;
105
107
  --global-typography-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;
106
108
  --global-typography-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;
107
109
  --global-typography-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;
@@ -1116,10 +1118,13 @@
1116
1118
  --container-size-dialog-max-width-xxs: 300;
1117
1119
  --container-size-dialog-max-width-xs: 380;
1118
1120
  --container-size-dialog-max-width-s: 540;
1119
- --container-size-dialog-max-width-m: 750;
1120
- --container-size-dialog-max-width-l: 850;
1121
+ --container-size-dialog-max-width-m: 850;
1122
+ --container-size-dialog-max-width-l: 1080;
1121
1123
  --container-size-dialog-max-width-xl: 960;
1122
1124
  --container-size-dialog-max-width-xxl: 1080;
1125
+ --container-size-dialog-min-width-s: 288;
1126
+ --container-size-dialog-min-width-m: 288;
1127
+ --container-size-dialog-min-width-l: 288;
1123
1128
  --container-opacity-carousel-hidden: 0.3; /* opacity applied to next and previous carousel slides */
1124
1129
  --container-opacity-dialog-dimmer: 0.4; /* dimmer opacity value */
1125
1130
  --container-opacity-drag-ghost: 0.5; /* drag ghost state opacity value */
@@ -1790,6 +1795,8 @@
1790
1795
  --logo-space-ai-xg-m: var(--global-space-micro-l); /* Space between star icon and text */
1791
1796
 
1792
1797
  /* nav component tokens */
1798
+ --nav-size-leftnav-parent-container-fixed-width: 140; /* fixed width of parent container */
1799
+ --nav-size-leftnav-child-container-fixed-width: 250; /* fixed width of parent container */
1793
1800
  --nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
1794
1801
  --nav-color-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* nav bar bg */
1795
1802
  --nav-color-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
@@ -1805,10 +1812,10 @@
1805
1812
  --nav-color-topnav-item-bg-active: light-dark(var(--modes-color-interactive-nav-active-light), var(--modes-color-interactive-nav-active-dark));
1806
1813
  --nav-color-topnav-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
1807
1814
  --nav-color-topnav-item-bg-hover: light-dark(var(--modes-color-interactive-nav-hover-light), var(--modes-color-interactive-nav-hover-dark));
1808
- --nav-typography-label-s: var(--global-typography-component-firm-s);
1815
+ --nav-typography-label-s: var(--global-typography-component-firm-xs);
1809
1816
  --nav-typography-label-m: var(--global-typography-component-firm-m);
1810
1817
  --nav-typography-label-l: var(--global-typography-component-firm-l);
1811
- --nav-typography-default-s: var(--global-typography-component-moderate-s);
1818
+ --nav-typography-default-s: var(--global-typography-component-moderate-xs);
1812
1819
  --nav-typography-default-m: var(--global-typography-component-moderate-m);
1813
1820
  --nav-typography-default-l: var(--global-typography-component-moderate-l);
1814
1821
  --nav-color-item-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
@@ -1943,6 +1950,8 @@
1943
1950
  --page-typography-h3: var(--global-typography-heading-s);
1944
1951
  --page-typography-h4: var(--global-typography-subheading-l);
1945
1952
  --page-typography-h5: var(--global-typography-subheading-m);
1953
+ --page-typography-section-heading-s: var(--global-typography-section-heading-s);
1954
+ --page-typography-section-heading-m: var(--global-typography-section-heading-m);
1946
1955
  --page-typography-p-regular-typical: var(--global-typography-body-regular-s);
1947
1956
  --page-typography-p-regular-large: var(--global-typography-body-regular-l);
1948
1957
  --page-typography-p-medium-typical: var(--global-typography-body-medium-s);
@@ -2573,8 +2582,6 @@
2573
2582
  --global-space-macro-l: 32px;
2574
2583
  --global-space-macro-xl: 40px;
2575
2584
  --global-space-macro-xxl: 48px;
2576
- --global-font-size-adaptive-step-minus2: 11px;
2577
- --global-font-size-adaptive-step-minus1: 12px;
2578
2585
  --global-font-size-adaptive-step2: 18px;
2579
2586
  --global-font-size-adaptive-step3: 21px;
2580
2587
  --global-font-size-adaptive-step4: 24px;