Mercurial > web
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> |
