security/hakurei.app
security/hakurei.app
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

Add hero section

Browse Source
This commit is contained in:
smdyv 2021-12-11 13:53:29 +01:00 committed by Daniel Micay
parent 0a94d5b13b
commit affcc01a20
3 changed files with 174 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

146
static/index.html
View File

@ -48,82 +48,106 @@
</ul>
</nav>
</header>
<main id="grapheneos">
<h1><a href="#grapheneos">GrapheneOS</a></h1>
<main class="normalize" id="grapheneos">
<div class="content hero">
<p>GrapheneOS is a privacy and security focused mobile OS with Android app
compatibility developed as a non-profit <a href="/source">open source</a> project.
It's focused on the research and development of privacy and security technology
including substantial improvements to sandboxing, exploit mitigations and the
permission model.</p>
<div>
<h1><a href="#grapheneos">GrapheneOS</a></h1>
<p>The private and secure mobile operating system with Android app compatibility.
Developed as a non-profit open source project.</p>
<a class="button" href="/install/">Install GrapheneOS</a>
</div>
<p>GrapheneOS improves the privacy and security of the OS from the bottom up. It
deploys technologies to mitigate whole classes of vulnerabilities and make exploiting
the most common sources of vulnerabilities substantially more difficult. It improves
the security of both the OS and the apps running on it. The app sandbox and other
security boundaries are fortified. GrapheneOS tries to avoid impacting the user
experience with the privacy and security features. Ideally, the features can be
designed so that they're always enabled with no impact on the user experience and no
additional complexity like configuration options. It's not always feasible, and
GrapheneOS does add various toggles for features like the Network permission, Sensors
permission, restrictions when the device is locked (USB peripherals, camera, quick
tiles), etc. along with more complex user-facing privacy and security features with
their own UX.</p>
<figure class="device-img">
<img alt="" class="phone-img" height="580" src="/phone.png"/>
<img alt="" class="phone-logo-img" height="200" src="{{path|/mask-icon.svg}}" width="200"/>
</figure>
<p>The <a href="/features">features page</a> provides an overview of the substantial
privacy and security improvements added by GrapheneOS to the Android Open Source
Project.</p>
</div>
<p>Official releases are available on the <a href="/releases">releases page</a> and
installation instructions are on the <a href="/install/">install page</a>.</p>
<div class="surface">
<div class="content break">
<p>Get to know GrapheneOS</p>
</div>
</div>
<p>GrapheneOS also develops various apps and services with a focus on privacy and
security. Vanadium is a hardened variant of the Chromium browser and WebView
specifically built for GrapheneOS. GrapheneOS also includes our minimal
security-focused PDF Viewer, our hardware-based Auditor app / attestation service
providing local and remote verification of devices, and the externally developed
Seedvault encrypted backup which was initially developed for inclusion in
GrapheneOS.</p>
<div class="content">
<h1 class="start"><a href="#grapheneos">GrapheneOS</a></h1>
<section id="never-google-services">
<h2><a href="#never-google-services">No Google apps or services</a></h2>
<p>GrapheneOS is a privacy and security focused mobile OS with Android app
compatibility developed as a non-profit <a href="/source">open source</a> project.
It's focused on the research and development of privacy and security technology
including substantial improvements to sandboxing, exploit mitigations and the
permission model.</p>
<p>GrapheneOS will never include either Google Play services or another
implementation of Google services like microG. It's possible to install Play
services as a set of fully sandboxed apps without special privileges via our
<a href="/usage#sandboxed-play-services">sandboxed Play services compatibility
layer</a>. See <a href="/faq#google-services">the FAQ section</a> for more details
on our plans for filling in the gaps from not shipping Play services and Google
apps.</p>
</section>
<p>GrapheneOS improves the privacy and security of the OS from the bottom up. It
deploys technologies to mitigate whole classes of vulnerabilities and make exploiting
the most common sources of vulnerabilities substantially more difficult. It improves
the security of both the OS and the apps running on it. The app sandbox and other
security boundaries are fortified. GrapheneOS tries to avoid impacting the user
experience with the privacy and security features. Ideally, the features can be
designed so that they're always enabled with no impact on the user experience and no
additional complexity like configuration options. It's not always feasible, and
GrapheneOS does add various toggles for features like the Network permission, Sensors
permission, restrictions when the device is locked (USB peripherals, camera, quick
tiles), etc. along with more complex user-facing privacy and security features with
their own UX.</p>
<section id="history">
<h2><a href="#history">History</a></h2>
<p>The <a href="/features">features page</a> provides an overview of the substantial
privacy and security improvements added by GrapheneOS to the Android Open Source
Project.</p>
<p>GrapheneOS was founded as an open source project in late 2014. It was formerly
known as CopperheadOS. For more details, see the <a href="/history/">history
page</a>.</p>
</section>
<p>Official releases are available on the <a href="/releases">releases page</a> and
installation instructions are on the <a href="/install/">install page</a>.</p>
<section id="upstream">
<h2><a href="#upstream">Upstream contributions</a></h2>
<p>GrapheneOS also develops various apps and services with a focus on privacy and
security. Vanadium is a hardened variant of the Chromium browser and WebView
specifically built for GrapheneOS. GrapheneOS also includes our minimal
security-focused PDF Viewer, our hardware-based Auditor app / attestation service
providing local and remote verification of devices, and the externally developed
Seedvault encrypted backup which was initially developed for inclusion in
GrapheneOS.</p>
<p>See <a href="/faq#upstream">the FAQ section on our upstream work</a> improving
privacy and security for billions of users by getting a subset of our changes into
core infrastructure projects.</p>
</section>
<section id="never-google-services">
<h2><a href="#never-google-services">No Google apps or services</a></h2>
<section id="roadmap">
<h2><a href="#roadmap">Roadmap</a></h2>
<p>GrapheneOS will never include either Google Play services or another
implementation of Google services like microG. It's possible to install Play
services as a set of fully sandboxed apps without special privileges via our
<a href="/usage#sandboxed-play-services">sandboxed Play services compatibility
layer</a>. See <a href="/faq#google-services">the FAQ section</a> for more details
on our plans for filling in the gaps from not shipping Play services and Google
apps.</p>
</section>
<p>See <a href="/faq#roadmap">the FAQ section on the roadmap</a>.</p>
</section>
<section id="history">
<h2><a href="#history">History</a></h2>
<section id="device-support">
<h2><a href="/faq#device-support">Device support</a></h2>
<p>GrapheneOS was founded as an open source project in late 2014. It was formerly
known as CopperheadOS. For more details, see the <a href="/history/">history
page</a>.</p>
</section>
<p>See <a href="/faq#device-support">the FAQ section on device support</a>.</p>
</section>
<section id="upstream">
<h2><a href="#upstream">Upstream contributions</a></h2>
<p>See <a href="/faq#upstream">the FAQ section on our upstream work</a> improving
privacy and security for billions of users by getting a subset of our changes into
core infrastructure projects.</p>
</section>
<section id="roadmap">
<h2><a href="#roadmap">Roadmap</a></h2>
<p>See <a href="/faq#roadmap">the FAQ section on the roadmap</a>.</p>
</section>
<section id="device-support">
<h2><a href="/faq#device-support">Device support</a></h2>
<p class="end">See <a href="/faq#device-support">the FAQ section on device support</a>.</p>
</section>
</div>
</main>
<footer>
<a href="/"><img src="{{path|/mask-icon.svg}}" width="512" height="512" alt=""/>GrapheneOS</a>

94
static/main.css
View File

@ -112,7 +112,7 @@ main {
overflow-wrap: break-word;
}
button {
button, .button, .button:visited {
color: white;
font-size: 0.9em;
font-weight: bold;
@ -124,16 +124,23 @@ button {
padding: 0.5rem 1.5rem;
}
button:hover {
button:hover, .button:hover {
background-color: #1863ad; /* color between default and pressed */
cursor: pointer;
}
button:focus {
button:focus, .button:focus {
background-color: #2f73b4; /* button pressed on Android */
box-shadow: 0 2px 4px -1px rgba(0 0 0 / 20%), 0 4px 5px 0 rgba(0 0 0 / 14%), 0 1px 10px 0 rgba(0 0 0 / 12%);
}
.button, .button:visited, .button:hover, .button:active {
text-decoration: none;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
line-height: 2.5rem;
}
.coin-address {
display: block;
margin-left: auto;
@ -202,6 +209,60 @@ td {
padding: 0.5rem;
}
main.normalize {
max-width: 100%;
margin: 0;
padding: 0;
}
.content {
max-width: 832px;
margin: auto;
padding: 3.5rem 1rem;
}
.hero {
display: flex;
align-items: center;
flex-flow: row nowrap;
justify-content: space-between;
}
.hero h1 {
margin: 0;
}
.device-img {
margin: 0 0 0 2rem;
position: relative;
}
.phone-logo-img {
position: absolute;
top: 48%;
left: 50%;
transform: translate(-50%, -50%);
}
.surface {
background-color: #e6e6e6;
width: 100%;
}
.start {
margin-top: 0;
}
.end {
margin-bottom: 0;
}
.break p {
text-align: center;
line-height: 1rem;
margin: 0;
}
/* latin */
@font-face {
font-family: Roboto;
@ -252,6 +313,17 @@ td {
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@media only screen and (max-width: 735px) {
.hero {
flex-flow: column nowrap;
text-align: center;
}
.device-img {
margin: 3.5rem 0 0;
}
}
@media (prefers-color-scheme: dark) {
body {
background: #121212;
@ -270,12 +342,12 @@ td {
color: rgba(255 255 255 / 87%); /* 87% white */
}
button {
button, .button, .button:visited {
color: black;
background-color: #95c4ff; /* system_accent1_200, because accent_device_default_dark => system_accent1_100 was too light */
}
button:hover {
button:hover, .button:hover {
background-color: #89b4ea; /* color between default and pressed */
}
@ -303,4 +375,16 @@ td {
td {
border-color: #222;
}
.phone-img {
filter: brightness(0.87);
}
.phone-logo-img {
filter: invert(87%);
}
.surface {
background-color: #212121;
}
}

BIN
static/phone.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 97 KiB