blob: 705420ba4da3621fdbfa097f52017de2834b3aee [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE settings -->
<link rel="icon" href="favicon.ico">
<title>Bliss ROMs</title>
<meta name="description" content="Open Source OS for all devices, based on AOSP">
<meta name="keywords" content="blissroms, bliss, os, x86, aosp, android, rom, teambliss">
<!-- CSS dependencies -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="neon.css">
<!-- Script: Make my navbar transparent when the document is scrolled to top -->
<script src="js/navbar-ontop.js"></script>
<!-- Script: Animated entrance -->
<script src="js/animate-in.js"></script>
<link rel="stylesheet" href="css/animations.css">
</head>
<body class="" style="">
<!-- Navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark" style="padding-right: 41px;">
<div class="container">
<a class="navbar-brand" href="#"><img src="images/BlissIcon_Smal_wl.png" width="50" class="d-inline-block align-top" alt=""></a>
<div class="row">
<div class="col-md-12"><a class="navbar-brand" href="#"><b><b>Bliss ROMs</b></b></a></div>
</div>
<div class="row"></div>
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbar2SupportedContent" aria-controls="navbar2SupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-end" id="navbar2SupportedContent">
<ul class="navbar-nav">
<li class="nav-item mx-2">
<a class="nav-link" href="#features"><b><b>Features</b></b></a>
</li>
<li class="nav-item mx-2">
<a class="nav-link" href="#about"><b><b>About</b></b></a>
</li>
<li class="nav-item mx-2">
<a class="nav-link" href="#team"><b><b>Team</b></b></a>
</li>
<li class="nav-item mx-2">
<a class="nav-link" href="bfor.html"><b><b>Non Profit</b></b></a>
</li>
</ul>
<a class="btn navbar-btn mx-2 btn-primary shadowed" href="#download"><b><b>Download</b></b></a>
</div>
</div>
</nav>
<!-- Cover -->
<div class="section-fade-out pt-5" style="background-image: url(&quot;https://i.imgur.com/BOGKaGy.jpg&quot;); background-position: center bottom;">
<div class="container pt-5">
<div class="row">
<div class="col-md-4 ">
<div class="col-md-12">
<h1 class="display-3 mb-4">Bliss</h1>
<p class="lead mb-4">Is a unique take on Android OS, that incorporates many customizations options and added security features.&nbsp;<br><br>And it is available for...</p>
</div>
</div>
<div class="col-md-8 d-flex justify-content-center align-items-center flex-grow-1" align="center" style="max-height: 100%;max-width: 100%;vertical-align: middle;display: inline-flex;float: none; margin-top: -8%;">
<div class=" d-inline-flex justify-content-center align-items-center mx-auto">
<div class="animation mx-auto d-inline-flex justify-content-center align-items-center" data-animation-step="2">
<div class="device mx-auto mt-5">
<div class="screen-stand"></div>
<div class="display">
<div class="slide1">
<div>Most Intel/x86 <br>
<em>PCs, Tablets &amp; Laptops</em>
</div>
</div>
<div class="slide2">
<div>Most Android <br>
<em>tablets</em>
</div>
</div>
<div class="slide3">
<div>Most Android <br>
<em>phones</em>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 d-inline-flex justify-content-center align-items-center mx-auto mt-5"><a href="#download" class="btn btn-lg btn-primary d-inline-flex justify-content-center align-items-center mx-auto">Download Now</a></div>
</div>
</div>
</div>
<!-- Article style section -->
<div class="py-5">
<div class="container">
<div class="row py-5" style="" id="about">
<div class="col-md-5 order-2 order-md-1 animate-in-left">
<div>
<img src="images/phone_front.svg" style="max-height: 65%;max-width: 50%;" class="justify-content-center align-items-center flex-grow-1 d-flex mx-auto">
<div>
<video style="max-width: 46%;vertical-align: middle;display: inline-flex;float: none;margin-top: -90%;z-index: 999" preload="" muted="" autoplay="autoplay" oncanplay="this.muted=true" loop="loop" class="justify-content-center align-items-center flex-grow-1 d-flex mx-auto" width="80%" height="35%">
<source src="images/bliss-demo.mp4" type="video/mp4">
<source src="images/bliss-demo.mkv" type="video/mkv"> Your browser does not support video! </video>
</div>
</div>
</div>
<div class="col-md-7 align-self-center order-1 order-md-2 my-3 text-md-left text-center">
<h3 class="display-3">About Bliss</h3>
<p class="my-4 text-light">We are non-profit organization that works with volunteers to maintain various development projects. We provide the training and mentorship to help our team members dreams become reality.&nbsp;<br>Our main focus is to provide a quality OS that can run on all your devices, preserving customizations and options by syncing across all platforms. With all the bells and whistles, you can imagine.&nbsp;We believe you'll soon learn why we call it Bliss.</p>
<a class="btn btn-outline-primary" href="#features">Learn more</a>
</div>
</div>
</div>
</div>
<!-- Features -->
<div class="py-5 text-center bg-primary">
<div class="d-flex justify-content-center align-items-center px-0 container-fluid mx-auto">
<div class="row mx-auto d-flex align-items-center justify-content-center">
<div class="col-md-12">
<div class="row mx-5">
<div class="align-self-center col-lg-7 text-md-left text-center">
<h3 class="display-3" contenteditable="true">Moar Bliss</h3>
<p class="my-4 text-light">Bliss comes in a few variants. On top of our traditional device builds of Bliss ROM, our GSI/Treble builds will work on most treble compatible devices (Android Pie+) And our x86 variant (Bliss OS) is made to work with the Linux kernel, and supports booting with MBR/UEFI type bootloaders. So just about any Windows/Linux PC or tablet released in the last 4 years. We are always developing with usability in mind, and supporting more and more devices each week.&nbsp;<br></p>
<a class="btn shadowed btn-dark" href="#download">Download</a>
</div>
<div class="align-self-center mt-5 col-lg-5 animate-in-right">
<img class="img-fluid d-block" src="images/bliss_surface.png"> </div>
</div>
</div>
</div>
</div>
</div>
<div class="py-5 bg-dark" id="features">
<div class="container">
<div class="row">
<div class="col-12 text-center">
<h3 class="display-3">Bliss Features</h3>
</div>
</div>
<div class="row">
<div class="align-self-center text-md-right text-center col-lg-4 col-md-6">
<h4 class="text-primary"><b>Focus on design</b></h4>
<p class="mb-5 text-white">We include many options for customization and theming throughout the OS</p>
<h4 class="text-primary"><b>Customized settings</b></h4>
<p class="mb-5 text-white">Choose settings depending on the criteria you value the most. With no limits.</p>
<h4 class="text-primary"><b>Connect</b></h4>
<p class="mb-5 text-white">In-app chat panel 24/7 active. <br>The support you need, right there.</p>
</div>
<div class="my-3 d-none d-lg-block animate-in-down col-md-4" style="">
<img class="img-fluid d-block" src="images/Phone_features_dark.png"> </div>
<div class="align-self-center text-md-left text-center col-lg-4 col-md-6">
<h4 class="text-primary"><b>Battery-friendly</b></h4>
<p class="mb-5 text-white">Extra options are provided to help tune battery consumption to the best levels</p>
<h4 class="text-primary"><b>Added Security</b></h4>
<p class="mb-5 text-white">Additional security options and features are found throughout the OS. And AOSP security updates are merged regularly</p>
<h4 class="text-primary"><b>Share the love</b></h4>
<p class="mb-5 text-white">Help us spreading the word. <br>Tell your friends with just one-click</p>
</div>
</div>
</div>
</div>
<!-- Features -->
<!-- Carousel reviews -->
<div class="section">
<div class="container d-flex justify-content-center align-items-center flex-grow-1 mx-auto w-75">
<div class="row">
<div class="px-5 col-md-6 text-center mx-auto">
<h3 class="my-3 highlight_secondary team-header text-white"> </h3><br>
<h2 class="my-3 highlight_secondary team-header text-white">We volunteer our time.</h2>
<p class="mb-3">We are a 501(c3) nonprofit, run by people that donate their free time towards the project. We do our best to bring a quality OS to your device, while working a real job on the side in most cases. Please consider showing us we're on the right track by clicking the button below. </p> <a href="https://www.paypal.me/TeamBliss" class="btn btn-primary">Buy Us a Beer</a>
<p class="mt-2"></p>
</div>
<div class="col-md-6 py-2">
<div class="beer-animation-wrapper mt-4">
<div class="beer" style=" transform: translateX(12em) ;">
<div class="foam"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Call to action -->
<div class="py-5 bg-primary" id="download">
<div class="container">
<div class="row">
<div class="text-center col-md-12">
<h3 class="display-3">Download Options</h3>
<div class="row">
<div class="col-md-8">
<h1 class="text-center">Free</h1>
<hr style="border: 2px solid;">
</div>
<div class="col-md-4">
<h1 class="text-center">Paid</h1>
<hr style="border: 2px solid;">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 p-3">
<div class="card bg-light">
<div class="card-body p-4">
<div class="row">
<div class="col-8">
<h3 class="mb-0"><b>Bliss ROM</b></h3>
</div>
<div class="col-4 text-right">
<h2 class="mb-0"> <b>$0</b> </h2>
</div>
</div>
<p class="text-right">Or Donation</p>
<p class="my-3">This is Bliss for your typical Android devices.<br>GSI/Treble options are also available</p>
<ul class="pl-3">
<li>Multiple Devices Supported</li>
<li>Tons of Customization Options</li>
<li>Device Support not Guaranteed</li>
</ul> <a class="btn btn-primary mt-3" href="" data-target="#popup-modal1" data-toggle="modal" style="">Download Now</a>
<div id="popup-modal1" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body px-3 bg-dark">
<h1 class="text-center"> Thanks for your interest in Bliss </h1>
<p class="text-center">Please consider a small donation as a way to help keep our project moving forward. </p>
<div class="modal-social text-right">
<div class="row">
<div class="col-sm-6">
<a class="btn btn-primary btn-block" target="”_blank”" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=MKDDQGLYDKGV6&amp;source=url">Donate $5</a>
</div>
<div class="col-sm-6">
<a class="btn btn-info btn-block" target="”_blank”" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=99GBH7ZW77P54&amp;source=url">Donate $10</a>
</div>
</div>
</div>
</div>
<div class="modal-footer text-center bg-dark">
<a href="http://downloads.blissroms.com" class="btn btn-link" data-dismiss="modal"><span class="glyphicon glyphicon-chevron-right"></span>
</a><a class="btn btn-primary mt-0" href="https://downloads.blissroms.com/BlissRoms/Pie/">Download Now</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 p-3">
<div class="card bg-light">
<div class="card-body p-4">
<div class="row">
<div class="col-8">
<h3 class="mb-0"><b>Bliss OS</b></h3>
</div>
<div class="col-4 text-right">
<h2 class="mb-0"> <b>$0</b></h2>
</div>
</div>
<p class="text-right">Or Donation</p>
<p class="my-3">This is the free version of Bliss OS for PCs</p>
<ul class="pl-3">
<li>Limited Online Support</li>
<li>Limited Device Compatibility</li>
<li>Generic Kernel - One Size Fits All</li>
</ul>
<a class="btn btn-primary mt-3" href="" data-target="#popup-modal2" data-toggle="modal">Download Now</a>
<div id="popup-modal2" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body px-3 bg-dark">
<h1 class="text-center" contenteditable="true"> Thanks for your interest in Bliss OS</h1>
<p class="text-center">Please consider a small donation as a way to help keep our project moving forward. </p>
<div class="modal-social text-right">
<div class="row">
<div class="col-sm-6">
<a class="btn btn-primary btn-block" target="”_blank”" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=MKDDQGLYDKGV6&amp;source=url">Donate $5</a>
</div>
<div class="col-sm-6">
<a class="btn btn-info btn-block" target="”_blank”" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=99GBH7ZW77P54&amp;source=url">Donate $10</a>
</div>
</div>
</div>
</div>
<div class="modal-footer text-center bg-dark">
<a href="http://downloads.blissroms.com" class="btn btn-link" data-dismiss="modal"><span class="glyphicon glyphicon-chevron-right"></span>
</a>
<div class="btn-group pi-draggable">
<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false"> Download Now&nbsp;</button>
<div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(0px, 38px, 0px);">
<a class="dropdown-item" href="https://sourceforge.net/projects/blissos-x86/files/Official/bleeding_edge/archived">Nougat (7.x)</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="https://sourceforge.net/projects/blissos-x86/files/Official/bleeding_edge/archived">Oreo (10.x)</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="https://downloads.blissroms.com/BlissOS/bleeding_edge/">Pie (11.x)</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="btn-group">
</div>
</div>
</div>
</div>
<div class="col-lg-4 p-3">
<div class="card bg-light">
<div class="card-body p-4 bg-secondary rounded border">
<div class="row">
<div class="col-7">
<h3 class="mb-0"><b>Bliss OS Pro/EDU</b></h3>
<p class="text-left">&nbsp;</p>
</div>
<div class="text-right mx-0 mr-0 ml-0 col-5">
<p class="text-right mb-0">As low as</p>
<h2 class="mb-0"> <b>$10</b></h2>
<p class="text-right">per device</p>
</div>
</div>
<p class="" style="">This is the paid version of Bliss OS for businesses and educational institutions, specifically developed on a per device basis for your needs</p>
<ul class="pl-3">
<li>Tech Support Contract Included</li>
<li>Extra Kernel options *</li>
<li>Full Source Code Available</li>
<li contenteditable="true">Extra Tools and Options Available</li>
</ul>
<p class="my-3" style=""><b>*</b> Custom kernel development is available at hourly rates</p>
<a class="btn btn-primary mt-3" href="" data-target="#popup-modal3" data-toggle="modal">Contact Us</a>
<div id="popup-modal3" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body px-3 bg-dark">
<h1 class="text-center"> Thanks for your interest in Bliss OS Pro/EDU </h1>
<p class="text-center">Please Fill out the form below and we will be in touch. </p>
<form action="mailto:blissfamilyroms@gmail.com" method="GET" data-form-title="CONTACT US">
<div class="form-group"> <input type="email" class="form-control" id="form33" placeholder="Your Email" name="email"> </div>
<div class="form-group"> <input type="text" class="form-control" id="form34" placeholder="Subject" name="name"> </div>
<div class="form-group"> <textarea class="form-control" id="form35" rows="3" placeholder="Your message" name="message"></textarea> </div> <button type="submit" class="btn btn-outline-primary btn-block">Send</button>
</form>
<div class="modal-social text-right">
<div class="row">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-5" id="team" style="">
<div class="container">
<div class="row">
<div class="mx-auto col-md-12 text-center">
<h1 class="mb-4">Who we are</h1>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/w7i8JBSfddUp88DpBjjdT_PBODfKTiFV8TKHqyZnsU3m0-ppYXsuafqDtBxakFYW3mjIahKkFYBepZIGRQ=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4><b>Jack Eagle&nbsp;</b>- CEO&nbsp; / Founder / Developer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/xhKBfn9HcjWayS9gQizUuh7JATtI4i-OvVv9Q6XPy5v5IyiI44lqRoxtMIyI3rlLc7OCyparEB9OqGT_Vg=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4><b>Vaughn Newman</b> -&nbsp;Board Member / Admin / Developer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/hcV4Tp81H4TJskQhpKckcDBqwnETos_ZOxXsQbiZGOT5OxMC-3pOD5i22j1tPiaubWW74tmnwB0ixvGwELQ=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4><b>Jon West&nbsp;</b>- CTO / Incorporator / Developer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/JOdHk7TYY-SLjAANLuK7t68Oz6w4fDFody-Uwj3rtH6oSZkljniUceYFQ52rbJXeBv4kDgoGhrtamLJlwZc=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4> <b>Antonio Luciano</b>&nbsp;- Board Member /&nbsp;Project Manager /&nbsp;App Developer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/LZrBsYT1S4qQI92uCuWx34QSGDcKpwY1G2h3LXT3tEvMPuSA8d6tiY7CsLYvBCznXk4sJhgr6UFk8pg1oA=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4><b>BitO BSessiOn</b>&nbsp;- Board Member / Developer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/iu4p6sC5xbTmz7gF5eYCucSHuI_1SBJnRkfNWcNQ6Cw7oCt5ryMHaU_DXpjWEgGX43SnPRs4dSjErXU=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4> <b>Customworx&nbsp;</b>- Board Member / Graphic Designer </h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/eRqBEkS4_cWFEkLce4sVRmyCkAwgsGZwIg1kE12_gjBaghKQ8Omc6V2UJT6q6LwZS8l-LkutUrskyeLFrd0=w1920-h1080-no" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4><b>Evan Galvin</b>&nbsp;- Board Member / Product Technology Strategist</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
<div class="row mb-4">
<div class="col-3"> <img class="img-fluid d-block mx-auto rounded-circle" src="https://lh3.googleusercontent.com/a-/AAuE7mC91eukOeGZ1fU2mULqdlLqrcsYmUWGjZZMoXwMAIk=s1920-p-no-il" width="100" alt="Card image cap"> </div>
<div class="col-9">
<h4> <b>Donna West</b> - Board Member / Treasurer</h4>
<p class="mb-0">&nbsp;</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<div class="py-5 bg-dark">
<div class="container">
<div class="row">
<div class="col-md-9">
<p class="lead">Sign up to our newsletter for the latest news</p>
<form class="form-inline">
<div class="form-group">
<input type="email" class="form-control" placeholder="Your e-mail here"> </div>
<button type="submit" class="btn ml-2 btn-outline-primary">Subscribe</button>
</form>
</div>
<div class="col-4 col-md-1 align-self-center my-3">
<a href="https://www.facebook.com" target="blank"><i class="fa fa-fw fa-facebook fa-3x text-white"></i></a>
</div>
<div class="col-4 col-md-1 align-self-center my-3">
<a href="https://twitter.com" target="blank"><i class="fa fa-fw fa-twitter fa-3x text-white"></i></a>
</div>
<div class="col-4 col-md-1 align-self-center my-3">
<a href="https://www.instagram.com" target="blank"><i class="fa fa-fw fa-instagram fa-3x text-white"></i></a>
</div>
</div>
<div class="row">
<div class="col-12 my-3 text-center">
<p class="text-muted">© Copyright 2019 Bliss Family of ROMs - All rights reserved.</p>
</div>
</div>
</div>
</div>
<!-- JavaScript dependencies -->
<script src="js/mainani.js" type="text/javascript"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<!-- Script: Smooth scrolling between anchors in the same page -->
<script src="js/smooth-scroll.js"></script>
</body>
</html>