comparison music.html @ 21:3c7989047451

Make code prettier and fix a few visual errors
author Paper <mrpapersonic@gmail.com>
date Sun, 12 Dec 2021 17:09:24 -0500
parents 79a7939810c0
children 36783c99e199
comparison
equal deleted inserted replaced
20:79a7939810c0 21:3c7989047451
2 <head> 2 <head>
3 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> 3 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
4 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script> 4 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
5 <title>Music - Paper's website</title> 5 <title>Music - Paper's website</title>
6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
7 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
7 <style> 8 <style>
8 @import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300&display=swap'); 9 @import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300&display=swap');
9 .navbar { 10 .navbar {
10 background: linear-gradient(to bottom, rgba(255,255,255,0.1) 25%, rgba(0,0,0,0) 100%); 11 background: linear-gradient(to bottom, rgba(255,255,255,0.1) 25%, rgba(0,0,0,0) 100%);
11 } 12 }
12 body { 13 body {
14 background-size: cover;
15 background: url("forest.png") no-repeat center center fixed;
16 color: white;
13 font-family: 'Source Sans 3', sans-serif; 17 font-family: 'Source Sans 3', sans-serif;
14 color: white; 18 text-align: center;
15 text-shadow: 5px 0 10px rgba(0, 0, 0, 0.5); 19 text-shadow: 5px 0 10px rgba(0, 0, 0, 0.5);
16 background-image: url("forest.png");
17 text-align: center;
18 } 20 }
19 div.box { 21 div.box {
20 padding: 10px; 22 background-color: rgba(0, 0, 0, 0.7);
23 box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5) inset;
24 color: white;
25 left: 0;
21 margin: 1% auto; 26 margin: 1% auto;
22 max-width: 500px; 27 max-width: 500px;
23 left: 0; 28 padding: 10px;
24 right: 0; 29 right: 0;
25 background-color: rgba(0, 0, 0, 0.7); 30 text-align: center;
26 color: white;
27 box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5) inset;
28 top: 50%; 31 top: 50%;
29 text-align: center;
30 } 32 }
31 a:link, a:visited, a:hover, a:active { 33 a:link, a:visited, a:hover, a:active {
32 color: #ff6600; 34 color: #ff6600;
33 } 35 }
34 </style> 36 </style>