updated page widths

This commit is contained in:
bill bittner 2017-10-18 15:16:07 -07:00
parent 34fc618c72
commit aec7ac44cc
15 changed files with 36 additions and 69 deletions

View file

@ -23,12 +23,6 @@ html, body {
height: 100%; height: 100%;
} }
.page-contents {
margin: 0px auto;
padding: 0px;
height: calc(100% - 7rem);
max-width: 1200px;
}
/* TEXT */ /* TEXT */
body, button, input, textarea, label, select, option { body, button, input, textarea, label, select, option {
@ -146,13 +140,19 @@ h3 {
padding-left: 0px; padding-left: 0px;
} }
.row--narrow {
margin: 0px auto;
max-width: 1200px;
}
.row--short { .row--short {
padding-top: 0px; padding-top: 0px;
padding-bottom: 0px; padding-bottom: 0px;
} }
.row--full-height { .row--full-height {
height: calc(100% - 4rem); height: calc(100% - 11rem);
} }
.row--no-top { .row--no-top {
@ -429,6 +429,7 @@ table {
.nav-bar-subtitle { .nav-bar-subtitle {
font-size: small; font-size: small;
padding-left: 4rem;
} }
.nav-bar-link { .nav-bar-link {

View file

@ -1,26 +1,17 @@
@media (max-width: 1050px) { @media (max-width: 1050px) {
.nav-bar-title, .nav-bar-subtitle { .nav-bar-subtitle {
padding-bottom: 0px; display: none;
}
.nav-bar-link-section {
position: relative;
padding-left: 0px;
}
.nav-bar {
height: 8rem;
}
.page-contents {
height: calc(100% - 8rem);
} }
} }
@media (max-width: 750px ) { @media (max-width: 750px ) {
body, button, input, textarea, label, select, option {
font-size: medium;
}
.column--med-10 { .column--med-10 {
width: 100%; width: 100%;
} }
@ -30,10 +21,14 @@
} }
.nav-bar { .nav-bar {
height: 12rem; height: 9rem;
} }
.nav-bar-title, .nav-bar-subtitle { .row--full-height {
height: calc(100% - 16rem);
}
.nav-bar-title {
padding-bottom: 0px; padding-bottom: 0px;
} }
@ -50,15 +45,12 @@
padding: 1em 0px 1em 0px; padding: 1em 0px 1em 0px;
} }
.page-contents {
height: calc(100% - 12rem);
}
} }
@media (max-width: 350px) { @media (max-width: 450px) {
body, button, input, textarea, label, select, option { body, button, input, textarea, label, select, option {
font-size: medium; font-size: small;
} }
} }

View file

@ -1,4 +1,4 @@
<div class="row row--full-height"> <div class="row row--full-height row--narrow">
<div class="column column--5 column--med-10 align-content-top"> <div class="column column--5 column--med-10 align-content-top">
<div class="row row--short"> <div class="row row--short">
<span class="pull-quote">Open-source, decentralized image and video hosting</span> <span class="pull-quote">Open-source, decentralized image and video hosting</span>

View file

@ -1,4 +1,4 @@
<div class="row row--full-height"> <div class="row row--full-height row--narrow">
<div class="column column--10 align-content-center"> <div class="column column--10 align-content-center">
<h2>{{this.channelName}}<span class="h2--secondary">:{{this.longChannelId}}</span></h2> <h2>{{this.channelName}}<span class="h2--secondary">:{{this.longChannelId}}</span></h2>
</div> </div>

View file

@ -1,4 +1,4 @@
<div> <div class="row row--narrow">
<h3>404: Not Found</h3> <h3>404: Not Found</h3>
<p>That page does not exist. Return <a href="/">home</a>.</p> <p>That page does not exist. Return <a href="/">home</a>.</p>
</div> </div>

View file

@ -16,7 +16,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="publish-form-wrapper" hidden="true"> <div id="publish-form-wrapper" class="row row--short row--narrow" hidden="true">
<div class="column column--10"> <div class="column column--10">
<!-- title input --> <!-- title input -->
<input type="text" id="publish-title" class="input-text input-text--large input-text--full-width" placeholder="Give your post a title..."> <input type="text" id="publish-title" class="input-text input-text--large input-text--full-width" placeholder="Give your post a title...">

View file

@ -30,8 +30,6 @@
<script src="/assets/js/navBarFunctions.js"></script> <script src="/assets/js/navBarFunctions.js"></script>
{{> releaseBanner}} {{> releaseBanner}}
{{> navBar}} {{> navBar}}
<div class="page-contents">
{{{ body }}} {{{ body }}}
</div>
</body> </body>
</html> </html>

View file

@ -23,9 +23,7 @@
<script src="/assets/js/loginFunctions.js"></script> <script src="/assets/js/loginFunctions.js"></script>
<script src="/assets/js/navBarFunctions.js"></script> <script src="/assets/js/navBarFunctions.js"></script>
{{> navBar}} {{> navBar}}
<div class="page-contents">
{{{ body }}} {{{ body }}}
</div>
<script src="/assets/js/showFunctions.js"></script> <script src="/assets/js/showFunctions.js"></script>
</body> </body>
</html> </html>

View file

@ -1,4 +1,4 @@
<div class="row row--full-height"> <div class="row row--full-height row--narrow">
<div class="row row--wide"> <div class="row row--wide">
<p>Channels allow you to publish and group content under an identity. You can create a channel for yourself, or share one with like-minded friends. You can create 1 channel, or 100, so whether you're documenting <a target="_blank" href="/@hikingchris45">a hike around town</a>, or making a public repository for <a target="_blank" href="/@catGifs">cat gifs</a> (password: '1234'), try creating a channel for it!</p> <p>Channels allow you to publish and group content under an identity. You can create a channel for yourself, or share one with like-minded friends. You can create 1 channel, or 100, so whether you're documenting <a target="_blank" href="/@hikingchris45">a hike around town</a>, or making a public repository for <a target="_blank" href="/@catGifs">cat gifs</a> (password: '1234'), try creating a channel for it!</p>
</div> </div>

View file

@ -1,22 +0,0 @@
<div>
<h2>New on Spee.ch</h2>
<p><i>The 25 most recent publishes on spee.ch</i></p>
{{#each newClaims}}
<div class="all-claims-item">
<a href="/{{this.claimId}}/{{this.name}}">
{{#ifConditional this.fileType '===' 'video/mp4'}}
<img class="all-claims-asset" src="/assets/img/video_thumb_default.png"/>
{{else}}
<img class="all-claims-asset" src="/{{this.claimId}}/{{this.name}}.ext" />
{{/ifConditional}}
</a>
<div class="all-claims-details">
<ul style="list-style-type:none">
<li><bold>{{this.name}}</bold></li>
<li><i>Claim Id: {{this.claimId}}</i></li>
<li><a href="/{{this.claimId}}/{{this.name}}">Link</a></li>
</ul>
</div>
</div>
{{/each}}
</div>

View file

@ -1,4 +1,4 @@
<div class="row"> <div class="row row--narrow">
<h3>No Channel</h3> <h3>No Channel</h3>
<p>There are no published channels matching your url</p> <p>There are no published channels matching your url</p>
<p>If you think this message is an error, contact us in the <a href="https://lbry.slack.com/" target="_blank">LBRY slack!</a></p> <p>If you think this message is an error, contact us in the <a href="https://lbry.slack.com/" target="_blank">LBRY slack!</a></p>

View file

@ -1,4 +1,4 @@
<div class="row"> <div class="row row--narrow">
<h3>No Claims</h3> <h3>No Claims</h3>
<p>There are no free assets at that claim. You should publish one at <a href="/">spee.ch</a>.</p> <p>There are no free assets at that claim. You should publish one at <a href="/">spee.ch</a>.</p>
<p>NOTE: it is possible your claim was published, but it is still being processed by the blockchain</p> <p>NOTE: it is possible your claim was published, but it is still being processed by the blockchain</p>

View file

@ -47,13 +47,13 @@
<a target="_blank" href="https://twitter.com/intent/tweet?text=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">twitter</a> <a target="_blank" href="https://twitter.com/intent/tweet?text=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">twitter</a>
</div> </div>
<div class="column column--2"> <div class="column column--2">
<a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fspee.ch%2F{{fileInfo.shortId}}%2F{{fileInfo.name}}">facebook</a> <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">facebook</a>
</div> </div>
<div class="column column--2"> <div class="column column--2">
<a target="_blank" href="">tumblr</a> <a target="_blank" href="http://tumblr.com/widgets/share/tool?canonicalUrl=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">tumblr</a>
</div> </div>
<div class="column column--2"> <div class="column column--2">
<a target="_blank" href="https://www.reddit.com/submit?url=http%3A%2F%2Fspee.ch%2F{{fileInfo.shortId}}%2F{{fileInfo.name}}&title={{fileInfo.name}}">reddit</a> <a target="_blank" href="https://www.reddit.com/submit?url=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}&title={{fileInfo.name}}">reddit</a>
</div> </div>
</div> </div>
</div> </div>

View file

@ -1,4 +1,4 @@
<div class="row grid"> <div class="row row--narrow grid">
{{#each trendingAssets}} {{#each trendingAssets}}
{{> gridItem}} {{> gridItem}}
{{/each}} {{/each}}

View file

@ -1,4 +1,4 @@
<div class="row row--full-height"> <div class="row row--full-height row--narrow">
<div class="column column--10"> <div class="column column--10">
<!-- title --> <!-- title -->
<span class="title-show">{{fileInfo.title}}</span> <span class="title-show">{{fileInfo.title}}</span>