Skip to content

Commit 29db7a1

Browse files
hmillersarahhmillersarah
committed
benefits and customer stories sections
1 parent fd0a000 commit 29db7a1

3 files changed

Lines changed: 97 additions & 98 deletions

File tree

‎ims-java.html‎

Lines changed: 53 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -175,118 +175,77 @@ <h2>Get demos and code samples</h2>
175175
</section>
176176

177177
<!-- =========================== Java can save you time, money, and headaches =========================== -->
178-
179-
<!-- =========================== Value Icons =========================== -->
180-
<div class="zs-white-section benefits-sec">
181-
<section id="benefits-section" class="pure-g zs-section">
182-
183-
<div class="pure-u-1 pure-u-md-5-24">
184-
<h2 >Java can save you time, money, and headaches</h2>
185-
</div>
186-
187-
<div class="pure-u-md-1-24"></div>
188-
189-
<div class="pure-u-1 pure-u-md-6-24 benefits-card">
190-
<img src="wp-content/Icon_Cost_Java and IMSPage.svg" alt="" class="center">
178+
<section class="dark-gray-bg pure-g">
179+
<div class="pure-u-1 pure-u-lg-1-4">
180+
<h2 >Java can save you time, money, and headaches</h2>
181+
</div>
182+
<div class="pure-u-1 pure-u-md-1-3 pure-u-lg-1-4 pure-pad">
183+
<div>
184+
<img src="wp-content/Icon_Cost_Java and IMSPage.svg" alt="" class="icon">
191185
<h3>Cost</h3>
192186
<p>Java processing can be offloaded to specialty engines, which means you just saved some money.</p>
193187
</div>
194-
195-
<div class="pure-u-1 pure-u-md-6-24 benefits-card">
196-
<img src="wp-content/Icon_Application agility_Java and IMSPage.svg" alt="" class="center">
188+
</div>
189+
<div class="pure-u-1 pure-u-md-1-3 pure-u-lg-1-4 pure-pad">
190+
<div>
191+
<img src="wp-content/Icon_Application agility_Java and IMSPage.svg" alt="" class="icon">
197192
<h3 >Application agility</h3>
198193
<p>Choosing Java means you have access to millions of skilled developers who can write IMS applications.</p>
199194
</div>
200-
201-
<div class="pure-u-1 pure-u-md-6-24 benefits-card">
202-
<img src="wp-content/Icon_Co-location_Java and IMSPage.svg" alt="" class="center">
195+
</div>
196+
<div class="pure-u-1 pure-u-md-1-3 pure-u-lg-1-4 pure-pad">
197+
<div>
198+
<img src="wp-content/Icon_Co-location_Java and IMSPage.svg" alt="" class="icon">
203199
<h3 >Co-location</h3>
204-
<p>Running Java on z/OS, where your data resides, just savedyou some time.</p>
200+
<p>Running Java on z/OS, where your data resides, just saved you some time.</p>
205201
</div>
202+
</div>
203+
</section>
206204

207-
</section>
208-
</div>
209-
210-
<!-- =========================== Customer Stories =========================== -->
211-
<div class="zs-gray-section customer-sec">
212-
<section class="zs-section">
213-
214-
<!-- Info cards container -->
215-
<div class="pure-g customer-c-cont">
216-
217-
<!-- Section header -->
218-
<div class="pure-u-1">
219-
<h2>Don't just take our word for it</h2>
220-
</div>
221-
222-
<!-- Card 1 -->
223-
<div class="pure-u-1 pure-u-lg-1-3 customer-c-space">
224-
<!-- Set a maxwidth on this container to control card width, for now... -->
225-
<div class="zs-action-card ims-t-card">
226-
<div class="pure-g customer-c">
227-
<!-- Card content -->
228-
<div class="ibm-padding-top-1 ibm-padding-bottom-1 customer-c-space-inner">
229-
<div class="pure-u-1 ims-i-head">
230-
<h3>Java, COBOL, and IMS on IBM Z </h3>
231-
</div>
232-
<p>
233-
By Java-enabling existing IMS core banking functions, Fiducia & GAD is accelerating the creation of
234-
new services while extending the life and value of its applications.
235-
</p>
236-
<div class="pure-u-1">
237-
<img src="wp-content/uploads/sites/75/2018/05/fiducia.png" alt="Fiducia & GAD logo" class="center2">
238-
</div>
239-
</div>
205+
<!-- =========================== Customer stories =========================== -->
206+
<section class="gray-bg pure-g">
207+
<div class="pure-u-1 section-header">
208+
<h2>Don't just take our word for it</h2>
209+
</div>
210+
<div class="pure-u-1 pure-g">
211+
<div class="pure-u-lg-7-24 card">
212+
<div>
213+
<div>
214+
<h3>Java, COBOL, and IMS on IBM Z </h3>
215+
<p>
216+
By Java-enabling existing IMS core banking functions, Fiducia & GAD is accelerating the creation of
217+
new services while extending the life and value of its applications.
218+
</p>
240219
</div>
220+
<img src="wp-content/uploads/sites/75/2018/05/fiducia.png" alt="Fiducia & GAD logo">
241221
</div>
242222
</div>
243-
244-
<!-- Card 2 -->
245-
<div class="pure-u-1 pure-u-lg-1-3 customer-c-space">
246-
<!-- Set a maxwidth on this container to control card width, for now... -->
247-
<div class="zs-action-card ims-t-card">
248-
<div class="pure-g customer-c">
249-
<!-- Card content -->
250-
<div class="ibm-padding-top-1 ibm-padding-bottom-1 customer-c-space-inner">
251-
<div class="pure-u-1 ims-i-head">
252-
<h3>IMS and Java on IBM Z</h3>
253-
</div>
254-
<p>
255-
Implementing IMS ODBM and IMS Catalog allowed Travelers to leverage Java and SQL skills to access
256-
IMS and other data in a single view.
257-
</p>
258-
<div class="pure-u-1">
259-
<img src="wp-content/uploads/sites/75/2018/05/travelers-1.png" alt="Travelers logo" class="center2">
260-
</div>
261-
</div>
223+
<div class="pure-u-lg-7-24 card">
224+
<div>
225+
<div>
226+
<h3>IMS and Java on IBM Z</h3>
227+
<p>
228+
Implementing IMS ODBM and IMS Catalog allowed Travelers to leverage Java and SQL skills to access
229+
IMS and other data in a single view.
230+
</p>
262231
</div>
232+
<img src="wp-content/uploads/sites/75/2018/05/travelers-1.png" alt="Travelers logo">
263233
</div>
264234
</div>
265-
266-
<!-- Card 3 -->
267-
<div class="pure-u-1 pure-u-lg-1-3 customer-c-space">
268-
<!-- Set a maxwidth on this container to control card width, for now... -->
269-
<div class="zs-action-card ims-t-card">
270-
<div class="pure-g customer-c">
271-
<!-- Card content -->
272-
<div class="ibm-padding-top-1 ibm-padding-bottom-1 customer-c-space-inner">
273-
<div class="pure-u-1 ims-i-head">
274-
<h3>IMS, SQL, and open data access</h3>
275-
</div>
276-
<p>
277-
A large North American bank was able to improve application maintenance and lower costs by converting
278-
applications to Java and running them inside IMS for best performance.
279-
</p>
280-
<div class="pure-u-1 customer-c-logo">
281-
<h3>North American Bank</h3>
282-
</div>
283-
</div>
235+
<div class="pure-u-lg-7-24 card">
236+
<div>
237+
<div>
238+
<h3>IMS, SQL, and open data access </h3>
239+
<p>
240+
A large North American bank was able to improve application maintenance and lower costs by converting
241+
applications to Java and running them inside IMS for best performance.
242+
</p>
284243
</div>
244+
<h3 class="logo">North American Bank</h3>
285245
</div>
286246
</div>
287-
288-
</section>
289-
</div>
247+
</div>
248+
</section>
290249
</main>
291250

292251
<imscentral-footer></imscentral-footer>

‎web-components/footer/footer.css‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ footer {
22
background-color: #1c1c1c;
33
margin: 0;
44
padding: 1em;
5-
width: 100%;
65
}
76

87
footer > ul, footer > p {

‎wp-includes/css/page.css‎

Lines changed: 44 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,10 @@
7272
color: var(--white);
7373
}
7474

75+
.dark-gray-bg p {
76+
color: var(--white);
77+
}
78+
7579
.dark-gray-bg a {
7680
color: var(--font-light-blue);
7781
font-size: var(--plex-18);
@@ -211,6 +215,11 @@
211215
padding: 1.2em;
212216
}
213217

218+
/* For individual pure grid units requiring paddings */
219+
.pure-pad > div {
220+
padding: 1.2em;
221+
}
222+
214223
/* Format column group */
215224
.column-g > div {
216225
padding: 0.2em;
@@ -282,6 +291,33 @@
282291
}
283292
/* -------------------------------------------------------- */
284293

294+
/* Card */
295+
/* -------------------------------------------------------- */
296+
.card {
297+
background-color: white;
298+
margin: 1em 0em 1em 0em;
299+
padding: 1.5em;
300+
}
301+
302+
.card > div {
303+
display: flex;
304+
flex-flow: column nowrap;
305+
justify-content: center;
306+
align-items: center;
307+
}
308+
309+
/* Logo sizing */
310+
.card img {
311+
max-width: 16em;
312+
width: 100%;
313+
}
314+
315+
.logo {
316+
color: indigo !important;
317+
font-weight: bold;
318+
}
319+
/* -------------------------------------------------------- */
320+
285321
/* GIF */
286322
/* -------------------------------------------------------- */
287323
.gif {
@@ -293,9 +329,8 @@
293329
}
294330

295331
.gif img {
296-
height: 100%;
297-
max-height: 18.75em;
298-
max-width: 36em;
332+
width: 100%;
333+
max-width: 40em;
299334
}
300335

301336
.gif-cover {
@@ -379,6 +414,12 @@
379414
.quote-blk {
380415
height: 100%;
381416
}
417+
418+
/* Resize card to full height for larger screens */
419+
.card {
420+
height: 100%;
421+
margin: 1em 1em 0em 1em;
422+
}
382423
}
383424
/* -------------------------------------------------------- */
384425

0 commit comments

Comments
 (0)