app.css cleanup

app/.meteor/packages

@@ -31,4 +31,4 @@ emojione:emojione
 utilities:avatar
 matb33:collection-hooks
 aldeed:collection2
-materialize:materialize
+materialize:materialize

app/client/app.css

@@ -1,1044 +0,0 @@
-@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300);
-
-body {
-  display: flex;
-  min-height: 100vh;
-  flex-direction: column;
-  background-color: rgb(245, 245, 245);
-}
-
-main {
-  flex: 1 0 auto;
-}
-
-.brand-logo {
-  margin-left: 10px;
-}
-
-.admin-container {
-  background-color: rgb(102, 205, 170);
-  color: white;
-  overflow-y: scroll;
-  margin-top: 20px;
-}
-
-.admin-container div {
-  padding-bottom: 10px;
-  text-align: center;
-}
-
-.admin-container div a {
-  text-decoration: none;
-  font-size: 22px;
-  padding-left: 5px;
-  vertical-align: top;
-}
-
-.admin-container div a:hover {
-  text-decoration: none;
-}
-.admin-container h1 {
-  margin: 0;
-  display: inline-block;
-}
-
-.admin-container p {
-  font-size: 22px;
-}
-
-.admin-container a {
-  color: white;
-  font-size: 16px;
-}
-
-.queueTable th {
-  font-size: 22px;
-  text-align: center;
-}
-
-.queueTable td {
-  padding: 10px;
-  font-size: 18px;
-}
-
-.g-recaptcha {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    width: 304px;
-    margin: 0 auto 10px auto;
-    display: block;
-    text-align: center;
-    font-size: 18px;
-    color: white;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-    font-weight: 300;
-}
-
-.button-nowidth {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    background-color: white;
-    border: 0;
-    padding: 10px 15px;
-    color: #53e3a6;
-    border-radius: 3px;
-    cursor: pointer;
-    font-size: 18px;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-}
-
-.button-nowidth:hover {
-    background-color: #f5f7f9;
-}
-
-.button {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    background-color: white;
-    border: 0;
-    padding: 10px 15px;
-    color: #53e3a6;
-    border-radius: 3px;
-    width: 304px;
-    cursor: pointer;
-    font-size: 18px;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-}
-
-.button:hover {
-    background-color: #f5f7f9;
-}
-
-.station {
-    background-color: rgba(102, 205, 170, 0.7);
-    height: 300px;
-    width: 300px;
-    border-radius: 100%;
-    text-align: center;
-    color: white;
-    font-family: Sans-serif;
-    /*float: left;*/
-    margin-right: auto;
-    margin-left: auto;
-    position: relative;
-}
-
-.station > h3 {
-    line-height: 0px;
-    font-size: 42px;
-    margin-bottom: 90px;
-}
-
-.station > h5 {
-    margin-top: -40px;
-    font-size: 15px;
-}
-
-.room-name {
-    font-size: 3.5em;
-    color: white;
-    font-weight: 600;
-    text-align: center;
-}
-
-.room-title {
-    font-size: 2.5em;
-    color: white;
-    font-weight: 600;
-}
-
-.room-artist {
-    font-size: 1.5em;
-    color: white;
-}
-
-#seeker-bar {
-    background-color: black;
-    width: 0;
-    height: 10px;
-    clear: both;
-    background-color: rgba(16, 140, 146, 0.8);
-}
-
-.song-input {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    border: 1px solid rgba(255, 255, 255, 0.4);
-    background-color: rgba(255, 255, 255, 0.2);
-    width: 304px;
-    border-radius: 3px;
-    padding: 10px 15px;
-    margin: 1em auto 10px auto;
-    display: block;
-    text-align: center;
-    font-size: 18px;
-    color: white;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-    font-weight: 300;
-}
-
-#chat-input, #global-chat-input {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    border: 1px solid white;
-    background-color: transparent;
-    width: 100%;
-    height: 70px;
-    padding: 5px;
-    border-radius: 3px;
-    text-align: left;
-    font-size: 18px;
-    color: #1C39B2;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-    font-weight: 300;
-    resize: none;
-}
-
-.song-input-select {
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    appearance: none;
-    outline: 0;
-    border: 1px solid rgba(255, 255, 255, 0.4);
-    background-color: rgba(255, 255, 255, 0.2);
-    width: 304px;
-    border-radius: 3px;
-    padding: 10px 15px;
-    margin: 1em auto 10px auto;
-    display: block;
-    text-align: center;
-    font-size: 18px;
-    color: white;
-    -webkit-transition-duration: 0.25s;
-    transition-duration: 0.25s;
-    font-weight: 300;
-}
-
-.song-input:hover {
-    background-color: rgba(255, 255, 255, 0.4);
-}
-
-.song-input:focus {
-    background-color: rgba(255, 255, 255, 0.4);
-}
-
-.song-input-select:hover {
-    background-color: rgba(255, 255, 255, 0.4);
-}
-
-.song-input-select > option {
-    color: black;
-    background-color: rgba(255, 255, 255, 0.2);
-}
-
-.song-input:focus {
-    width: 354px;
-    color: white;
-}
-
-#search-song {
-    display: block;
-    margin: 0 auto;
-}
-
-#song-results, #youtube-import-queue {
-    margin: 0 auto;
-    color: white;
-    margin-top: 1em;
-    font-size: 1.5em;
-    text-align: center;
-}
-
-.youtube-import-queue-item {
-    position: relative !important;
-}
-
-#song-results > div {
-    margin: 0;
-    padding: 5px;
-    text-align: left;
-    border-bottom: 1px solid white;
-    transition: background-color 300ms linear;
-    transition: color 300ms linear;
-}
-
-#song-results > div:last-child {
-    border-bottom: 0;
-}
-
-#song-results > div:hover {
-    color: #0e90d2;
-    background-color: rgba(255, 255, 255, 0.5);
-
-    cursor: pointer;
-}
-
-.song-result-thumbnail {
-    width: 224px;
-    height: 126px;
-    margin-top: 50px;
-    margin-left: auto;
-    margin-right: auto;
-    word-break: break-all;
-    display: block;
-}
-
-.song-result-title {
-    margin-left: 20px;
-    margin-top: 10px;
-    display: block;
-    box-sizing: border-box;
-    font-size: 1.4em;
-}
-
-.song-result-channel {
-    margin-left: 20px;
-    margin-top: 5px;
-    display: block;
-    box-sizing: border-box;
-    font-size: 0.9em;
-}
-
-#player {
-    z-index: 10;
-}
-
-.hidden {
-    visibility: hidden;
-}
-.hidden-2 {
-    visibility: hidden;
-    height: 0px;
-    width: 0px;
-    margin: 0;
-    padding: 0;
-}
-.footerButtons {
-    background: none !important;
-    border: none;
-    padding: 0 !important;
-    font: inherit;
-    cursor: pointer;
-}
-
-.footerButtons:hover {
-    background-color: #f5f7f9;
-}
-
-.song-img {
-    width: 210px;
-    height: 210px;
-}
-
-#seeker-container {
-    width: calc(100% - 70px);
-    margin-left: 30px;
-    margin-right: 35px;
-    overflow: hidden;
-}
-
-.pl-container {
-    color: #53e3a6;
-    background-color: white;
-    border-radius: 3px;
-    font-size: 18px;
-}
-
-.pl-container h4 {
-    text-align: center;
-    font-size: 40px;
-    margin-bottom: 10px;
-}
-
-#spinner {
-    font-size: 200px;
-    color: bisque;
-}
-
-#spinner-container {
-    margin-left: auto;
-    margin-right: auto;
-    width: 200px;
-    margin-top: 10%;
-}
-
-#calert-priority > option {
-    color: black;
-}
-
-#spinner {
-    font-size: 200px;
-    color: bisque;
-}
-
-#spinner-container {
-    margin-left: auto;
-    margin-right: auto;
-    width: 200px;
-    margin-top: 10%;
-}
-
-.modal-content, .modal-footer {
-    background-color: rgb(107, 197, 164) !important;
-    color: white !important;
-}
-
-.modal-close {
-    background-color: #fff;
-    color: #53e3a6;
-}
-
-.song-input-label {
-    width: 100%;
-    text-align: center;
-}
-
-.station_link {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-    border-radius: 100%;
-}
-
-ul#playlist{
-    margin-top: 50px;
-    padding-left: 5px;
-}
-
-#playlist {
-    margin: 0;
-    color: white;
-    font-size: 21px;
-    max-height: 100%;
-    height: 100%;
-    /*overflow: auto;*/
-}
-
-#playlist-ul {
-    margin: 0;
-    color: white;
-    font-size: 21px;
-    max-height: calc(100% - 48px);
-    height: calc(100% - 48px);
-    overflow: auto;
-    padding-left: 5px;
-}
-
-
-#s2 {
-    opacity: 0.66666666666666;
-}
-
-#s3 {
-    opacity: 0.33333333333333;
-}
-
-#add-song-button, #get-spotify-info, #save-song-button, #report-song-button {
-    display: block;
-    margin: 0 auto;
-}
-
-.alert {
-    text-align: center;
-}
-
-@media (max-width: 992px) {
-    /* some think */
-    #s3 {
-        visibility: hidden;
-        height: 0;
-    }
-}
-
-@media (max-width: 768px) {
-    /* some think */
-    #s2 {
-        visibility: hidden;
-        height: 0;
-    }
-}
-
-.column-small {
-    width: 1px;
-}
-
-#return {
-    display: block;
-    margin: 0 auto 20px auto;
-}
-
-#song-media {
-    margin-left: 10px;
-    min-height: 460px;
-}
-
-#station-main {
-    margin: 0;
-    padding: 0;
-}
-
-#station-main nav {
-    height: 50px;
-    color: white;
-}
-
-/*Navbar HAMBURGUR*/
-.navbar-default .navbar-toggle .icon-bar{
-    background-color: white;
-}
-
-.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
-    background-color: transparent;
-}
-
-.navbar-default .navbar-toggle{
-    background-color: transparent;
-}
-
-nav form{
-    height: 0;
-}
-
-nav form input[type="image"]{
-    width: 100px;
-    background-color: transparent !important;
-    border: none !important;
-    margin-top: -15px;
-}
-
-#station-main nav i {
-    margin-left: 1em;
-    font-size: 2em;
-}
-
-#station-main nav h3 {
-    display: inline-block;
-    margin: 10px auto;
-    margin-left: 50%;
-    font-size: 2em;
-}
-
-#side-panel {
-    height: 100vh;
-    padding-left: 0;
-    padding-right: 0;
-    background-color: rgba(255, 255, 255, 0.4);
-}
-
-.embed-responsive {
-    margin-top: 15px;
-}
-
-#header {
-    margin-bottom: 0px;
-}
-
-.user-stat {
-    font-size: 20px;
-    color: #53e3a6;
-}
-
-#profile-name {
-    font-size: 60px;
-    color: #FFFFFF;
-    margin-right: auto;
-    margin-left: auto;
-    text-align: center;
-}
-
-.admin-queue-panel:first-child {
-    margin-top: 20px;
-}
-
-#songs {
-    margin-top: -200px;
-    margin-bottom: 20px;
-}
-
-.back {
-    color: white;
-}
-
-.back:hover {
-    color: white;
-}
-
-#volume-container {
-    width: 172px; /*12.5 px each side*/
-    float: right;
-    height: 100%;
-}
-
-#volume-container > .slider {
-    top: 40%;
-    transform: translateY(-40%);
-    padding-right: 12px;
-    padding-left: 12px;
-    margin-left: 12px;
-    float: left;
-}
-
-#volume-container-admin {
-    display: inline-block;
-    width: 174px;
-    margin-left: 10px;
-}
-
-#volume-container-admin > .slider {
-    width: 150px !important;
-    padding-left: 12px;
-    padding-right: 12px;
-    margin-left: 12px;
-}
-
-#volume-icon {
-    /*margin-left: 320px !important;*/
-    margin: 0 !important;
-    float: left;
-    margin-top: 7px !important;
-    width: 12px;
-}
-
-#settings {
-    margin-top: 10px;
-    margin-left: 10px;
-}
-
-#voting {
-    margin-top: 10px;
-    margin-left: 10px;
-}
-
-#loginregistercontainer {
-    margin-bottom: 100px;
-}
-
-.admin-header {
-    color: white;
-}
-
-.admin-panel-body {
-    max-height: 400px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-}
-.terms, .privacy, .about {
-  color: white;
-}
-.about a{
-    color: white;
-}
-#play, #pause, #skip, #shuffle, #sync, #unlock, #lock {
-    cursor: pointer;
-}
-.delete-room {
-    display: inline-block;
-    cursor: pointer;
-}
-.delete-room:hover {
-    color: red;
-}
-.panel-title {
-    display: inline-block;
-}
-.report-layer-1 {
-    margin-left: 19%;
-}
-.report-layer-2 {
-    margin-left: 80px;
-}
-.other-textarea {
-    outline: 0px;
-    border: 1px solid rgba(255, 255, 255, 0.4);
-    width: 304px;
-    border-radius: 3px;
-    padding: 10px 15px;
-    margin: 5px -285.578px 10px 0px;
-    display: block;
-    text-align: left;
-    font-size: 18px;
-    color: white;
-    transition-duration: 0.25s;
-    font-weight: 300;
-    background-color: rgba(255, 255, 255, 0.2);
-    resize: vertical;
-}
-#room-header {
-    position: absolute;
-    left: 0;
-    right: 0;
-    margin-left: auto;
-    margin-right: auto;
-    width: 100px;
-}
-#room-icons {
-    margin-top: 11px;
-    float: left;
-}
-#time-display {
-    color: white;
-}
-.action-button {
-    float: left;
-    width: 100%;
-}
-.chat-message {
-    font-size: 20px;
-    color: white;
-}
-.chat-message:first-child {
-    margin-top: 30px;
-}
-#chat-ul, #global-chat-ul {
-    margin: 0;
-    padding: 0 15px 0 15px;
-    padding-bottom: 20px;
-    word-break: normal;
-    word-wrap: break-word;
-    height: 82%;
-    overflow-y: scroll;
-}
-.chat-message:nth-child(even) {
-   color: white;
-}
-.chat-message:nth-child(odd) {
-    color: darkblue;
-}
-#submit, #global-submit {
-    margin-bottom: 10px;
-    cursor: pointer;
-}
-#submit button, #global-submit button{
-    width: 100%;
-    font-size: 1.5em;
-}
-#submit i, #global-submit i{
-    margin-left: 10px;
-}
-#chat-input-div, #global-chat-input-div {
-    width: 100%;
-    padding-left: 15px;
-    padding-right: 15px;
-}
-.rank-admin {
-    color: crimson;
-    font-size: 20px;
-    font-weight: bold;
-}
-.rank-mod, .rank-moderator {
-    color: darkgoldenrod;
-    font-size: 20px;
-    font-weight: bold;
-}
-.rank-default {
-    font-size: 0px;
-}
-
-.sidebar-content {
-    height: calc(100% - 42px);
-}
-#chat, #global-chat {
-    height:100%;
-}
-.navbar-default .navbar-nav .open .dropdown-menu>li>a,.navbar-default .navbar-nav .open .dropdown-menu {
-    background-color: transparent;
-    color:#ffffff;
-}
-.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
-    background-color: transparent;
-    color:#ffffff;
-}
-#doorbell-button{
-    margin-right: 30em;
-}
-#doorbell-email {
-    text-align: left;
-}
-#search-playlist{
-    outline: 0;
-    border: none;
-    border-bottom: 3px solid rgba(255, 255, 255, 0.4);
-    background-color: #50a3a2;
-    width: 100%;
-    padding: 10px 15px;
-    margin: 0 auto 0 auto;
-    display: block;
-    text-align: center;
-    font-size: 18px;
-    color: white;
-}
-.nav-tabs li a{
-    color: white;
-}
-
-.navbar-overflow-y-hidden {
-    overflow-y: hidden;
-}
-
-/* https://css-tricks.com/custom-scrollbars-in-webkit/ */
-
-::-webkit-scrollbar {
-    width: 8px;
-}
-
-::-webkit-scrollbar-track {
-    border-radius: 10px;
-}
-
-::-webkit-scrollbar-thumb {
-    border-radius: 10px;
-    background-color: white;
-}
-
-.contact-details{
-    margin-bottom: 5px;
-}
-
-.contact-details .material-icons{
-    float: left;
-}
-
-.settings-label {
-    color: #50a3a2;
-    line-height: 18px;
-}
-.faq-small {
-    color: white;
-}
-.questions {
-    color: white;
-    font-size: 100;
-}
-.answers {
-    color: white;
-    font-size: 50;
-}
-#header-dropdown {
-    top: 100% !important;
-    height: auto;
-    padding: 5px 0;
-    margin: 2px 0 0;
-    border: 1px solid #ccc;
-    border: 1px solid rgba(0, 0, 0, .15);
-    border-radius: 4px;
-    overflow: inherit;
-    font-size: 14px;
-    letter-spacing: inherit;
-    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
-    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
-    background-color: #51BCA3;
-}
-
-#header-dropdown li:hover {
-    background-color: #3A8876;
-}
-#ban-icon {
-    font-size: 20em;
-    text-align: center;
-    width: 100%;
-    z-index: 3;
-}
-#banned-container {
-    color: white;
-}
-.social-link{
-    margin-right: 5px;
-}
-@media (max-width: 991px){
-    .contact-img{
-        float: none;
-        margin-bottom: 0;
-    }
-}
-.header-avatar {
-    margin-top: -9px;
-    /*width: 40px;
-    height: 40px;*/
-    margin-right: 5px;
-    float: left;
-}
-.profile-img{
-    width: 100px;
-    height: 100px;
-    margin: 0 auto;
-}
-.profile-img .avatar-initials{
-    line-height: 100px !important;
-}
-#doorbell-email{
-    color: black;
-}
-.song-panel{
-    max-height: 400px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-}
-.song-panel-room{
-    float: right;
-}
-
-#chat-tab, #global-chat-tab {
-    -webkit-transition: background-color 500ms linear;
-    -moz-transition: background-color 500ms linear;
-    -ms-transition: background-color 500ms linear;
-    -o-transition: background-color 500ms linear;
-    transition: background-color 500ms linear;
-}
-
-.unread-messages {
-    background-color: orange;
-}
-
-.profile-action{
-    float: right;
-}
-
-#submit-name{
-    margin-left: 10px;
-}
-
-#submit-username{
-    margin-left: 10px;
-}
-
-.settings-option{
-    margin: 5px 0;
-    font-size: 1.2em;
-}
-
-.settings-input {
-    margin-bottom: 10px;
-}
-
-.disabled {
-    cursor: not-allowed;
-    opacity: 1;
-    background-color: rgba(235, 235, 228, 0.5) !important;
-}
-
-#youtube-playlist-button {
-    background-color: rgba(220, 25, 43, 1);
-    margin-right: auto;
-    margin-left: auto;
-    color: rgba(253, 253, 254, 1);
-    display: block;
-}
-
-.remove-import-song {
-    position: absolute;
-    right: 0px;
-    top: 0px;
-}
-
-.remove-import-song:hover {
-    color: #0e90d2;
-    cursor: pointer;
-}
-
-#current-arrow {
-    color: #0e90d2;
-}
-#import-progress-container {
-    width: 304px;
-    margin-right: auto;
-    margin-left: auto;
-    margin-top: 10px;
-    color: #50a3a2;
-}
-
-#add-youtube-playlist {
-    background-color: green;
-    color: white;
-    margin-top: 10px;
-    margin-left: auto;
-    margin-right: auto;
-    display: block;
-}
-
-.card-content i{
-    line-height: inherit;
-    float: left;
-}
-
-.card-image img{
-    opacity: 1;
-    transition: 0.3s;
-}
-
-.card-image img:hover{
-    opacity: 0.5;
-}
-
-.user-num{
-    font-size: 1.5em;
-}
-
-.scroll-fix{
-    margin-right: 20px;
-}
-
-.profile-card{
-    min-width: 300px;
-    max-height: 500px;
-}
-
-.profile-card-song{
-    overflow-y: scroll;
-}
-
-.text-center{
-    text-align: center;
-}
-
-.avatar{
-  width: auto;
-  height: auto;
-}
-.news-box{
-  width: auto;
-  height: auto;
-}
-
-.lowercase{
-    text-transform: none !important;
-}
-
-.modal-trigger{
-    margin-left: 10px;
-}
-
-.content-box{
-    margin-left: 30px;
-    margin-right: 30px;
-}
-
-.news-title{
-    font-size: 30px;
-}
-
-.news-creator{
-    font-style: italic;
-    font-size: 12px;
-}
-
-.news-postTime{
-    font-style: italic;
-    font-size: 12px;
-}

app/client/stylesheets/app.css

@@ -0,0 +1,48 @@
+body {
+    display: flex;
+    min-height: 100vh;
+    flex-direction: column;
+    background-color: rgb(245, 245, 245);
+}
+
+main {
+    flex: 1 0 auto;
+}
+
+::-webkit-scrollbar{
+    width: 8px;
+}
+
+::-webkit-scrollbar-track{
+    border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    background-color: white;
+}
+
+.brand-logo {
+    margin-left: 10px;
+}
+
+.feedback-btn{
+    margin-left: 10px
+}
+
+.scroll-fix{
+    margin-right: 20px;
+}
+
+.avatar{
+    width: auto;
+    height: auto;
+}
+
+.contact-details{
+    margin-bottom: 5px;
+}
+
+.contact-details .material-icons{
+    float: left;
+}

app/client/templates/feedback.html

@@ -2,7 +2,7 @@
     {{> header}}
     <main>
         <h3 class="black-text thin text-center">Feedback</h3>
-        <a class="waves-effect waves-light btn modal-trigger" href="#modal1">Send New Feedback</a>
+        <a class="waves-effect waves-light btn modal-trigger feedback-btn" href="#modal1">Send New Feedback</a>
         <div class="row">
             {{#each feedback}}
                 <div class="col s12 m4">

app/client/templates/team.html

@@ -28,7 +28,7 @@
                 </div>
             </li>
             <li class="collection-item avatar">
-                <img src="https://avatars2.githubusercontent.com/u/6952369?v=3&s=460" alt="Kris' Profile Picture"
+                <img src="https://avatars2.githubusercontent.com/u/6952369?v=3&s=460" alt="Johand's Profile Picture"
                      class="circle">
                 <span class="title">Johannes Andersen</span>
                 <p>Co Founder, <span title="Chief business officer">CBO</span> & Developer</p>