Skip to content

Commit 51e18fb

Browse files
committed
explore section responsiveness
1 parent a51ecc8 commit 51e18fb

1 file changed

Lines changed: 116 additions & 41 deletions

File tree

ims-apis.html

Lines changed: 116 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -210,51 +210,126 @@ <h4>Active 3rd party ecosystem</h4>
210210
</section>
211211

212212
<!-- =========================== Try it out! =========================== -->
213-
<div class="zs-gray-section ibm-background-gray">
214-
<section class="zs-section apis-gray-card-container">
215-
<!--Header -->
216-
<div class="pure-u-1 pure-u-sm-1 pure-u-md-5-24 ibm-padding-bottom-1">
217-
<h2>Check it out!</h2>
213+
<section class="light-gray-bg pure-g">
214+
<div class="pure-u-1 pure-u-md-1-4 section-header">
215+
<h2>Check it out!</h2>
216+
</div>
217+
<div class="pure-u-1 pure-u-md-3-4">
218+
<div class="pure-g pure-g-pad">
219+
<div class="pure-u-1 pure-u-sm-1-2">
220+
<div class="pure-g">
221+
<div class="pure-u-1-5 pure-u-md-1">
222+
<img
223+
src="wp-content/Icon_ZTrials_z OS ConnectPage.svg"
224+
alt=""
225+
class="icon-sm" />
226+
</div>
227+
<div class="pure-u-4-5 pure-u-md-1">
228+
<h3>z/OS Connect Designer tutorials</h3>
229+
<p><b>No installation required.</b></p>
230+
<p>
231+
Check out these videos on how to use z/OS Connect Designer.
232+
</p>
233+
<a
234+
target="_blank"
235+
rel="noopener noreferrer"
236+
aria-label="Watch this video on z/OS Connect Designer"
237+
href="https://mediacenter.ibm.com/playlist/details/1_ykaqj9pe">
238+
Watch →</a
239+
>
240+
</div>
241+
</div>
242+
</div>
243+
<div class="pure-u-1 pure-u-sm-1-2">
244+
<div class="pure-g">
245+
<div class="pure-u-1-5 pure-u-md-1">
246+
<img
247+
src="wp-content/Icon_API toolkit_z OS ConnectPage.svg"
248+
alt=""
249+
class="icon-sm" />
250+
</div>
251+
<div class="pure-u-4-5 pure-u-md-1">
252+
<h3>Get the API toolkit</h3>
253+
<p>
254+
IBM z/OS Connect base already installed? Design, map, and
255+
deploy your APIs with our Eclipse-based tooling.
256+
</p>
257+
<a
258+
target="_blank"
259+
rel="noopener noreferrer"
260+
aria-label="Learn more about the z/OS Connect API toolkit"
261+
href="https://www.ibm.com/products/zos-connect-enterprise-edition/pricing">
262+
Learn more →</a
263+
>
264+
</div>
265+
</div>
266+
</div>
218267
</div>
219-
<div class="pure-u-lg-2-24"></div>
268+
</div>
269+
</section>
220270

221-
<!-- Section contents -->
222-
<!-- s1 -->
223-
<div class="pure-u-1 pure-u-sm-1 pure-u-md-8-24 apis-gray-card">
224-
<img src="wp-content/Icon_ZTrials_z OS ConnectPage.svg" alt="" />
225-
<h3>z/OS Connect Designer tutorials</h3>
226-
<p><b>No installation required.</b></p>
227-
<p>Check out these videos on how to use z/OS Connect Designer.</p>
228-
<a
229-
target="_blank"
230-
rel="noopener noreferrer"
231-
aria-label="Watch this video on z/OS Connect Designer"
232-
href="https://mediacenter.ibm.com/playlist/details/1_ykaqj9pe">
233-
Watch →</a
234-
>
235-
</div>
236-
<!-- s2 -->
237-
<div class="pure-u-1 pure-u-sm-1 pure-u-md-8-24 apis-gray-card">
238-
<img
239-
src="wp-content/Icon_API toolkit_z OS ConnectPage.svg"
240-
alt="" />
241-
<h3>Get the API toolkit</h3>
242-
<p>
243-
IBM z/OS Connect base already installed? Design, map, and deploy
244-
your APIs with our Eclipse-based tooling.
245-
</p>
246-
<a
247-
target="_blank"
248-
rel="noopener noreferrer"
249-
aria-label="Learn more about the z/OS Connect API toolkit"
250-
href="https://www.ibm.com/products/zos-connect-enterprise-edition/pricing">
251-
Learn more →</a
252-
>
271+
<!-- =========================== Case studies =========================== -->
272+
<section class="dark-gray-bg pure-g">
273+
<div class="pure-u-1 pure-u-md-1-4 section-header">
274+
<h2>Case studies</h2>
275+
</div>
276+
<div class="pure-u-1 pure-u-md-3-4">
277+
<div class="pure-g pure-g-pad">
278+
<div class="pure-u-1 pure-u-sm-1-2">
279+
<div class="pure-g">
280+
<div class="pure-u-4-5 pure-u-md-1">
281+
<h3>
282+
Efficient, low-risk modernization of core banking
283+
applications
284+
</h3>
285+
<p>
286+
Java alongside COBOL preserves the best of both the IBM
287+
zSystems and distributed worlds.
288+
</p>
289+
<div>
290+
<img
291+
class="ims-card-icon-lg"
292+
src="wp-content/Icon_Atruvia_z OS ConnectPage.svg"
293+
alt="Atruvia logo" />
294+
</div>
295+
<a
296+
target="_blank"
297+
aria-label="Read the case study on Atruvia"
298+
rel="noopener noreferrer"
299+
href="https://www.ibm.com/case-studies/atruvia-ag">
300+
Read the case study →</a
301+
>
302+
</div>
303+
</div>
304+
</div>
305+
<div class="pure-u-1 pure-u-sm-1-2">
306+
<div class="pure-g">
307+
<div class="pure-u-1-5 pure-u-md-1">
308+
<img
309+
src="wp-content/Icon_API toolkit_z OS ConnectPage.svg"
310+
alt=""
311+
class="icon-sm" />
312+
</div>
313+
<div class="pure-u-4-5 pure-u-md-1">
314+
<h3>Get the API toolkit</h3>
315+
<p>
316+
IBM z/OS Connect base already installed? Design, map, and
317+
deploy your APIs with our Eclipse-based tooling.
318+
</p>
319+
<a
320+
target="_blank"
321+
rel="noopener noreferrer"
322+
aria-label="Learn more about the z/OS Connect API toolkit"
323+
href="https://www.ibm.com/products/zos-connect-enterprise-edition/pricing">
324+
Learn more →</a
325+
>
326+
</div>
327+
</div>
328+
</div>
253329
</div>
254-
</section>
255-
</div>
330+
</div>
331+
</section>
256332

257-
<!-- =========================== Case studies =========================== -->
258333
<div
259334
class="zs-gray-section ibm-background-white-core blue-purp apis-section-black">
260335
<section class="zs-section">

0 commit comments

Comments
 (0)