First version with 2 songs

1 files changed, 85 insertions, 0 deletions

diff --git a/public/main.css b/public/main.css
new file mode 100644
index 0000000..5f6d450
--- /dev/null
+++ b/public/main.css
@@ -0,0 +1,85 @@
+body {
+    width: fit-content;
+    font-family: sans-serif;
+    margin: 2rem auto;
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+}
+
+/* Index */
+
+.g-Songs {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    margin: 0;
+}
+
+/* Song */
+
+.g-Back {
+    margin-bottom: 0;
+}
+
+.g-Title {
+    margin-top: 0;
+    margin-bottom: 0.5rem;
+    font-size: 150%;
+}
+
+.g-Subtitle {
+    margin-top: 0;
+    margin-bottom: 1.5rem;
+    font-size: 130%;
+}
+
+.g-Author {
+    font-style: italic;
+}
+
+.g-Parts {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+}
+
+.g-Part {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.g-Part h3 {
+    margin: 0;
+    background-color: #f0f0f0;
+    padding: 0 0.25rem;
+    border-radius: 0.25rem;
+    font-size: 110%;
+    font-weight: normal;
+    font-family: monospace;
+    color: #851616;
+    width: fit-content;
+}
+
+.g-Chords {
+    border-collapse: collapse;
+}
+
+.g-Chords td {
+    width: 4rem;
+    text-align: center;
+    border-left: 1px solid black;
+    border-right: 1px solid black;
+    padding: 0.5rem 0;
+}
+
+.g-Lyrics__Paragraph {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+}
+
+.g-Lyrics__Paragraph emph {
+    background-color: #e6e6d2;
+}