migrate style to css file

This commit is contained in:
2022-05-25 13:42:36 -05:00
parent bf4aacc680
commit 213bcf92d5
2 changed files with 82 additions and 81 deletions

80
app/static/style.css Normal file
View File

@@ -0,0 +1,80 @@
@font-face {
font-family: "Hellovetica";
src: url("hellovetica.ttf") format("truetype");
}
.dashboard {
font-family: "Helvetica";
height: 699px;
width: 600px;
text-align: left;
font-size: 17px;
}
.panel {
position: relative;
height: 50%;
verical-align: top;
/* height: 250px; */
width: 100%;
}
.panel.top {
height: 35%;
}
.panel.bottom {
height: 65%;
}
.subpanel {
position: relative;
height:100%;
width:48%;
display: inline-block;
text-align: center;
}
.weather-icon {
position: relative;
height: 100%;
width: 100%;
object-fit: scale-down;
}
.week {
text-align: center;
}
.day {
border-style: solid;
display: inline-block;
min-height: 220px;
max-height: 220px;
width: 135px;
vertical-align: top;
margin: 1px;
align-items: center;
text-align: left;
}
.day-title{
background-color: black;
text-align: center;
color: white;
text-transform: uppercase;
font-weight: bold;
}
.event {
margin: 3pt;
background-color: white;
border-style: solid;
border-radius: 5px;
padding: 2px;
}
.daterange {
font-size: smaller;
}

View File

@@ -1,87 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title></title> <title>Dashboard</title>
<style> <link rel="stylesheet" href="static/style.css">
@font-face {
font-family: "Hellovetica";
src: url("hellovetica.ttf") format("truetype");
}
.dashboard {
font-family: "Helvetica";
height: 699px;
width: 600px;
{#border-style: solid;#}
text-align: left;
font-size: 17px;
}
.panel {
position: relative;
height: 50%;
{#border-style: dotted;#}
verical-align: top;
/* height: 250px; */
width: 100%;
}
.panel.top {
height: 35%;
}
.panel.bottom {
height: 65%;
}
.subpanel {
position: relative;
height:100%;
width:48%;
display: inline-block;
text-align: center;
align-items: middle;
}
.weather-icon {
position: relative;
height: 100%;
width: 100%;
object-fit: scale-down;
}
.week {
/* height:100% */
}
.day {
border-style: solid;
display: inline-block;
min-height: 220px;
max-height: 220px;
width: 135px;
vertical-align: top;
margin: 1px;
align-items: center;
}
.day-title{
background-color: black;
text-align: center;
color: white;
text-transform: uppercase;
font-weight: bold;
}
.event {
margin: 3pt;
background-color: white;
border-style: solid;
border-radius: 5px;
}
</style>
</head> </head>
<body> <body>
<div class="dashboard"> <div class="dashboard">