LBRYFoundation/lbry.com
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry.com.git synced 2025-08-23 09:37:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

halfway

Browse source
This commit is contained in:
Jeremy Kauffman 2020-12-15 14:27:46 -05:00
parent af518b4dd4
commit 0a983bf60b
7 changed files with 66 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
view/template/download/_downloadRow.php
View file

@ -1,5 +1,17 @@
<div style="min-height: 40px; line-height: 40px;">
<?php echo View::render('download/_downloadButton', ['buttonStyle' => 'primary'])?>
<a href="https://lbry.tv" class="button button--inverse">Open in Browser</a>
<a href="/get?showall=1" class="button--link hide--mobile">show all platforms</a>
<div style=" display: flex; margin-top: 2rem;">
<div style="flex: 1; text-align: center;">
<div style="line-height: 32px;">
<?php echo View::render('download/_downloadButton', ['buttonStyle' => 'primary'])?>
</div>
<small style="margin-top: 2px; display: inline-block"><a href="/get?showall=1" class="button--link hide--mobile">other platforms</a></small>
</div>
<div style="flex: 1; text-align: center">
<a href="https://odysee.com">
<img style="height: 40px;" src="https://odysee.com/public/img/odysee.png" />
</a>
<br/>
<small class="meta" style=" display: inline-block; max-width: 160px">use LBRY in your browser, with odysee.com</small>
</div>
</div>

2
view/template/nav/_header.php
View file

@ -251,7 +251,7 @@
<?php js_end() ?>
<span class="header__download">
<a href="https://open.lbry.com" class="button button--primary">Open LBRY</a>
<a href="https://open.lbry.com" class="button button--primary">Try Odysee</a>
</span>
</div>
</header>

24
view/template/page/home.php
View file

@ -6,10 +6,11 @@
<div class="inner-wrap">
<aside class="home__cta">
<div class="home__cta-copy">
<h1>It's time to take back control from YouTube and Amazon.</h1>
<p><small class="meta">Top creators, self-respecting users, the privacy conscious, computer geeks, freedom lovers, loveable kooks, and readers of small gray text everywhere choose LBRY, because it's open, fair, and free.</small></p>
<h1>LBRY does to publishing,<br/>
what Bitcoin did to money.</h1>
<p><span class="meta">Join top creators and more than 10,000,000 people on LBRY, an open, free, and fair network for digital content.</span></p>
<?php echo View::render('download/_downloadRow') ?>
</div>
<?php echo View::render('download/_downloadRow') ?>
</aside>
<figure class="home__preview">
@ -29,21 +30,16 @@
</section>
<section class="home__callout">
<p>LBRY is a secure, open, and community-run digital marketplace.</p>
<p>Enjoy the latest content from your favorite creators - as a user, not a product.</p>
</section>
<section class="home__hype">
<div class="inner-wrap">
<p>See previews of the LBRY app and the great content available now on LBRY.</p>
<br>
<iframe width="560" height="315" src="https://lbry.tv/$/embed/meetlbrytv/c6c0a5caa6cc391696e1270e33cd9d24ee7c2d52" allowfullscreen></iframe>
</div>
<h2>Enjoy the latest content from your favorite creators - as a user, not a product.</h2>
<p>This video shows footage from <a href="https://odysee.com">odysee.com</a>, the most popular LBRY app. This same content can be accessed by <a href="/get">LBRY Desktop</a> and other clients as part of the web 3.0 LBRY network.</p>
<div class="inner-wrap" style="margin-top: 1rem">
<iframe id="lbry-iframe" width="560" height="315" src="https://odysee.com/$/embed/odysee/7a416c44a6888d94fe045241bbac055c726332aa?r=9wKhJPioiNxTBjT6Zoqaf7LNDJcauUjg" allowfullscreen></iframe>
</div>
</section>
<section class="home__cta">
<div class="inner-wrap">
<aside class="home__cta"><h2>Now Available for Desktop, Mobile, and Web Browsers.</h2></aside>
<aside class="home__cta"><h2>Use Desktop and Mobile apps for control. Use web for ease.</h2></aside>
<?php echo View::render('download/_downloadRow') ?>
</div>
</section>

13
web/components/sass/badge/_index.scss
View file

@ -22,11 +22,6 @@
.badge--free {
background-color: var(--lbry-blue-2);
[data-mode="dark"] & {
background-color: var(--lbry-blue-3);
color: var(--lbry-black);
}
}
.badge--large {
@ -34,14 +29,6 @@
line-height: 1;
}
.badge--nsfw {
background-color: var(--lbry-grape-2);
[data-mode="dark"] & {
background-color: var(--lbry-grape-3);
color: var(--lbry-black);
}
}
.badge--primary {
background-color: var(--lbry-teal-5);

9
web/components/sass/button/_index.scss
View file

@ -2,6 +2,7 @@
fill: currentColor;
position: relative;
white-space: nowrap;
display: inline-block;
}
.button--alt {
@ -62,16 +63,8 @@
color: inherit;
transition: background-color 0.2s;
[data-mode="dark"] & {
border-color: rgba($lbry-white, 0.1);
}
&:hover {
background-color: var(--lbry-gray-1);
[data-mode="dark"] & {
background-color: rgba($lbry-white, 0.1);
}
}
}

6
web/scss/_layout.scss
View file

@ -127,10 +127,10 @@ section {
small {
font-size: 0.8rem;
}
&.meta {
color: var(--lbry-gray-5);
}
.meta {
color: var(--lbry-gray-5);
}
strong {

49
web/scss/pages/_home.scss
View file

@ -11,38 +11,62 @@
background-image: linear-gradient(to right, $lbry-teal-2, $lbry-cyan-3 100%);
background-size: cover;
color: var(--lbry-white);
font-weight: 300;
padding: 2rem;
text-align: center;
p {
line-height: 1.55;
font-size: 1.2rem;
h2 {
margin-bottom: 1rem;
}
@media (min-width: 1251px) {
font-size: 2rem;
h2, p {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 1001px) and (max-width: 1250px) {
font-size: 1.5rem;
iframe {
max-width: 560px;
margin-left: auto;
margin-right: auto;
}
@media (max-width: 1000px) {
font-size: 1.25rem;
a {
text-decoration: underline;
}
}
.button--odysee {
padding: var(--spacing-xs) var(--spacing-s); // sass-lint:disable-line shorthand-values
background-color: rgb(229, 0, 84);
color: white;
border: 1px solid var(--lbry-gray-1);
border-radius: 1rem;
color: inherit;
transition: background-color 0.2s;
&:hover {
background-color: var(--lbry-gray-1);
}
}
.home__cta {
margin-bottom: 1rem;
text-align: center;
align-self: center;
h1 {
font-size: 2.5rem;
font-weight: 200;
margin-bottom: 1rem;
}
p {
margin-bottom: 1rem;
}
div {
font-size: 1rem;
@ -53,10 +77,7 @@
}
.home__cta-copy {
max-width: 700px;
p {
margin-bottom: 1rem;
}
max-width: 500px;
}
.home__hero {