Changed footer buttons and added icons to them

This commit is contained in:
Kasper Rynning-Tønnesen
2016-02-11 13:47:37 +01:00
parent 1d8e05135a
commit 154b8608d0
3 changed files with 19 additions and 6 deletions

View File

@@ -77,13 +77,19 @@
</p>
<ul id="footer-buttons">
<li>
<a class="modal-trigger waves-effect cyan darken-2 help-button-footer" title="Need help with the site?" onclick="$('#help').openModal()">Help, how does this work?!</a>
<a class="modal-trigger waves-effect cyan darken-2 btn help-button-footer" title="Need help with the site?" onclick="$('#help').openModal()">
<i class="material-icons left footer-button-icon">info_outline</i>HELP
</a>
</li>
<li>
<a class="modal-trigger waves-effect blue-grey darken-2 help-button-footer" id="embed-button" title="Want to embed this channel?" onclick="$('#embed').openModal()">Embed this channel</a>
<a class="modal-trigger waves-effect blue-grey darken-2 btn help-button-footer" id="embed-button" title="Want to embed this channel?" onclick="$('#embed').openModal()">
<i class="material-icons left footer-button-icon">code</i>EMBED
</a>
</li>
<li>
<a class="modal-trigger waves-effect red darken-2 help-button-footer" id="contact-button" title="Contact us" onclick="$('#contact').openModal()">Contact us</a>
<a class="modal-trigger waves-effect red darken-2 btn help-button-footer" id="contact-button" title="Contact us" onclick="$('#contact').openModal()">
<i class="mdi-communication-email left footer-button-icon"></i>CONTACT
</a>
</li>
</ul>
<p id="latest-commit" class="grey-text text-lighten-4 truncate"></p>
@@ -107,7 +113,8 @@
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank" id="donate_form">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="JEXDYP59N5VWE">
<a title="Like what we made? Help us by donating (a) beer!" class="waves-effect waves-light btn orange light-blue share" onclick="document.getElementById('donate_form').submit();">Donate
<a title="Like what we made? Help us by donating (a) beer!" class="waves-effect waves-light btn orange light-blue share" onclick="document.getElementById('donate_form').submit();">
<i class="mdi-action-payment left footer-button-icon"></i>Donate
</a>
</form>
<p>

View File

@@ -17,6 +17,7 @@
<meta property="og:description" content="The Shared (free) YouTube radio. Being built around the YouTube search and video API it enables the creation of collaborative and shared live playlists, with billions of videos and songs to choose from, all for free and without registration. Enjoy!"/>
<meta property="og:type" content="website"/>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="/static/css/materialize.min.css" />
<link rel="stylesheet" type="text/css" href="/static/css/style.css" title="Default" />
<link rel="icon" id="favicon" type="image/png" href="/static/images/favicon.png"/>

View File

@@ -118,16 +118,21 @@ footer{
}
.help-button-footer{
padding: 10px;
width:17em;
background: #1e88e5;
border-radius: 2px;
color:white;
width:200px;
text-align: center;
}
#footer-buttons li a{
margin-top:10px;
padding-left:10px;
}
.footer-button-icon{
font-size:33px !important;
margin-right:10px;
}
footer.page-footer,