Skip to content

Commit

Permalink
WD-13068 - fix images on /core to be full width (canonical#14169)
Browse files Browse the repository at this point in the history
  • Loading branch information
@lizzochek
lizzochek authored Aug 13, 2024
1 parent 1593393 commit ee0d7f1
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 77 deletions.
90 changes: 23 additions & 67 deletions templates/core/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -232,37 +232,25 @@ <h2>For smart use cases. Get Core. Get snaps. Get going.</h2>
<div class="col-3 col-medium-2">
<a href="/automotive">
<h3 class="p-heading--5">Automotive</h3>
{{ image(url="https://assets.ubuntu.com/v1/f867c883-For-smart-use-cases__Automotivew.png",
alt="",
width="285",
height="160",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/f867c883-For-smart-use-cases__Automotivew.png" alt="" />
</div>
</a>
</div>
<div class="col-3 col-medium-2">
<a href="/industrial">
<h3 class="p-heading--5">Industrial</h3>
{{ image(url="https://assets.ubuntu.com/v1/0162bc71-For-smart-use-cases__Industrial.png",
alt="",
width="285",
height="160",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/0162bc71-For-smart-use-cases__Industrial.png" alt="" />
</div>
</a>
</div>
<div class="col-3 col-medium-2">
<a href="/robotics">
<h3 class="p-heading--5">Robotics</h3>
{{ image(url="https://assets.ubuntu.com/v1/aeeeb32d-For-smart-use-cases__Robotics.png",
alt="",
width="285",
height="160",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/aeeeb32d-For-smart-use-cases__Robotics.png" alt="" />
</div>
</a>
</div>
</div>
Expand All @@ -275,25 +263,17 @@ <h3 class="p-heading--5">Robotics</h3>
<div class="col-3 col-medium-2">
<a href="/internet-of-things/digital-signage">
<h3 class="p-heading--5">Signage</h3>
{{ image(url="https://assets.ubuntu.com/v1/9db3f004-For-smart-use-cases__Signage.png",
alt="",
width="285",
height="160",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/9db3f004-For-smart-use-cases__Signage.png" alt="" />
</div>
</a>
</div>
<div class="col-3 col-medium-2">
<a href="/internet-of-things/smart-city">
<h3 class="p-heading--5">Smart cities</h3>
{{ image(url="https://assets.ubuntu.com/v1/8dd2f04d-For-smart-use-cases__Smart-cities.png",
alt="",
width="285",
height="160",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/8dd2f04d-For-smart-use-cases__Smart-cities.png" alt="" />
</div>
</a>
</div>
</div>
Expand Down Expand Up @@ -357,14 +337,8 @@ <h3 class="p-heading--2">Bosch Rexroth reinvents automation</h3>
</p>
</div>
</div>
<div>
{{ image(url="https://assets.ubuntu.com/v1/2d152c25-rexroth-testimonial-image.jpg",
alt="Rexroth",
width="917",
height="392",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/2d152c25-rexroth-testimonial-image.jpg" alt="" />
</div>
</div>
</div>
Expand Down Expand Up @@ -393,14 +367,8 @@ <h3 class="p-heading--2">Pudo deploys fleet for robust last-mile logistics</h3>
</p>
</div>
</div>
<div>
{{ image(url="https://assets.ubuntu.com/v1/576c8402-pudo-testimonial-image.jpg",
alt="Pudo",
width="917",
height="392",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/576c8402-pudo-testimonial-image.jpg" alt="" />
</div>
</div>
</div>
Expand Down Expand Up @@ -429,14 +397,8 @@ <h3 class="p-heading--2">Rigado cuts customers’ time to market</h3>
</p>
</div>
</div>
<div>
{{ image(url="https://assets.ubuntu.com/v1/297369c0-rigado--testimonial-image.jpg",
alt="Rigado",
width="917",
height="392",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/297369c0-rigado--testimonial-image.jpg" alt="" />
</div>
</div>
</div>
Expand Down Expand Up @@ -467,14 +429,8 @@ <h3 class="p-heading--2">IBM Cloud provides highly isolated and performant bare
</p>
</div>
</div>
<div>
{{ image(url="https://assets.ubuntu.com/v1/534be2a2-ibm-leadspace.jpg",
alt="IBM",
width="917",
height="392",
hi_def=True,
loading="auto",) | safe
}}
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/534be2a2-ibm-leadspace.jpg" alt="" />
</div>
</div>
</div>
Expand Down
20 changes: 10 additions & 10 deletions templates/core/tabs.html
View file
Original file line number Diff line number Diff line change
@@ -1,43 +1,43 @@
<div tabindex="0" role="tabpanel" id="overview-tab" aria-labelledby="overview" aria-hidden="false">
<div class="u-fixed-width p-strip is-shallow u-no-padding--top">
<div class="image-wrapper">
<img width="590" src="https://assets.ubuntu.com/v1/6e6a56d4-image-1.jpg" alt="" />
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/6e6a56d4-image-1.jpg" alt="" />
</div>
<p>Deploying a device?</p>
<p>Ubuntu is your development environment. Ubuntu Core is your deployment OS. Whether you develop your application using C++, Rust, Python, or others – whatever tech stack you use, package and deploy it seamlessly on Ubuntu Core.</p>
</div>
</div>
<div tabindex="0" role="tabpanel" id="ubuntu-vision-tab" aria-labelledby="ubuntu-vision" aria-hidden="false">
<div class="u-fixed-width p-strip is-shallow u-no-padding--top">
<div class="image-wrapper">
<img width="590" src="https://assets.ubuntu.com/v1/27f89818-image-2.jpg" alt="" />
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/27f89818-image-2.jpg" alt="" />
</div>
<p>For more than 20 years, Ubuntu has provided the best development environment. Every aspect of the development process benefits from Ubuntu’s responsiveness, ease of use, regular software updates and a high degree of security.</p>
<a href="/desktop">Learn more about Ubuntu&nbsp;&rsaquo;</a>
</div>
</div>
<div tabindex="0" role="tabpanel" id="snapcraft-tab" aria-labelledby="snapcraft" aria-hidden="false">
<div class="u-fixed-width p-strip is-shallow u-no-padding--top">
<div class="image-wrapper">
<img width="590" src="https://assets.ubuntu.com/v1/1b84970e-image-3.jpg" alt="" />
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/1b84970e-image-3.jpg" alt="" />
</div>
<p>Snapcraft is the command-line tool for packaging your software as a snap. Snaps are containerised packages designed for deploying embedded applications, with increased performance compared to <a href="/engage/docker-containers-for-IoT-whitepaper">other technologies</a>. Ubuntu Core architecture is built on snaps and each element benefits from its tooling.</p>
<a href="/core/docs/snaps-in-ubuntu-core">Learn more about snaps in Ubuntu Core&nbsp;&rsaquo;</a>
</div>
</div>
<div tabindex="0" role="tabpanel" id="snap-store-tab" aria-labelledby="snap-store" aria-hidden="false">
<div class="u-fixed-width p-strip is-shallow u-no-padding--top">
<div class="image-wrapper">
<img width="590" src="https://assets.ubuntu.com/v1/27f8d290-image-6.jpg" alt="" />
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/27f8d290-image-6.jpg" alt="" />
</div>
<p>Canonical's Snap Store powers developers to host and manage software updates for their devices. It provides a trusted update infrastructure, including reliable OTA updates, delta updates, and more. Organisations can also create private marketplaces, with advanced software management for fleets of devices.</p>
<a href="/internet-of-things/appstore">Learn more about Snap Stores&nbsp;&rsaquo;</a>
</div>
</div>
<div tabindex="0" role="tabpanel" id="ubuntu-core-tab" aria-labelledby="ubuntu-core" aria-hidden="false">
<div class="u-fixed-width p-strip is-shallow u-no-padding--top">
<div class="image-wrapper">
<img width="590" src="https://assets.ubuntu.com/v1/60d58bf5-image-4.jpg" alt="" />
<div class="p-image-container">
<img class="p-image-container__image" src="https://assets.ubuntu.com/v1/60d58bf5-image-4.jpg" alt="" />
</div>
<p>The right OS for your devices. Ubuntu Core is a strictly confined and immutable embedded Linux OS. Build your Ubuntu Core image for your application and targeted hardware, and enjoy a fully managed, secure, and 12-year LTS production image.</p>
<a href="/core">Learn more about Ubuntu Core&nbsp;&rsaquo;</a>
Expand Down

0 comments on commit ee0d7f1

Please sign in to comment.