Added GitHub SVG

frontend/build/assets/social/github.svg

@@ -0,0 +1,47 @@
+<svg width="245" height="240" xmlns="http://www.w3.org/2000/svg">
+ <metadata id="metadata3362">image/svg+xml</metadata>
+
+ <g>
+  <title>background</title>
+  <rect fill="none" id="canvas_background" height="402" width="582" y="-1" x="-1"/>
+ </g>
+ <g>
+  <title>Layer 1</title>
+  <g id="svg_86">
+   <metadata fill="#4a4a4a" transform="matrix(1.1862952709197998,0,0,1.1862952709197998,27.944357648753794,19.726211432238415) " id="svg_85">image/svg+xml</metadata>
+   <defs fill="#4a4a4a">
+    <clipPath fill="#4a4a4a" clipPathUnits="userSpaceOnUse" id="svg_83">
+     <path fill="#4a4a4a" d="m0,551.986l530.973,0l0,-551.986l-530.973,0l0,551.986z" id="svg_84"/>
+    </clipPath>
+   </defs>
+   <g transform="matrix(1.1862952709197998,0,0,1.1862952709197998,27.944357648753794,19.726211432238415) " id="svg_66">
+    <title fill="#4a4a4a">Layer 1</title>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_81">
+     <path fill="#4a4a4a" fill-rule="evenodd" d="m60.38802,551.98602c-33.347,0 -60.388,-27.035 -60.388,-60.388c0,-26.68 17.303,-49.316 41.297,-57.301c3.018,-0.559 4.126,1.31 4.126,2.905c0,1.439 -0.056,6.197 -0.082,11.243c-16.8,-3.653 -20.345,7.125 -20.345,7.125c-2.747,6.979 -6.705,8.836 -6.705,8.836c-5.479,3.748 0.413,3.671 0.413,3.671c6.064,-0.426 9.257,-6.224 9.257,-6.224c5.386,-9.231 14.127,-6.562 17.573,-5.019c0.543,3.902 2.107,6.567 3.834,8.075c-13.413,1.526 -27.513,6.705 -27.513,29.844c0,6.592 2.359,11.98 6.222,16.209c-0.627,1.521 -2.694,7.663 0.586,15.981c0,0 5.071,1.622 16.61,-6.191c4.817,1.338 9.983,2.009 15.115,2.033c5.132,-0.024 10.302,-0.695 15.128,-2.033c11.526,7.813 16.59,6.191 16.59,6.191c3.287,-8.318 1.22,-14.46 0.593,-15.981c3.872,-4.229 6.214,-9.617 6.214,-16.209c0,-23.195 -14.127,-28.301 -27.574,-29.796c2.166,-1.874 4.096,-5.549 4.096,-11.183c0,-8.08 -0.069,-14.583 -0.069,-16.572c0,-1.608 1.086,-3.49 4.147,-2.898c23.982,7.994 41.263,30.622 41.263,57.294c0,33.353 -27.037,60.388 -60.388,60.388" id="svg_82"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_79">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m22.87242,465.28284c-0.133,-0.301 -0.605,-0.391 -1.035,-0.185c-0.439,0.198 -0.684,0.607 -0.542,0.908c0.13,0.308 0.602,0.394 1.04,0.188c0.438,-0.197 0.688,-0.61 0.537,-0.911" id="svg_80"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_77">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m25.31871,462.55432c-0.288,-0.267 -0.852,-0.143 -1.233,0.279c-0.396,0.421 -0.469,0.985 -0.177,1.255c0.297,0.267 0.843,0.142 1.238,-0.279c0.396,-0.426 0.473,-0.984 0.172,-1.255" id="svg_78"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_75">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m27.69963,459.07684c-0.37,-0.258 -0.976,-0.017 -1.35,0.52c-0.37,0.538 -0.37,1.182 0.009,1.44c0.374,0.258 0.971,0.025 1.35,-0.507c0.369,-0.546 0.369,-1.19 -0.009,-1.453" id="svg_76"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_73">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m30.96132,455.71643c-0.331,-0.365 -1.036,-0.267 -1.552,0.232c-0.528,0.486 -0.675,1.177 -0.344,1.542c0.336,0.366 1.045,0.263 1.565,-0.231c0.524,-0.486 0.683,-1.182 0.331,-1.543" id="svg_74"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_71">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m35.46132,453.76535c-0.147,-0.473 -0.825,-0.687 -1.509,-0.486c-0.683,0.207 -1.13,0.76 -0.992,1.238c0.142,0.476 0.824,0.7 1.513,0.485c0.682,-0.206 1.13,-0.756 0.988,-1.237" id="svg_72"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_69">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m40.40373,453.40393c0.017,-0.498 -0.563,-0.911 -1.281,-0.92c-0.722,-0.016 -1.307,0.387 -1.315,0.877c0,0.503 0.568,0.911 1.289,0.924c0.718,0.014 1.307,-0.387 1.307,-0.881" id="svg_70"/>
+    </g>
+    <g transform="matrix(1.3333333,0,0,-1.3333333,0,735.98133) " id="svg_67">
+     <path fill="#4a4a4a" fill-rule="nonzero" d="m45.00234,454.18625c0.086,-0.485 -0.413,-0.984 -1.126,-1.117c-0.701,-0.129 -1.35,0.172 -1.439,0.653c-0.087,0.498 0.42,0.997 1.121,1.126c0.714,0.124 1.353,-0.168 1.444,-0.662" id="svg_68"/>
+    </g>
+   </g>
+  </g>
+  <g id="svg_22"/>
+ </g>
+</svg>

frontend/components/MainFooter.vue

@@ -7,16 +7,16 @@
 				</p>
 				<p>
 					<a class='icon' href='https://github.com/Musare/MusareNode' title='GitHub Repository'>
-						<i class='fa fa-github'></i>
+						<img src='/assets/social/github.svg'/>
 					</a>
-					<a class='icon' href='https://twitter.com/MusareMusic' title='Twitter Account'>
+					<a class='icon' href='https://twitter.com/MusareApp' title='Twitter Account'>
 						<i class='fa fa-twitter'></i>
 					</a>
 					<a class='icon' href='https://www.facebook.com/MusareMusic/' title='Facebook Page'>
 						<i class='fa fa-facebook'></i>
 					</a>
 					<a class='icon' href='https://discord.gg/Y5NxYGP' title='Discord Server'>
-						<img src='/assets/discord.svg'/>
+						<img src='/assets/social/discord.svg'/>
 					</a>
 				</p>
 			</div>

frontend/components/Modals/Login.vue

@@ -21,7 +21,9 @@
 			<footer class='modal-card-foot'>
 				<a class='button is-primary' @click='submitModal("login")'>Submit</a>
 				<a class='button is-github' :href='$parent.serverDomain + "/auth/github/authorize"'>
-					<i class='fa fa-github' aria-hidden='true'></i>
+					<div class='icon'>
+						<img class='invert' src='/assets/social/github.svg'/>
+					</div>
 					&nbsp;&nbsp;Login with GitHub
 				</a>
 			</footer>
@@ -53,4 +55,6 @@
 		background-color: #333 !important;
 		color: #fff !important;
 	}
+
+	.invert { filter: brightness(5); }
 </style>

frontend/components/Modals/Register.vue

@@ -26,7 +26,9 @@
 			<footer class='modal-card-foot'>
 				<a class='button is-primary' @click='submitModal()'>Submit</a>
 				<a class='button is-github' :href='$parent.serverDomain + "/auth/github/authorize"'>
-					<i class='fa fa-github' aria-hidden='true'></i>
+					<div class='icon'>
+						<img class='invert' src='/assets/social/github.svg'/>
+					</div>
 					&nbsp;&nbsp;Register with GitHub
 				</a>
 			</footer>
@@ -74,4 +76,6 @@
 		background-color: #333 !important;
 		color: #fff !important;
 	}
+
+	.invert { filter: brightness(5); }
 </style>