Education page via landing page builder (#11698)
# Checklist for submitter If some of the following don't apply, delete the relevant line. - [ ] Changes file added for user-visible changes in `changes/` or `orbit/changes/`. See [Changes files](https://fleetdm.com/docs/contributing/committing-changes#changes-files) for more information. - [ ] Documented any API changes (docs/Using-Fleet/REST-API.md or docs/Contributing/API-for-contributors.md) - [ ] Documented any permissions changes - [ ] Input data is properly validated, `SELECT *` is avoided, SQL injection is prevented (using placeholders for values in statements) - [ ] Added support on fleet's osquery simulator `cmd/osquery-perf` for new osquery data ingestion features. - [ ] Added/updated tests - [ ] Manual QA for all new/changed functionality - For Orbit and Fleet Desktop changes: - [ ] Manual QA must be performed in the three main OSs, macOS, Windows and Linux. - [ ] Auto-update manual QA, from released version of component to new version (see [tools/tuf/test](../tools/tuf/test/README.md)).
This commit is contained in:
Andrew Baker
@@ -0,0 +1,27 @@
|
||||
module.exports = {
|
||||
|
||||
|
||||
friendlyName: 'View higher education',
|
||||
|
||||
|
||||
description: 'Display "Higher education" page.',
|
||||
|
||||
|
||||
exits: {
|
||||
|
||||
success: {
|
||||
viewTemplatePath: 'pages/imagine/higher-education'
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
fn: async function () {
|
||||
|
||||
// Respond with view.
|
||||
return {};
|
||||
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
@@ -0,0 +1,29 @@
|
||||
parasails.registerPage('higher-education', {
|
||||
// ╦╔╗╔╦╔╦╗╦╔═╗╦ ╔═╗╔╦╗╔═╗╔╦╗╔═╗
|
||||
// ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣
|
||||
// ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
|
||||
data: {
|
||||
//…
|
||||
},
|
||||
|
||||
// ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗
|
||||
// ║ ║╠╣ ║╣ ║ ╚╦╝║ ║ ║╣
|
||||
// ╩═╝╩╚ ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
|
||||
beforeMount: function() {
|
||||
//…
|
||||
},
|
||||
mounted: async function() {
|
||||
//…
|
||||
},
|
||||
|
||||
// ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
|
||||
// ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗
|
||||
// ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
|
||||
methods: {
|
||||
clickOpenChatWidget: function() {
|
||||
if(window.HubSpotConversations && window.HubSpotConversations.widget){
|
||||
window.HubSpotConversations.widget.open();
|
||||
}
|
||||
},
|
||||
}
|
||||
});
|
||||
Vendored
+1
@@ -78,3 +78,4 @@
|
||||
// Imagine = landing pages for Marketing
|
||||
@import 'pages/imagine/launch-party.less';
|
||||
@import 'pages/imagine/unused-software.less';
|
||||
@import 'pages/imagine/higher-education.less';
|
||||
|
||||
@@ -0,0 +1,347 @@
|
||||
#higher-education {
|
||||
|
||||
h1 {
|
||||
font-weight: 800;
|
||||
font-size: 64px;
|
||||
line-height: 76px;
|
||||
}
|
||||
h2 {
|
||||
font-weight: 800;
|
||||
font-size: 32px;
|
||||
line-height: 38px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
h3 {
|
||||
font-weight: 800;
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
}
|
||||
h4 {
|
||||
font-family: 'Roboto Mono';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
line-height: 24px;
|
||||
color: @core-fleet-black-75;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
[purpose='hero-background'] {
|
||||
background: linear-gradient(180deg, #E8F1F7 3.37%, #FFFFFF 60%);
|
||||
padding-top: 120px;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
[purpose='hero-container'] {
|
||||
max-width: 1200px;
|
||||
}
|
||||
[purpose='hero-text'] {
|
||||
text-align: center;
|
||||
max-width: 940px;
|
||||
padding: 0 40px;
|
||||
h1 {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
p {
|
||||
font-size: 18px;
|
||||
line-height: 27px;
|
||||
max-width: 640px;
|
||||
margin: 0 auto 32px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='button-row'] {
|
||||
a {
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
[purpose='cta-button'] {
|
||||
cursor: pointer;
|
||||
margin-right: 32px;
|
||||
background: @core-vibrant-red;
|
||||
border-radius: 8px;
|
||||
padding-left: 32px;
|
||||
padding-right: 32px;
|
||||
height: 48px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #FFF;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
}
|
||||
[purpose='cta-button']::before {
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
opacity: 1;
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -5px;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
transform: skew(-10deg);
|
||||
transition: left 0.5s ease-in, opacity 0.50s ease-in, width 0.5s ease-in;
|
||||
}
|
||||
[purpose='cta-button']:hover:before {
|
||||
opacity: 0;
|
||||
left: 160px;
|
||||
width: 110%;
|
||||
}
|
||||
|
||||
[purpose='animated-arrow-button-red'] {
|
||||
display: inline;
|
||||
padding-right: 40px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
min-width: 125px;
|
||||
font-weight: bold;
|
||||
user-select: none;
|
||||
transition: 0.2s ease-in-out;
|
||||
-o-transition: 0.2s ease-in-out;
|
||||
-ms-transition: 0.2s ease-in-out;
|
||||
-moz-transition: 0.2s ease-in-out;
|
||||
-webkit-transition: 0.2s ease-in-out;
|
||||
color: @core-fleet-black;
|
||||
text-decoration: none;
|
||||
&:after {
|
||||
content: url('/images/arrow-right-red-16x16@2x.png');
|
||||
transform: scale(0.5);
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: 80%; // <--- here
|
||||
transition: 0.2s ease-in-out;
|
||||
-o-transition: 0.2s ease-in-out;
|
||||
-ms-transition: 0.2s ease-in-out;
|
||||
-moz-transition: 0.2s ease-in-out;
|
||||
-webkit-transition: 0.2s ease-in-out;
|
||||
/* opacity: 0; */
|
||||
}
|
||||
&:hover:after {
|
||||
left: 82%; // <--- here
|
||||
transition: 0.2s ease-in-out;
|
||||
-o-transition: 0.2s ease-in-out;
|
||||
-ms-transition: 0.2s ease-in-out;
|
||||
-moz-transition: 0.2s ease-in-out;
|
||||
-webkit-transition: 0.2s ease-in-out;
|
||||
/* opacity:1; */
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
|
||||
[purpose='feature'] {
|
||||
margin-top: 120px;
|
||||
max-width: 960px;
|
||||
h3 {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
div {
|
||||
max-width: 480px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='feature-image'] {
|
||||
img {
|
||||
max-height: 300px;
|
||||
}
|
||||
}
|
||||
[purpose='large-feature-image'] {
|
||||
img {
|
||||
max-height: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='checklists'] {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
[purpose='checklist'] {
|
||||
p {
|
||||
padding-left: 28px;
|
||||
text-indent: -28px;
|
||||
}
|
||||
p::before {
|
||||
content: ' ';
|
||||
background-image: url('/images/icon-checkmark-circle.svg');
|
||||
background-size: 16px 16px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
margin-right: 12px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='tweets-container'] {
|
||||
padding-top: 120px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
|
||||
[purpose='bottom-gradient'] {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #E9F4F4 100%);
|
||||
}
|
||||
[purpose='bottom-cloud-city-banner'] {
|
||||
background: linear-gradient(180deg, #E9F4F4 0%, #FFFFFF 100%);
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
[purpose='page-container'] {
|
||||
padding-left: 120px;
|
||||
padding-right: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
[purpose='logos'] {
|
||||
height: 58px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
img {
|
||||
margin-top: 23.5px;
|
||||
margin-bottom: 23.5px;
|
||||
padding-left: 25px;
|
||||
padding-right: 25px;
|
||||
}
|
||||
[purpose='snowflake-logo'] {
|
||||
height: 21px;
|
||||
}
|
||||
[purpose='wayfair-logo'] {
|
||||
height: 23px;
|
||||
}
|
||||
[purpose='uber-logo'] {
|
||||
height: 20px;
|
||||
}
|
||||
[purpose='atlassian-logo'] {
|
||||
height: 16px;
|
||||
}
|
||||
[purpose='segment-logo'] {
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
|
||||
[purpose='button-row'] {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
[purpose='hero-background'] {
|
||||
padding-top: 120px;
|
||||
padding-bottom: 80px;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
[purpose='logos'] {
|
||||
height: 58px;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
img {
|
||||
margin-top: 17.5px;
|
||||
margin-bottom: 17.5px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
h1 {
|
||||
font-size: 48px;
|
||||
line-height: 54px;
|
||||
}
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
}
|
||||
|
||||
[purpose='checklists'] {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
[purpose='feature'] {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
[purpose='feature-image'], [purpose='large-feature-image'] {
|
||||
margin-bottom: 40px;
|
||||
img {
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='hero-background'] {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 60px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
[purpose='hero-text'] {
|
||||
text-align: center;
|
||||
max-width: 480px;
|
||||
}
|
||||
|
||||
[purpose='tweets-container'] {
|
||||
padding-top: 80px;
|
||||
padding-bottom: 80px;
|
||||
padding-left: 40px;
|
||||
padding-right: 40px;
|
||||
}
|
||||
|
||||
[purpose='logos'] {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
|
||||
[purpose='button-row'] {
|
||||
max-width: 100%;
|
||||
[purpose='cta-button'] {
|
||||
margin-right: 0px;
|
||||
width: 100%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
[purpose='feature'] {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
[purpose='page-container'] {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
[purpose='tweets-container'] {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
[parasails-component='scrollable-tweets'] [purpose='tweets'] {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
Vendored
+7
-1
@@ -278,7 +278,13 @@ module.exports.routes = {
|
||||
// ║║║║╠═╣║ ╦║║║║║╣ │ │ ├─┤│││ │││││││ ┬ ├─┘├─┤│ ┬├┤ └─┐ │
|
||||
// ╩╩ ╩╩ ╩╚═╝╩╝╚╝╚═╝ └─┴─┘┴ ┴┘└┘─┴┘┴┘└┘└─┘ ┴ ┴ ┴└─┘└─┘└─┘─┘
|
||||
'GET /imagine/unused-software': { action: 'imagine/view-unused-software' },
|
||||
|
||||
'GET /imagine/higher-education': {
|
||||
action: 'imagine/view-higher-education',
|
||||
locals: {
|
||||
pageTitleForMeta: 'Fleet for higher education',
|
||||
pageDescriptionForMeta: 'Automate security workflows in a single application by creating or installing policies to identify which devices comply with your security guidelines.',
|
||||
}
|
||||
},
|
||||
|
||||
// ╦ ╔═╗╔═╗╔═╗╔═╗╦ ╦ ╦═╗╔═╗╔╦╗╦╦═╗╔═╗╔═╗╔╦╗╔═╗
|
||||
// ║ ║╣ ║ ╦╠═╣║ ╚╦╝ ╠╦╝║╣ ║║║╠╦╝║╣ ║ ║ ╚═╗
|
||||
|
||||
+1
@@ -251,6 +251,7 @@
|
||||
<script src="/js/pages/get-started.page.js"></script>
|
||||
<script src="/js/pages/handbook/basic-handbook.page.js"></script>
|
||||
<script src="/js/pages/homepage.page.js"></script>
|
||||
<script src="/js/pages/imagine/higher-education.page.js"></script>
|
||||
<script src="/js/pages/imagine/launch-party.page.js"></script>
|
||||
<script src="/js/pages/imagine/unused-software.page.js"></script>
|
||||
<script src="/js/pages/landing.page.js"></script>
|
||||
|
||||
+1
@@ -251,6 +251,7 @@
|
||||
<script src="/js/pages/get-started.page.js"></script>
|
||||
<script src="/js/pages/handbook/basic-handbook.page.js"></script>
|
||||
<script src="/js/pages/homepage.page.js"></script>
|
||||
<script src="/js/pages/imagine/higher-education.page.js"></script>
|
||||
<script src="/js/pages/imagine/launch-party.page.js"></script>
|
||||
<script src="/js/pages/imagine/unused-software.page.js"></script>
|
||||
<script src="/js/pages/landing.page.js"></script>
|
||||
|
||||
+1
@@ -378,6 +378,7 @@
|
||||
<script src="/js/pages/get-started.page.js"></script>
|
||||
<script src="/js/pages/handbook/basic-handbook.page.js"></script>
|
||||
<script src="/js/pages/homepage.page.js"></script>
|
||||
<script src="/js/pages/imagine/higher-education.page.js"></script>
|
||||
<script src="/js/pages/imagine/launch-party.page.js"></script>
|
||||
<script src="/js/pages/imagine/unused-software.page.js"></script>
|
||||
<script src="/js/pages/landing.page.js"></script>
|
||||
|
||||
Vendored
+1
@@ -451,6 +451,7 @@
|
||||
<script src="/js/pages/get-started.page.js"></script>
|
||||
<script src="/js/pages/handbook/basic-handbook.page.js"></script>
|
||||
<script src="/js/pages/homepage.page.js"></script>
|
||||
<script src="/js/pages/imagine/higher-education.page.js"></script>
|
||||
<script src="/js/pages/imagine/launch-party.page.js"></script>
|
||||
<script src="/js/pages/imagine/unused-software.page.js"></script>
|
||||
<script src="/js/pages/landing.page.js"></script>
|
||||
|
||||
+100
@@ -0,0 +1,100 @@
|
||||
<div id="higher-education" v-cloak>
|
||||
|
||||
<div purpose="hero-background" class="container-lg d-flex justify-content-center">
|
||||
|
||||
<div purpose="hero-container" class="d-flex flex-column align-items-center">
|
||||
<div purpose="hero-text">
|
||||
<h4 class="mb-2">Visibility and compliance in a single platform</h4>
|
||||
<h1>Higher education meets simplified security</h1>
|
||||
<p>Automate security workflows in a single application by creating or installing policies to identify which devices comply with your security guidelines.</p>
|
||||
<div purpose="button-row" class="d-flex flex-sm-row flex-column justify-content-center align-items-center">
|
||||
<a purpose="cta-button" href="/try-fleet/register?tryitnow">Try Fleet today</a>
|
||||
<a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div purpose="page-container" class="container-lg">
|
||||
<div purpose="feature" class="d-flex flex-md-row flex-column-reverse justify-content-between mx-auto align-items-center">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Out-of-the-box CIS benchmark policies</h3>
|
||||
<p>Colleges are often subject to strict regulatory compliance requirements. With Center for Internet Security (CIS) compliance policies in Fleet, cybersecurity best practices are at your fingertips.</p>
|
||||
<div purpose="checklist" class="flex-column d-flex">
|
||||
<p>Out-of-the-box policies for Mac, Windows, and Linux.</p>
|
||||
<p>Fleet will keep these policies updated for you.</p>
|
||||
<p>Identify which devices are failing the most so you can prioritize your work.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="feature-image" class="ml-md-5">
|
||||
<img alt="higher-education feature image" src="/images/compliance-feature-image-1-360x323@2x.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="feature" class="d-flex flex-md-row flex-column justify-content-between mx-auto align-items-center">
|
||||
<div purpose="feature-image" class="mr-md-5">
|
||||
<img alt="higher-education feature image" src="/images/compliance-feature-image-2-320x237@2x.png">
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Asset management</h3>
|
||||
<p>Colleges have a large number of devices on their network, including laptops, desktops, servers, and mobile devices. Fleet and osquery can help colleges track these devices and ensure that they are properly managed.</p>
|
||||
<div purpose="checklist" class="flex-column d-flex">
|
||||
<p>Troubleshoot issues with detailed configuration and performance details in real time on any operating system.</p>
|
||||
<p>Easily manage any amount of software applications in your fleet with visibility into installed applications and their vulnerabilities.</p>
|
||||
<p>Save money on software licensing fees by identifying underutilized devices and applications with an unused software report.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="feature" class="d-flex flex-md-row flex-column-reverse justify-content-between mx-auto align-items-center">
|
||||
<div class="d-flex flex-column">
|
||||
<h3>Automations in response to failing policies</h3>
|
||||
<p>Fleet Premium comes out-of-the-box ready for audits. Integrate with the security tools and services in your stack. Get answers immediately, even when you’re not looking.</p>
|
||||
<div purpose="checklist" class="flex-column d-flex">
|
||||
<p>Configurable scan intervals for policies.</p>
|
||||
<p>Trigger webhooks and integrate with Jira, Zendesk, or Tines.</p>
|
||||
<p>Encourage end-user self-remediation with Fleet Desktop.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div purpose="feature-image" class="ml-md-5">
|
||||
<img alt="higher-education feature image" src="/images/compliance-feature-image-3-398x250@2x.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div purpose="button-row" style="margin-top: 60px;" class="d-flex flex-sm-row flex-column justify-content-center align-items-center mx-auto">
|
||||
<a purpose="cta-button" href="/try-fleet/register?tryitnow">Try Fleet today</a>
|
||||
<a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div purpose="bottom-gradient">
|
||||
<div purpose="tweets-container" class="container-fluid px-md-0 pb-0 d-flex flex-column justify-content-center">
|
||||
<div purpose="section-heading" style="max-width: 720px" class="mx-auto text-center">
|
||||
<h4>Don’t know osquery?</h4>
|
||||
<h2>Dedicated support from osquery experts</h2>
|
||||
<p>Osquery is the open-source agent that powers Fleet. And we have the most osquery experts around. We’ll help you realize the potential of this tool for your organization.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<scrollable-tweets></scrollable-tweets>
|
||||
<div purpose="page-container" class="pb-0 container">
|
||||
|
||||
<div purpose="bottom-cta" class="text-center">
|
||||
<h4>Open-source device management</h4>
|
||||
<h1>Think for yourself</h1>
|
||||
<div purpose="button-row" style="margin-top: 60px;" class="d-flex flex-sm-row flex-column justify-content-center align-items-center mx-auto">
|
||||
<a purpose="cta-button" href="/try-fleet/register?tryitnow">Try it out</a>
|
||||
<a @click="clickOpenChatWidget()" purpose="animated-arrow-button-red">Talk to an expert</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex flex-column" purpose="bottom-cloud-city-banner">
|
||||
<img alt="A glass city floating on top of fluffy white clouds" class="d-none d-lg-flex" src="/images/homepage-cloud-city-banner-lg-1600x375@2x.png">
|
||||
<img alt="A glass city floating on top of fluffy white clouds" class="d-none d-md-flex d-lg-none" src="/images/homepage-cloud-city-banner-md-990x375@2x.png">
|
||||
<img alt="A glass city floating on top of fluffy white clouds" class="d-flex d-md-none" src="/images/homepage-cloud-city-banner-sm-375x168@2x.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user