OceanSlim/dwm-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added basic styling to skills html

Browse Source
This commit is contained in:
Chris kerr 2024-02-11 14:11:14 -05:00
parent fb1257a009
commit 9eed5e3d11
2 changed files with 69 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
static/style/output.css
View File

@ -552,6 +552,10 @@ video {
margin: 0.5rem;
}
.m-4 {
margin: 1rem;
}
.mx-auto {
margin-left: auto;
margin-right: auto;
@ -573,6 +577,10 @@ video {
margin-top: 1rem;
}
.mb-4 {
margin-bottom: 1rem;
}
.block {
display: block;
}
@ -581,6 +589,10 @@ video {
display: flex;
}
.table {
display: table;
}
.grid {
display: grid;
}
@ -590,6 +602,14 @@ video {
width: fit-content;
}
.w-full {
width: 100%;
}
.border-collapse {
border-collapse: collapse;
}
.cursor-pointer {
cursor: pointer;
}
@ -602,10 +622,6 @@ video {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.content-center {
align-content: center;
}
.items-center {
align-items: center;
}
@ -622,6 +638,10 @@ video {
border-radius: 0.375rem;
}
.border {
border-width: 1px;
}
.border-2 {
border-width: 2px;
}
@ -636,11 +656,6 @@ video {
background-color: rgb(15 23 42 / var(--tw-bg-opacity));
}
.bg-gray-800 {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}
.bg-neutral-800 {
--tw-bg-opacity: 1;
background-color: rgb(38 38 38 / var(--tw-bg-opacity));
@ -650,6 +665,20 @@ video {
padding: 0.5rem;
}
.p-4 {
padding: 1rem;
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem;
}
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.pl-2 {
padding-left: 0.5rem;
}
@ -681,6 +710,11 @@ video {
line-height: 1.75rem;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.font-black {
font-weight: 900;
}

42
templates/skills.html
View File

@ -3,23 +3,33 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="/img/favicon.ico" />
<link rel="stylesheet" href="../static/style/output.css" />
<title>Skills Data</title>
</head>
<body>
<h1>Skills Data</h1>
<table border="1">
<tr>
{% for key in csv_data[0].keys() %}
<th>{{ key }}</th>
{% endfor %}
</tr>
{% for row in csv_data %}
<tr>
{% for value in row.values() %}
<td>{{ value }}</td>
{% endfor %}
</tr>
{% endfor %}
</table>
<body
class="flex items-center justify-center p-4 m-4 font-mono text-white bg-neutral-800"
>
<div class="text-center">
<h1 class="text-3xl font-bold mb-4">Skills Data</h1>
<table class="border-collapse border w-full">
<thead>
<tr>
{% for key in csv_data[0].keys() %}
<th class="border py-2 px-4">{{ key }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for row in csv_data %}
<tr>
{% for value in row.values() %}
<td class="border py-2 px-4">{{ value }}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</body>
</html>