mirror of
https://github.com/Poniverse/Pony.fm.git
synced 2024-11-22 04:58:01 +01:00
New scrollable tabs
This commit is contained in:
parent
336e04a0c1
commit
db21f82739
4 changed files with 81 additions and 6 deletions
|
@ -1,7 +1,7 @@
|
|||
<ul class="tabs">
|
||||
<ul class="tabs fixed">
|
||||
<li ui-sref-active="active"><a ui-sref=".about">About Pony.fm</a></li>
|
||||
<li ui-sref-active="active"><a ui-sref=".faq">FAQ</a></li>
|
||||
<li ui-sref-active="active"><a ui-sref=".mlpforums-advertising-program">MLP Forums Advertising Program</a></li>
|
||||
</ul>
|
||||
|
||||
<ui-view class="static-page"></ui-view>
|
||||
<ui-view class="static-page fixed-tabs"></ui-view>
|
||||
|
|
|
@ -19,5 +19,5 @@
|
|||
|
||||
<h2>Who is behind Pony.fm?</h2>
|
||||
<p>Pony.fm was created by Feld0, a pony-loving teenager who heard the call of code. Recognizing the need for a true pony-specific music hosting site, and realizing that MLP Forums provided him with the resources he needed to make it happen, he created a blank text file and started pumping code into his computer.</p>
|
||||
<p>The site is now maintained by him and Nelson LaQuet as part of the <a href="https://poniverse.net/" target="_blank">Poniverse</a> network.</p>
|
||||
<p>The site is now maintained by him, Nelson LaQuet and Logic as part of the <a href="https://poniverse.net/" target="_blank">Poniverse</a> network.</p>
|
||||
</div>
|
||||
|
|
|
@ -69,8 +69,8 @@
|
|||
target="_blank">official
|
||||
Pony.fm forum</a>.
|
||||
</li>
|
||||
<li>Email <a href="mailto:feld0@pony.fm"
|
||||
target="_blank">Feld0</a>, Pony.fm's lead developer.
|
||||
<li>Email <a href="mailto:logic@pony.fm"
|
||||
target="_blank">Logic</a>, Pony.fm's lead developer.
|
||||
</li>
|
||||
<li>Open a <a href="https://github.com/Poniverse/Pony.fm/issues"
|
||||
target="_blank">GitHub issue</a>.
|
||||
|
@ -107,7 +107,7 @@
|
|||
|
||||
<h2>How do I report someone?</h2>
|
||||
|
||||
<p>Email <a href="mailto:feld0@pony.fm" target="_blank">feld0@pony.fm</a>
|
||||
<p>Email <a href="mailto:logic@pony.fm" target="_blank">logic@pony.fm</a>
|
||||
with any
|
||||
moderation issues you have.</p>
|
||||
|
||||
|
|
75
resources/assets/styles/mobile.less
vendored
75
resources/assets/styles/mobile.less
vendored
|
@ -17,6 +17,10 @@
|
|||
padding: 5px;
|
||||
}
|
||||
|
||||
.site-body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.now-playing {
|
||||
margin-left: 0px;
|
||||
position: fixed;
|
||||
|
@ -74,6 +78,13 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
font-size: 12pt;
|
||||
a {
|
||||
padding: 13px 25px;
|
||||
}
|
||||
}
|
||||
|
||||
&.animated {
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
@ -294,6 +305,70 @@
|
|||
right: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.news {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.two-pane-view.open {
|
||||
.list {
|
||||
width: auto;
|
||||
float: none;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.editor {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
width: 100%;
|
||||
overflow-x: scroll;
|
||||
display: flex;
|
||||
white-space: nowrap;
|
||||
border-bottom: 0;
|
||||
height: 41px;
|
||||
|
||||
li {
|
||||
a {
|
||||
border-bottom: 4px solid #ddd;
|
||||
}
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.fixed {
|
||||
position: fixed;
|
||||
background: #84528a;
|
||||
top: 64px;
|
||||
left: 0;
|
||||
height: 41px;
|
||||
width: 100%;
|
||||
border-bottom: 0;
|
||||
|
||||
li {
|
||||
a {
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
&.active a {
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
border-bottom: 4px solid #b885bd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-tabs {
|
||||
padding-top: 42px;
|
||||
}
|
||||
}
|
||||
|
||||
// Super small phones like the iPhone 5
|
||||
|
|
Loading…
Reference in a new issue