Added static

app.py

@@ -19,8 +19,7 @@ def get_db():
 
 db.init_app(app)
 
-@app.before_first_request
-def create_tables():
+with app.app_context():
     db.create_all()
 
 @app.route('/')

static/albumsheet.css

@@ -0,0 +1,152 @@
+header {
+    height: 8vh;
+    width: 100%;
+    background-color: darkorchid;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+}
+
+header img {
+    height: 100%;
+}
+
+img:hover {
+    transform: scale(1.1);
+    opacity: 1;
+    transition: 0.4s ease;
+}
+
+a {
+    color: white;
+    text-decoration: none;
+    font-style: normal;
+    font-family: Verdana, Geneva, Tahoma, sans-serif;
+}
+
+ul {
+    list-style-type: none;
+    margin: 2%;
+    font-size: 3ch;
+    text-align: center;
+    float: right;
+
+}
+
+
+li {
+    display: inline;
+    margin: 20px;
+}
+
+.round {
+    border-radius: 20px;
+}
+
+a:hover{
+    position: relative;
+    width: 50%;
+}
+
+.middle{
+    transition: .5s ease;
+    opacity: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    text-align: center;
+}
+
+td:hover .text{
+    background-color:rgb(148, 148, 231);
+    object-position: 50%;
+    font-size: 30px;
+    text-align: center;
+    font-family:'Times New Roman', Times, serif;
+}
+
+td:hover .middle{
+    opacity:1;
+    text-align: center;
+}
+a:hover img{
+    opacity: 0.5;
+}
+
+
+body {
+    background-image: url('back.jpg');
+    background-repeat: no-repeat;
+    background-size: cover;
+    color: rgb(88, 132, 170);
+    background-attachment: fixed;
+    margin: 0;
+    padding: 0;
+}
+
+.top {
+    list-style-type: none;
+    margin: 5%;
+    font-size: 3ch;
+    text-align: center;
+    color: burlywood;
+}
+
+.top {
+    width: 120000px;
+}
+
+body {
+    background-image: url(bg.jpg);
+    background-repeat: no-repeat;
+}
+
+.table {
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.special {
+    font-size: 75px;
+    color: aquamarine;
+    font-family: Arial, Helvetica, sans-serif;
+    text-align: center;
+}
+
+.footer {
+    text-align: center;
+    padding: 3px;
+    background-color: pink;
+    color: black;
+    }
+
+
+
+.middle {
+    transition: .5s ease;
+    opacity: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    text-align: center;
+}
+
+.container:hover .middle {
+    opacity: 1;
+}
+
+.text {
+    color: rgb(242, 227, 247);
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-size: 0px;
+    text-align: center;
+}
+
+.container {
+    position: relative;
+    width: 50%;
+}

static/artiststyle.css

@@ -0,0 +1,116 @@
+header {
+    height: 8vh;
+    width: 100%;
+    background-color: darkorchid;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+}
+
+img:hover 
+{
+    transform: scale(1.1);
+    transition: 0.4s ease;
+}
+
+header img {
+    height: 100%;
+}
+
+a {
+    color: white;
+    text-decoration: none;
+    font-style: normal;
+    font-family: Verdana, Geneva, Tahoma, sans-serif;
+}
+
+ul {
+    list-style-type: none;
+    margin: 2%;
+    font-size: 3ch;
+    text-align: center;
+    color: green;
+    float: right;
+
+}
+
+.round {
+    border-radius: 20px;
+}
+
+li {
+    display: inline;
+    margin: 20px;
+}
+
+body {
+    background-repeat: no-repeat;
+    background-size: cover;
+    color: aliceblue;
+    background-attachment: fixed;
+    margin: 0;
+    padding: 0;
+}
+
+.top {
+    list-style-type: none;
+    margin: 5%;
+    font-size: 3ch;
+    text-align: center;
+    color: burlywood;
+}
+
+.top {
+    width: 1200px;
+}
+
+body{
+    background-image: url(bg.jpg);
+    background-repeat: no-repeat;
+}
+
+.special {
+    font-size: 50px;
+    color: aquamarine;
+    font-family: Arial, Helvetica, sans-serif;
+    text-align: center;
+}
+
+.center {
+    margin-left: auto;
+    margin-right: auto;
+    font-size: 30px;
+    border-spacing: 10px 100px;
+}
+
+td.align-left {
+    text-align: left;
+    font-size: 50px;
+}
+
+.middle {
+transition: .5s ease;
+opacity: 0;
+position: absolute;
+top: 50%;
+left: 50%;
+transform: translate(-50%, -50%);
+-ms-transform: translate(-50%, -50%);
+text-align: center;
+}
+
+.container:hover .middle {
+opacity: 1;
+}
+
+.text {
+    color: black;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-size: 25px;
+    text-align: center;
+}
+
+.container {
+position: relative;
+width: 50%;
+}