mp-design-system 0.9.6 → 0.9.16

Sign up to get free protection for your applications and to get access to all the features.
Files changed (33) hide show
  1. package/dist/build/scss/library.css +1 -1
  2. package/dist/build/scss/library.css.map +1 -1
  3. package/dist/build/scss/main.css +1 -1
  4. package/dist/build/scss/main.css.map +1 -1
  5. package/package.json +1 -1
  6. package/src/_includes/components/accordion/macro.njk +1 -1
  7. package/src/_includes/components/features-table/features-table.config.js +16 -0
  8. package/src/_includes/components/features-table/features-table.njk +360 -0
  9. package/src/_includes/components/features-table/features-table.scss +101 -0
  10. package/src/_includes/components/features-table/macro.njk +5 -0
  11. package/src/_includes/components/footer/footer.scss +2 -2
  12. package/src/_includes/components/header/header.scss +15 -1
  13. package/src/_includes/components/post-meta/post-meta.config.js +9 -0
  14. package/src/_includes/components/post-meta/post-meta.njk +8 -2
  15. package/src/_includes/components/table/table.scss +13 -0
  16. package/src/_includes/library-navigation/brand-nav.njk +2 -1
  17. package/src/_includes/navigation/corporate.njk +5 -2
  18. package/src/assets/scss/components/index.scss +1 -0
  19. package/src/assets/scss/components/lightbox.scss +1 -0
  20. package/src/assets/scss/library.scss +15 -2
  21. package/src/assets/scss/objects/grid.scss +46 -91
  22. package/src/assets/scss/objects/prose.scss +2 -1
  23. package/src/assets/scss/utilities/hr.scss +4 -0
  24. package/src/assets/scss/utilities/link.scss +13 -1
  25. package/src/assets/scss/utilities/space.scss +16 -0
  26. package/src/assets/scss/utilities/typography.scss +4 -0
  27. package/src/brand/colors.njk +15 -6
  28. package/src/brand/illustration.md +44 -0
  29. package/src/brand/images.md +1 -1
  30. package/src/components/grid/generic.njk +31 -0
  31. package/src/components/grid/index.njk +21 -2
  32. package/src/components/grid/layout.njk +5 -5
  33. package/src/prototype/sections.njk +290 -0
@@ -0,0 +1,290 @@
1
+ ---
2
+ title: Electronics and semiconductors
3
+ tags: prototype
4
+ tagTitle: Industry
5
+ ---
6
+
7
+ {% from "components/breadcrumb/macro.njk" import breadcrumb %}
8
+ {% from "components/button/macro.njk" import button %}
9
+ {% from "components/twi/macro.njk" import twi %}
10
+ {% from "components/usp/macro.njk" import usp %}
11
+ {% from "components/icon/macro.njk" import icon %}
12
+ {% from "components/table/macro.njk" import tableRow %}
13
+ {% from "components/scroll-spy/macro.njk" import scrollSpy %}
14
+ {% from "components/embed/macro.njk" import youtube %}
15
+ {% from "components/card/macro.njk" import card %}
16
+ {% from "components/hero/macro.njk" import hero %}
17
+ {% from "components/prose/macro.njk" import prose, markdown %}
18
+ {% from "components/industry-card/macro.njk" import industryCard %}
19
+ {% from "components/accordion/macro.njk" import accordion %}
20
+
21
+ {% set siteNav %}{% include "navigation/corporate.njk" %}{% endset %}
22
+
23
+ {% extends "page.njk" %}
24
+
25
+ {% block content %}
26
+
27
+ {{ hero({
28
+ cover: true,
29
+ title: 'Electronics and semiconductors',
30
+ subtitle: 'Metrology solutions for bulk and thin film-based electronic components manufacturing',
31
+ image: {
32
+ src: 'https://p3.aprimocdn.net/malvernpanalytical/6cf60425-be4e-4ef4-a3fd-ad9e00b48b9d/636216818448697566FA_Original%20file.jpg?quality=60&width=1920',
33
+ alt: 'Computer circuit board'
34
+ },
35
+ breadcrumb: {
36
+ link: '/prototype/',
37
+ label: 'Solutions'
38
+ },
39
+ cta: {
40
+ label: 'Download brochure',
41
+ link: '#',
42
+ attrs: 'download',
43
+ icon: 'file'
44
+ }
45
+ }) }}
46
+
47
+ <div class="c-slat--white">
48
+
49
+ <div class="mp u-wrap o-grid o-grid--layout o-grid--3/8 o-grid--pull u-pad-bottom-l">
50
+ <aside>
51
+ {{ scrollSpy({
52
+ links: [
53
+ { link: '#introduction', label: 'Introduction' },
54
+ { link: '#faqs', label: 'FAQs' },
55
+ { link: '#use-cases', label: 'Use cases' },
56
+ { link: '#our-solutions', label: 'Our solutions' }
57
+ ]
58
+ }) }}
59
+ </aside>
60
+
61
+ <main class="u-flow--lined">
62
+
63
+ <div class="mp o-prose u-flow--prose" id="introduction">
64
+ {{ markdown({
65
+ content: '
66
+ The advancements in materials research and semiconductor technology have brought great changes to the way we live. They have driven developments in almost every aspect of our daily life – phones, smart wearables and toys, laptops, wireless networks, home infotainment systems, cars, and smart meters.
67
+
68
+ The electronic display, data storage, and RF filter technology industries have rapidly advanced, and the rate of change continues to follow Moore’s law. Growth technologies now allow the deposition of multilayered structures with individual layers exhibiting film thickness from microns down to monolayers.
69
+
70
+ Typical materials involved in advanced thin film devices are semiconductors, metal alloys, dielectrics, oxides, and polymers. This mandates accurate monitoring and control of the device parameters using multiple investigation techniques. Equally important is the fine control over the process materials, like CMP slurry, which is an indispensable part of any thin-film device manufacturing.'
71
+ }) }}
72
+ </div>
73
+
74
+ <div id="sub-navigation" class="u-flow--m">
75
+ <p class="c-h c-h--upper">Explore electronics and semiconductors</p>
76
+ <div class="o-grid o-grid--of-three-early">
77
+ {{ industryCard({
78
+ title: 'CMP slurry',
79
+ link: '',
80
+ image: {
81
+ src: 'https://www.malvernpanalytical.com/resource/img/placeholder.png?quality=60',
82
+ alt: ''
83
+ }
84
+ }) }}
85
+ {{ industryCard({
86
+ title: 'Compound semiconductors',
87
+ link: '',
88
+ image: {
89
+ src: 'https://p3.aprimocdn.net/malvernpanalytical/2a4841c3-3218-41cb-a49a-ada400dc8e6e/637375900710142760TV_Original%20file.jpg?width=546&quality=60',
90
+ alt: ''
91
+ }
92
+ }) }}
93
+ {{ industryCard({
94
+ title: 'Electronic displays',
95
+ link: '',
96
+ image: {
97
+ src: 'https://p3.aprimocdn.net/malvernpanalytical/6756e7df-854b-4db6-b382-ad9e00b6cdf5/636216831251979479QM_Original%20file.jpg?width=546&quality=60',
98
+ alt: ''
99
+ }
100
+ }) }}
101
+ {{ industryCard({
102
+ title: 'Silicon semiconductors',
103
+ link: '',
104
+ image: {
105
+ src: 'https://p3.aprimocdn.net/malvernpanalytical/191d517a-c7db-47cf-b355-ada400dc9712/637375900732432363PP_Original%20file.jpg?width=546&quality=60',
106
+ alt: ''
107
+ }
108
+ }) }}
109
+ {{ industryCard({
110
+ title: 'Solder materials',
111
+ link: '',
112
+ image: {
113
+ src: 'https://p3.aprimocdn.net/malvernpanalytical/01c4351e-bead-42ed-8c03-ada400dc9f9b/637375900737062201CL_Original%20file.jpg?width=546&quality=60',
114
+ alt: ''
115
+ }
116
+ }) }}
117
+ </div>
118
+ </div>
119
+
120
+ {{ youtube({
121
+ title: 'Semiconductor frontend solutions',
122
+ id: 'xWf5rKEEGYI'
123
+ }) }}
124
+
125
+ <div class="mp o-prose u-flow--prose" id="faqs">
126
+ <h2>Frequently asked questions</h2>
127
+ {{ accordion({
128
+ items: [
129
+ {
130
+ title: 'Do I need to prepare the workspace prior to installation?',
131
+ content: 'All instruments need a power source, and some have additional requirements such as a water supply or waste extraction. Where this the case, we will advise you prior to shipping your instrument.'
132
+ },
133
+ {
134
+ title: 'What specialist skills or knowledge are required?',
135
+ content: 'You don\'t need any specialist skills or knowledge to perform a Smart Install. Simply follow the instructions provided.'
136
+ },
137
+ {
138
+ title: 'Do I need specialist tools or equipment to Smart Install a new instrument?',
139
+ content: '<ul><li>For installation of a Mastersizer or Zetasizer system, you will need a computer with internet access in order to view the installation guides. For installation of an Epsilon 1 XRF instrument, you will also need a smartphone or tablet to connect with our support personnel via a secure, augmented reality (AR) platform.</li><li>Everything else you need to install your new instrument will be provided.</li></ul>'
140
+ },
141
+ {
142
+ title: 'What languages are available for the Smart Install guides?',
143
+ content: '<ul><li>Mastersizer: English, Chinese, Korean, French, German and Japanese</li><li>Zetasizer: English, Chinese, Korean, French, German and Japanese</li><li>Epsilon 1: English, French, German and Japanese, Spanish and Portuguese</li></ul>'
144
+ }
145
+ ]
146
+ }) }}
147
+ </div>
148
+
149
+ <div class="mp o-prose u-flow--prose" id="use-cases">
150
+ <h2>Analytical solutions for the electronics industry</h2>
151
+ <p>Malvern Panalytical is closely associated with the electronics industry with a wide range of solutions across the entire value chain:</p>
152
+
153
+ {{ markdown({
154
+ content: '
155
+ - XRF ([2830 ZT](#)) delivers thickness and composition information for a wide range of thin films, with contamination and dopant levels and surface uniformity on wafers up to 300mm in size.
156
+ - XRD ([X\'Pert3 MRD](#) and [X\'Pert3 MRD XL](#)) provides absolute, calibration-free, and accurate information on crystal growth, giving material composition, film thickness, grading profile, and phase and crystal quality.
157
+ - Laser diffraction ([Mastersizer 3000](#)) measures particle size distribution in powder and slurry dispersions, e.g. CMP slurry and electronic display materials.
158
+ - Imaging ([Morphologi 4](#)) analyzes particle shape and morphology using automated imaging.
159
+ - Zeta potential ([Zetasizer Range](#)) determines the stability of slurries used in the electronics industry through the measurement of zeta potential. It also measures particle size in nano-particle suspensions.
160
+ - GPC/SEC ([OMNISEC](#)) analyses size, molecular weight, intrinsic viscosity, branching, and other parameters for polymers used in the electronics industry.
161
+ - XRF ([Epsilon 4](#)): A chemical composition analysis of raw materials and finished products and RoHS/WEEE analysis of electronic components.
162
+ - XRD ([Aeris](#)): A crystalline phase analysis of raw materials and finished products in electronics industry.'
163
+ }) }}
164
+ </div>
165
+
166
+ <div id="our-solutions" class="u-flow--m">
167
+ <h4 class="c-h c-h--upper">Our solutions</h4>
168
+ <div class="o-grid o-grid--of-three-late">
169
+ {{ card({
170
+ theme: {
171
+ layout: 'single',
172
+ size: 'medium',
173
+ border: true
174
+ },
175
+ image: {
176
+ src: '/static/img/microcal.jpg',
177
+ alt: ''
178
+ },
179
+ header: { title: '2830 ZT' },
180
+ body: { content: '<p>Advanced semiconductor thin film metrology tool</p>' },
181
+ link: '/prototype/product'
182
+ }) }}
183
+ {{ card({
184
+ theme: {
185
+ layout: 'single',
186
+ size: 'medium',
187
+ border: true
188
+ },
189
+ image: {
190
+ src: '/static/img/empyrean.jpg',
191
+ alt: ''
192
+ },
193
+ header: { title: 'X\'Pert3' },
194
+ body: { content: '<p>The improved X\'Pert platform</p>' },
195
+ link: '/prototype/product'
196
+ }) }}
197
+ {{ card({
198
+ theme: {
199
+ layout: 'single',
200
+ size: 'medium',
201
+ border: true
202
+ },
203
+ image: {
204
+ src: '/static/img/mastersizer.jpg',
205
+ alt: ''
206
+ },
207
+ header: { title: 'Mastersizer 3000' },
208
+ body: { content: '<p>Industry-leading particle size analyzer</p>' },
209
+ link: '/prototype/product'
210
+ }) }}
211
+ {{ card({
212
+ theme: {
213
+ layout: 'single',
214
+ size: 'medium',
215
+ border: true
216
+ },
217
+ image: {
218
+ src: '/static/img/zetasizer.jpg',
219
+ alt: ''
220
+ },
221
+ header: { title: 'Zetasizer' },
222
+ body: { content: '<p>Nanoparticle and zeta potential analysis</p>' },
223
+ link: '/prototype/product'
224
+ }) }}
225
+ {{ card({
226
+ theme: {
227
+ layout: 'single',
228
+ size: 'medium',
229
+ border: true
230
+ },
231
+ image: {
232
+ src: '/static/img/omnisec.jpg',
233
+ alt: ''
234
+ },
235
+ header: { title: 'OMNISEC' },
236
+ body: { content: '<p>GPC/SEC solution for the measurement of absolute molecular weight, intrinsic viscosity and other polymer parameters</p>' },
237
+ link: '/prototype/product'
238
+ }) }}
239
+ {{ card({
240
+ theme: {
241
+ layout: 'single',
242
+ size: 'medium',
243
+ border: true
244
+ },
245
+ image: {
246
+ src: '/static/img/epsilon.jpg',
247
+ alt: ''
248
+ },
249
+ header: { title: 'Epsilon 4' },
250
+ body: { content: '<p>Benchtop XRF for chemical composition and impurity analysis</p>' },
251
+ link: '/prototype/product'
252
+ }) }}
253
+ {{ card({
254
+ theme: {
255
+ layout: 'single',
256
+ size: 'medium',
257
+ border: true
258
+ },
259
+ image: {
260
+ src: '/static/img/aeris.jpg',
261
+ alt: ''
262
+ },
263
+ header: { title: 'Aeris' },
264
+ body: { content: '<p>Compact XRD to measure crystallite size and crystal phase</p>' },
265
+ link: '/prototype/product'
266
+ }) }}
267
+ {{ card({
268
+ theme: {
269
+ layout: 'single',
270
+ size: 'medium',
271
+ border: true
272
+ },
273
+ image: {
274
+ src: '/static/img/morphologi.jpg',
275
+ alt: ''
276
+ },
277
+ header: { title: 'Morphologi 4' },
278
+ body: { content: '<p>Particle shape analysis with high statistical accuracy</p>' },
279
+ link: '/prototype/product'
280
+ }) }}
281
+ </div>
282
+ </div>
283
+
284
+ </main>
285
+ </div>
286
+
287
+ {% include "includes/resources.njk" %}
288
+
289
+ </div>
290
+ {% endblock %}