UNCLASSIFIED - NO CUI

Skip to content
Snippets Groups Projects
Commit ac12ff75 authored by Deven Phillips's avatar Deven Phillips Committed by daniel.cushman
Browse files

BULL-2054

parent aeeea987
No related branches found
No related tags found
1 merge request!253BULL-2054
Hide whitespace changes
Inline Side-by-side
Showing
with 86 additions and 147 deletions
src/views/CNAP.vue
+ 86
− 147
View file @ ac12ff75
...@@ -6,80 +6,52 @@ ...@@ -6,80 +6,52 @@
</template> </template>
</PageHeader> </PageHeader>
<v-container class="future-container"> <v-container class="mb-8">
<h2 class="mb-8">The future is zero trust</h2> <h2 class="mb-8">The future is zero trust</h2>
<v-row> <v-row no-gutters>
<v-col class="col-12 col-md-4"> <v-col class="col-12 col-md-4">
<v-card flat color="transparent"> <img
<img src="@/assets/images/CyberSecurity/CS_Dependencies_Icon.webp"
class="img-fluid" alt="DependenciesIcon"
src="@/assets/images/CyberSecurity/CS_Dependencies_Icon.webp" />
alt="DependenciesIcon" <h4 class="card-subheader">What is CNAP</h4>
/> <p class="card-text">
<v-card-text class="mh-md-80"> The Cloud Native Access Portal is a Secure Access Service Edge
<h4 (SASE) cloud-based enterprise security framework with a Zero Trust
class="mh-md-25 d-flex align-center justify-center future-subheader" Architecture core providing eased access to AWS GovCloud resources
> (IL 2/4/5) for the DoD from both on and off NIPR.
What is CNAP </p>
</h4>
<p class="future-text px-sm-11 px-md-0">
The Cloud Native Access Portal is a Secure Access Service Edge
(SASE) cloud-based enterprise security framework with a Zero
Trust Architecture core providing eased access to AWS GovCloud
resources (IL 2/4/5) for the DoD from both on and off NIPR.
</p>
</v-card-text>
</v-card>
</v-col> </v-col>
<v-col class="col-12 col-md-4"> <v-col class="col-12 col-md-4">
<v-card flat color="transparent"> <img
<img src="@/assets/images/CyberSecurity/CS_Warning_Icon.webp"
class="img-fluid" alt="WarningIcon"
src="@/assets/images/CyberSecurity/CS_Warning_Icon.webp" />
alt="WarningIcon" <h4 class="card-subheader">Device compliance</h4>
/> <p class="card-text">
<v-card-text class="mh-md-80"> Network devices are not to be trusted by default, rather each
<h4 connected device is checked for identity and integrity then aligned
class="mh-md-25 pb-md-3 pb-lg-0 d-flex align-center justify-center future-subheader" against a managed set of policies (or access denied outright) before
> allowing encrypted access to intended mission applications.
Device compliance </p>
</h4>
<p class="future-text px-sm-11 px-md-0">
Network devices are not to be trusted by default, rather each
connected device is checked for identity and integrity then
aligned against a managed set of policies (or access denied
outright) before allowing encrypted access to intended mission
applications.
</p>
</v-card-text>
</v-card>
</v-col> </v-col>
<v-col class="col-12 col-md-4"> <v-col class="col-12 col-md-4">
<v-card flat color="transparent"> <img
<img src="@/assets/images/CyberSecurity/CS_Innovation_Icon.webp"
class="img-fluid" alt="DependenciesIcon"
src="@/assets/images/CyberSecurity/CS_Innovation_Icon.webp" />
alt="DependenciesIcon" <h4 class="card-subheader">Software Defined Perimeter</h4>
/> <p class="card-text">
<v-card-text class="mh-md-80"> A Software Defined Perimeter (SDP) is based on a need-to-know model,
<h4 in which device posture and identity are verified before access to
class="perimeter-header mh-md-25 pb-lg-0 d-flex align-center justify-center future-subheader" application infrastructure is granted effectively leaving
> application infrastructure undetectable.
Software Defined Perimeter </p>
</h4>
<p class="future-text px-sm-11 px-md-0">
A Software Defined Perimeter (SDP) is based on a need-to-know
model, in which device posture and identity are verified before
access to application infrastructure is granted effectively
leaving application infrastructure undetectable.
</p>
</v-card-text>
</v-card>
</v-col> </v-col>
</v-row> </v-row>
</v-container> </v-container>
<v-container class="dark-section pa-4 pa-md-12 mw-md-80"> <v-container class="dark-section pa-4 pa-md-12">
<v-row> <v-row>
<v-col cols="12" md="4" class="text-left pr-md-8 pa-8 pa-md-0"> <v-col cols="12" md="4" class="text-left pr-md-8 pa-8 pa-md-0">
<v-card <v-card
...@@ -188,10 +160,10 @@ ...@@ -188,10 +160,10 @@
</v-container> </v-container>
<v-container class="card-container"> <v-container class="card-container">
<v-row class="px-md-8"> <v-row class="mx-n6">
<v-col class="col-12 col-md-6 mx-auto"> <v-col class="col-12 col-md-6">
<v-card class="px-sm-4 px-md-8"> <v-card class="px-sm-4 px-md-8 h-100">
<v-card-text class="text-left gray--text"> <v-card-text class="text-left">
<h3 class="text-center mt-6"> <h3 class="text-center mt-6">
Trust Nothing / Verify Everything Trust Nothing / Verify Everything
</h3> </h3>
...@@ -237,8 +209,8 @@ ...@@ -237,8 +209,8 @@
</v-card> </v-card>
</v-col> </v-col>
<v-col class="col-12 col-md-6 mx-auto"> <v-col class="col-12 col-md-6 mx-auto">
<v-card class="px-sm-4 px-md-0"> <v-card class="px-sm-4 px-md-0 h-100">
<v-card-text class="text-left gray--text"> <v-card-text class="text-left">
<h3 class="text-center mt-6"> <h3 class="text-center mt-6">
Modernizing Federal Government Cybersecurity Modernizing Federal Government Cybersecurity
</h3> </h3>
...@@ -285,20 +257,20 @@ ...@@ -285,20 +257,20 @@
</v-row> </v-row>
</v-container> </v-container>
<v-container class="card-container"> <v-container class="card-container even-cards">
<h3 class="mb-10">CNAP Offerings</h3> <h3 class="mb-10">CNAP Offerings</h3>
<v-row> <v-row>
<v-col class="col-12 col-md-4 mx-auto"> <v-col class="col-12 col-md-4">
<v-card class="dark"> <v-card class="dark">
<v-card-text class="mh-md-80"> <v-card-text>
<h4 class="py-4 py-sm-2 py-md-4 py-lg-2 mh-md-25">P1 CNAP</h4> <h4 class="card-subheader">P1 CNAP</h4>
<p class="px-sm-11 px-md-0"> <p class="card-text">
Specifically for Platform One customers providing a secure Specifically for Platform One customers providing a secure
authenticaion and authorization platform to access DoD authenticaion and authorization platform to access DoD
resources. resources.
</p> </p>
</v-card-text> </v-card-text>
<v-card-actions class="justify-center align-btm"> <v-card-actions>
<div> <div>
<v-btn <v-btn
color="primary" color="primary"
...@@ -313,19 +285,17 @@ ...@@ -313,19 +285,17 @@
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-col> </v-col>
<v-col class="col-12 col-md-4 mx-auto"> <v-col class="col-12 col-md-4">
<v-card class="dark"> <v-card class="dark">
<v-card-text class="mh-md-80"> <v-card-text>
<h4 class="py-4 py-sm-2 py-md-4 py-lg-2 mh-md-25"> <h4 class="card-subheader">CNAP As a Service</h4>
CNAP As a Service <p class="card-text">
</h4>
<p class="px-sm-11 px-md-0">
CNAP for customers with their own AWS GovCloud environment CNAP for customers with their own AWS GovCloud environment
interested in a Zero Trust Architecture secure access interested in a Zero Trust Architecture secure access
capability. capability.
</p> </p>
</v-card-text> </v-card-text>
<v-card-actions class="justify-center align-btm"> <v-card-actions>
<div> <div>
<v-btn <v-btn
color="primary" color="primary"
...@@ -340,17 +310,17 @@ ...@@ -340,17 +310,17 @@
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-col> </v-col>
<v-col class="col-12 col-md-4 mx-auto"> <v-col class="col-12 col-md-4">
<v-card class="dark"> <v-card class="dark">
<v-card-text class="mh-md-80"> <v-card-text>
<h4 class="py-4 py-sm-2 mh-md-25">Zero Trust gateway (ZTAP)</h4> <h4 class="card-subheader">Zero Trust gateway (ZTAP)</h4>
<p class="pb-md-4 px-sm-11 px-md-0"> <p class="card-text">
Currently in development, based off of CNAP architecture. On Currently in development, based off of CNAP architecture. On
premise deployed and managed instances of ZTA capability to premise deployed and managed instances of ZTA capability to
expand edge coverage and unique use cases. expand edge coverage and unique use cases.
</p> </p>
</v-card-text> </v-card-text>
<v-card-actions class="justify-center align-btm"> <v-card-actions>
<div> <div>
<v-btn <v-btn
color="primary" color="primary"
...@@ -478,74 +448,43 @@ export default { ...@@ -478,74 +448,43 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.future-subheader { .v-card {
max-height: 30px; background-color: #f4f4f4;
}
.future-text {
color: $text-color;
}
.future-container {
@include md-up {
max-width: 80%;
}
h4 {
height: 46px;
margin-top: 8px;
}
}
.perimeter-header {
@media screen and (min-width: 960px) {
padding-bottom: 35px;
}
@media screen and (min-width: 1119px) {
padding-bottom: 12px;
}
}
.mw-md-80 {
@include md-up {
max-width: 80%;
}
} }
.mh-md-25 { .card-subheader {
@include md-up { height: 46px;
height: 25%; margin: 0 0 12px 0;
} display: flex;
align-items: center;
justify-content: center;
} }
.card-text {
.mh-md-80 { padding-left: 32px;
@include md-up { padding-right: 32px;
height: 80%; @include md-down {
padding-left: 16px;
padding-right: 16px;
} }
} }
.align-btm {
position: relative;
bottom: 1rem;
}
.v-card__text {
font-size: 16px;
@include xs {
h3 {
padding-left: 0px;
padding-right: 0px;
}
}
}
.v-card {
background-color: #f4f4f4;
height: 100%;
}
.card-container { .card-container {
margin-top: 3.5rem; margin-top: 3.5rem;
@include lg-up {
max-width: 80%;
}
margin-bottom: 8rem; margin-bottom: 8rem;
&.even-cards {
.v-card {
height: 100%;
display: flex;
flex-direction: column;
}
.v-card__actions {
margin-top: auto;
justify-content: center;
margin-bottom: 24px;
padding-top: 0;
}
}
} }
.onboarding { .onboarding {
@include sm-up { @include sm-up {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

UNCLASSIFIED - NO CUI