lbryorg/branding/index.html
2020-06-13 19:31:01 +05:30

249 lines
9.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LBRY Foundation - Branding</title>
<!--TitleBar Icon-->
<link rel="icon" href="../img/small-logo.png" type="image/png" />
<!-- CSS DEPENDENCIES -->
<link rel="stylesheet" href="../lib/fontawesome/css/all.min.css" />
<link rel="stylesheet" href="../lib/bootstrap/css/bootstrap.min.css" />
<!-- /CSS DEPENDENCIES -->
<!--CUSTOM CSS-->
<link rel="stylesheet" href="../lib/css/index.css">
<link rel="stylesheet" href="../lib/css/article.css" />
<!--/CUSTOM CSS-->
</head>
<body id="home" data-spy="scroll" data-target=".navbar" data-offset="100">
<!-- navbar -->
<nav class="navbar navbar-expand-lg navbar-dark lbry-dark nav-transparent fixed-top">
<div class="container">
<span class="navbar-brand order-1 mr-0"><i class="fab fa-github"></i></span>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="../">
<img src="../img/logo.png" alt="lbry-foundation-logo">
</a>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="../">Home</a>
<a class="nav-item nav-link active" href="#">Branding<span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="../tavern/">Tavern</a>
<a class="nav-item nav-link" href="../swarm/">Swarm</a>
<a class="nav-item nav-link" href="../governance/">Governance</a>
</div>
</div>
</div>
</nav>
<!-- /navbar -->
<!-- globalParallax -->
<div class="parallax" id="global-parallax">
<img src="../img/foundation-branding-background-art.png" data-depth-factor="3" alt="bg-img" class="d-none d-sm-none d-md-none d-lg-block parallax-layer main-parallax-img">
<div class="parallax-bg"></div>
<div class="parallax-mask"></div>
<!-- globalParallaxContent -->
<div class="parallax-content">
<!-- jumbotron -->
<div class="jumbotron text-white parallax-layer" data-depth-factor="4" style="background-color: transparent;">
<div class="container text-sm-center pt-5">
<h1 class="display-4" Ideas style="font-weight: bold;">Branding Assets</h1>
<hr class="heading">
<p class="lead">Find and download official LBRY Foundation branding assets and brand guidelines.</p>
</div>
</div>
<!-- /jumbotron -->
<div class="container-fluid above-parallax">
<h1>LBRY Branding</h1>
<!-- <ol>
<li>B</li>
<li>R</li>
<li>A</li>
<li>N</li>
<li>D</li>
</ol> -->
<!-- <div class="container">
<img src="../img/lbry-logo.png" class="rounded mx-auto d-block" alt="lbry-foundation-logo">
</div> -->
<!--logo-->
<h2 class="my-4">Logos</h2>
<div class="row">
<div class="col-md-6 col-lg-3">
<div class="card mb-3 lbry-dark">
<div class="card-body">
<img src="../img/logo.png" class="rounded mx-auto d-block" alt="lbry-foundation-logo">
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="card mb-3 lbry-dark">
<div class="card-body">
<img src="../img/logo.png" class="rounded mx-auto d-block" alt="lbry-foundation-logo">
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="card mb-3 lbry-dark">
<div class="card-body">
<img src="../img/logo.png" class="rounded mx-auto d-block" alt="lbry-foundation-logo">
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="card mb-3 lbry-dark">
<div class="card-body">
<img src="../img/logo.png" class="rounded mx-auto d-block" alt="lbry-foundation-logo">
</div>
</div>
</div>
</div>
<hr class="content">
<!--/logo-->
<!--colors-->
<h2 class="my-4">Colors</h2>
<div class="row">
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
<div class="col-md-6 col-lg-2">
<div class="card mb-3 lbry-dark">
<div class="card-body">
</div>
</div>
<p class="text-center">#034C69 <br> rgb(3, 76, 105)</p>
</div>
</div>
<hr class="content">
<!--/colors-->
<!--fonts-->
<h2 class="my-4">Fonts &amp; Typography</h2>
<div class="row mb-3">
<div class="col-md-6 col-lg-6">
<div class="card mb-3 lbry-dark">
<div class="card-body">
<h1>H1</h1>
<h2>H2</h2>
<h3>H3</h3>
</div>
</div>
<p class="text-center">Google Fonts: <a href="https://fonts.google.com/specimen/Oxygen" target="_blank">Oxygen</a></p>
</div>
<div class="col-md-6 col-lg-6">
<div class="card mb-3 lbry-dark">
<div class="card-body">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
</div>
<p class="text-center">Google Fonts: <a href="https://fonts.google.com/specimen/Oxygen" target="_blank">Oxygen</a></p>
</div>
</div>
<!--/fonts-->
</div>
<!-- footer -->
<div class="container-fluid above-parallax">
<div class="row py-3">
<div class="col-md-7">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="#">Terms and Condition</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Privacy Policy</a>
</li>
<li class="nav-item">
<div class="btn-group dropup">
<button type="button" class="btn btn-outline-secondary text-white">Other Sites</button>
<button type="button" class="btn btn-outline-secondary dropdown-toggle dropdown-toggle-split"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="https://lbry.com">LBRY.com</a>
<a class="dropdown-item" href="https://lbry.tech">LBRY.tech</a>
<a class="dropdown-item" href="https://lbry.fund">LBRY.fund</a>
<a class="dropdown-item" href="https://lbry.tv">LBRY.tv</a>
</div>
</div>
</li>
</ul>
</div>
<div class="col-md text-md-right">
<small>&copy; 2020 LBRY.org &amp; LBRY Foundation</small>
</div>
</div>
</div>
<!-- /footer -->
</div>
<!-- /globalParallaxContent -->
</div>
<!-- /globalParallax -->
<!-- JS DEPENDENCIES -->
<script src="../lib/jquery/jquery-3.5.1.min.js" defer></script>
<script src="../lib/bootstrap/js/bootstrap.bundle.min.js" defer></script>
<!-- /JS DEPENDENCIES -->
<!--CUSTOM JS-->
<script src="../lib/js/index.js" defer></script>
<!--/CUSTOM JS-->
</body>
</html>