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

lbry.tv mobile drivers

Browse source
This commit is contained in:
Jeremy Kauffman 2020-03-13 15:58:50 -04:00
parent 99fdb0e4b4
commit c67beacb9f
3 changed files with 27 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -17,6 +17,12 @@
</drawer-title> </drawer-title>
</drawer-section> </drawer-section>
<drawer-section class="header--mobile-only">
<drawer-title>
<a href="https://lbry.tv">Use on Web (lbry.tv)</a>
</drawer-title>
</drawer-section>
<drawer-section> <drawer-section>
<drawer-title> <drawer-title>
Community ⌄ Community ⌄
@ -195,6 +201,7 @@
/> />
</search-container> </search-container>
<a href="https://lbry.tv" class="button button--primary header__lbrytv header--mobile-only">lbry.tv</a>
<a href="#" class="header__toggle" id="menuToggle">Menu</a> <a href="#" class="header__toggle" id="menuToggle">Menu</a>
<?php js_start() ?> <?php js_start() ?>

6
web/scss/_layout.scss
View file

@ -186,11 +186,17 @@ input::placeholder {
.hide { .hide {
display: none; display: none;
} }
.hide--mobile { .hide--mobile {
@media (max-width: 800px) { @media (max-width: 800px) {
display: none; display: none;
} }
} }
.hide--desktop {
@media (min-width: 801px) {
display: none;
}
}
.align-text--center { .align-text--center {
text-align: center; text-align: center;

16
web/scss/components/_header.scss
View file

@ -75,8 +75,8 @@
.header__toggle { .header__toggle {
line-height: 5rem; line-height: 5rem;
padding-right: 2rem; padding-right: 1.5rem;
padding-left: 2rem; padding-left: 1.5rem;
position: absolute; position: absolute;
right: 0; right: 0;
@ -85,6 +85,18 @@
} }
} }
.header--mobile-only {
@media (min-width: 951px) {
display: none;
}
}
.header__lbrytv {
position: absolute;
right: 6rem;
z-index: 11;
}
search-container { search-container {
display: inline-flex; display: inline-flex;
height: 5rem; height: 5rem;