@pinuts/bsr-uikit-relaunch 0.2.41 → 0.2.44

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 (4) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/styles/_form.scss +1 -0
  3. package/dist/styles/variables/_fonts.scss +71 -66
  4. package/package.json +1 -1
package/dist/styles/_form.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  #addressSelector {
6
6
  display: flex;
7
7
  flex-direction: column;
8
+ font-family: $fontfamily-base;
8
9
 
9
10
  .row .col:has(input):not(:has(fieldset)) {
10
11
  margin-bottom: $base-gap * 10;
package/dist/styles/variables/_fonts.scss CHANGED
@@ -1,3 +1,8 @@
1
+ @use "sass:math";
2
+ @function to-rem($size) {
3
+ @return math.div($size, 16px) * 1rem;
4
+ }
5
+
1
6
  /* TradeGothicNextSR Regular */
2
7
  /* @font-face {
3
8
  font-family: "TradeGothicNextSR";
@@ -39,112 +44,112 @@
39
44
  src: local(""), url("../../assets/fonts/TradeGothicNextLT/TradeGothicNextCondensed_normal_condensed.woff2") format("woff2");
40
45
  }
41
46
  */
42
- $fontsize-base: 18px;
47
+ $fontsize-base: to-rem(18px);
43
48
 
44
49
  $fontfamily-base: "TradeGothicNext", sans-serif;
45
50
  $fontfamily-heading: "TradeGothicNextSR", sans-serif;
46
51
 
47
52
  /* Font sizes */
48
- $h1-fontsize: 48px;
49
- $h2-fontsize: 36px;
50
- $h3-fontsize: 28px;
53
+ $h1-fontsize: to-rem(48px);
54
+ $h2-fontsize: to-rem(36px);
55
+ $h3-fontsize: to-rem(28px);
51
56
 
52
- $h1-fontsize-sm: 32px;
53
- $h2-fontsize-sm: 24px;
54
- $h3-fontsize-sm: 20px;
57
+ $h1-fontsize-sm: to-rem(32px);
58
+ $h2-fontsize-sm: to-rem(24px);
59
+ $h3-fontsize-sm: to-rem(20px);
55
60
 
56
- $sub-headline-font-size: 24px;
57
- $sub-headline-font-size-sm: 18px;
61
+ $sub-headline-font-size: to-rem(24px);
62
+ $sub-headline-font-size-sm: to-rem(18px);
58
63
 
59
- $quote-font-size: 28px;
60
- $quote-font-size-sm: 22px;
64
+ $quote-font-size: to-rem(28px);
65
+ $quote-font-size-sm: to-rem(22px);
61
66
 
62
- $intro-text-font-size: 20px;
63
- $intro-text-font-size-sm: 18px;
67
+ $intro-text-font-size: to-rem(20px);
68
+ $intro-text-font-size-sm: to-rem(18px);
64
69
 
65
- $copy-text-small-font-size: 16px;
70
+ $copy-text-small-font-size: to-rem(16px);
66
71
 
67
- $label-forms-font-size: 14px;
68
- $supporting-text-font-size: 14px;
72
+ $label-forms-font-size: to-rem(14px);
73
+ $supporting-text-font-size: to-rem(14px);
69
74
 
70
- $nav-e1-font-size: 20px;
71
- $nav-e1-font-size-sm: 18px;
75
+ $nav-e1-font-size: to-rem(20px);
76
+ $nav-e1-font-size-sm: to-rem(18px);
72
77
 
73
- $nav-e2-font-size: 20px;
74
- $nav-e2-font-size-sm: 18px;
78
+ $nav-e2-font-size: to-rem(20px);
79
+ $nav-e2-font-size-sm: to-rem(18px);
75
80
 
76
- $nav-e3-font-size: 16px;
81
+ $nav-e3-font-size: to-rem(16px);
77
82
 
78
- $navigation-navLinks-font-size: 20px;
79
- $navigation-navLinks-font-size-sm: 18px;
80
- $navigation-linkList-font-size: 16px;
81
- $navigation-teaserText-font-size: 16px;
82
- $navigation-additionalLinks-font-size: 14px;
83
+ $navigation-navLinks-font-size: to-rem(20px);
84
+ $navigation-navLinks-font-size-sm: to-rem(18px);
85
+ $navigation-linkList-font-size: to-rem(16px);
86
+ $navigation-teaserText-font-size: to-rem(16px);
87
+ $navigation-additionalLinks-font-size: to-rem(14px);
83
88
 
84
89
 
85
- $inputField-font-size: 18px;
86
- $input-label-font-size: 14px;
87
- $editingBtn-font-size: 14px;
88
- $textlink-subline-font-size: 14px;
90
+ $inputField-font-size: to-rem(18px);
91
+ $input-label-font-size: to-rem(14px);
92
+ $editingBtn-font-size: to-rem(14px);
93
+ $textlink-subline-font-size: to-rem(14px);
89
94
 
90
- $listItem-font-size: 18px;
95
+ $listItem-font-size: to-rem(18px);
91
96
 
92
97
  /* Line heights */
93
- $lineheight-base: 26px;
98
+ $lineheight-base: to-rem(26px);
94
99
 
95
- $h1-lineheight: 56px;
96
- $h2-lineheight: 52px;
97
- $h3-lineheight: 36px;
100
+ $h1-lineheight: to-rem(56px);
101
+ $h2-lineheight: to-rem(52px);
102
+ $h3-lineheight: to-rem(36px);
98
103
 
99
- $h1-lineheight-sm: 40px;
100
- $h2-lineheight-sm: 32px;
101
- $h3-lineheight-sm: 28px;
104
+ $h1-lineheight-sm: to-rem(40px);
105
+ $h2-lineheight-sm: to-rem(32px);
106
+ $h3-lineheight-sm: to-rem(28px);
102
107
 
103
- $sub-headline-line-height: 36px;
104
- $sub-headline-line-height-sm: 28px;
108
+ $sub-headline-line-height: to-rem(36px);
109
+ $sub-headline-line-height-sm: to-rem(28px);
105
110
 
106
- $quote-line-height: 36px;
107
- $quote-line-height-sm: 30px;
111
+ $quote-line-height: to-rem(36px);
112
+ $quote-line-height-sm: to-rem(30px);
108
113
 
109
- $intro-text-line-height: 28px;
110
- $intro-text-line-height-sm: 26px;
114
+ $intro-text-line-height: to-rem(28px);
115
+ $intro-text-line-height-sm: to-rem(26px);
111
116
 
112
- $copy-text-default-line-height: 26px;
117
+ $copy-text-default-line-height: to-rem(26px);
113
118
 
114
- $copy-text-small-line-height: 24px;
119
+ $copy-text-small-line-height: to-rem(24px);
115
120
 
116
- $label-forms-line-height: 20px;
121
+ $label-forms-line-height: to-rem(20px);
117
122
 
118
- $supporting-text-line-height: 20px;
123
+ $supporting-text-line-height: to-rem(20px);
119
124
 
120
- $nav-e1-line-height: 24px;
125
+ $nav-e1-line-height: to-rem(24px);
121
126
 
122
- $nav-e2-line-height: 24px;
127
+ $nav-e2-line-height: to-rem(24px);
123
128
 
124
- $nav-e3-line-height: 20px;
125
- $nav-e3-line-height-sm: 22px;
129
+ $nav-e3-line-height: to-rem(20px);
130
+ $nav-e3-line-height-sm: to-rem(22px);
126
131
 
127
- $button-text-line-height: 24px;
132
+ $button-text-line-height: to-rem(24px);
128
133
 
129
- $navigation-navLinks-line-height: 24px;
130
- $navigation-linkList-line-height: 20px;
131
- $navigation-additionalLinks-line-height: 20px;
134
+ $navigation-navLinks-line-height: to-rem(24px);
135
+ $navigation-linkList-line-height: to-rem(20px);
136
+ $navigation-additionalLinks-line-height: to-rem(20px);
132
137
 
133
- $inputField-line-height: 26px;
134
- $input-label-line-height: 20px;
135
- $editingBtnAtom-line-height: 20px;
136
- $textlink-line-height: 26px;
138
+ $inputField-line-height: to-rem(26px);
139
+ $input-label-line-height: to-rem(20px);
140
+ $editingBtnAtom-line-height: to-rem(20px);
141
+ $textlink-line-height: to-rem(26px);
137
142
 
138
- $listItem-line-height: 26px;
143
+ $listItem-line-height: to-rem(26px);
139
144
 
140
145
  /* Font weights */
141
146
  $fontweight-normal: 400;
142
147
  $fontweight-bold: 700;
143
148
 
144
149
  /* Letter spacing */
145
- $letter-spacing-xs: 0.2px;
146
- $letter-spacing-sm: 0.32px;
147
- $letter-spacing-md: 0.4px;
148
- $letter-spacing-lg: 1px;
150
+ $letter-spacing-xs: to-rem(0.2px);
151
+ $letter-spacing-sm: to-rem(0.32px);
152
+ $letter-spacing-md: to-rem(0.4px);
153
+ $letter-spacing-lg: to-rem(1px);
149
154
 
150
- $letter-spacing-button-text: 0.036px;
155
+ $letter-spacing-button-text: to-rem(0.036px);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pinuts/bsr-uikit-relaunch",
3
- "version": "0.2.41",
3
+ "version": "0.2.44",
4
4
  "private": false,
5
5
  "description": "BSR UI-KIT Relaunch",
6
6
  "main": "dist/index.js",