m-chrzan.xyz
aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorMarcin Chrzanowski <m@m-chrzan.xyz>2021-09-12 19:57:37 +0200
committerMarcin Chrzanowski <m@m-chrzan.xyz>2021-09-12 19:57:37 +0200
commit04768d5433f3fdade45b18dacf1159177f2f8fa8 (patch)
tree1c524ecb446706693d1d04001959b7e77be25ca7 /src
parent12f960eebb19c25ea358fa5f60f1f3520cb1b85a (diff)
Modify list columns with screen width
Diffstat (limited to 'src')
-rw-r--r--src/index.html.erb2
-rw-r--r--src/style.css15
2 files changed, 14 insertions, 3 deletions
diff --git a/src/index.html.erb b/src/index.html.erb
index 5447ce6..3748018 100644
--- a/src/index.html.erb
+++ b/src/index.html.erb
@@ -1,6 +1,6 @@
Ĺšpiewnik polskiej muzyki tradycyjnej.
-<ul>
+<ul id='songs'>
<%- songs.keys.sort.each do |song_id| -%>
<li>
<a href='<%= path_to (song_html song_id) %>'><%= songs[song_id].title %></a>
diff --git a/src/style.css b/src/style.css
index f6ec3cc..9cde21f 100644
--- a/src/style.css
+++ b/src/style.css
@@ -15,9 +15,20 @@ a:hover {
color: #55f;
}
-ul {
+#songs {
list-style-type: '';
- column-count: 3;
+}
+
+@media (min-width: 55em) {
+ #songs {
+ column-count: 2 ;
+ }
+}
+
+@media (min-width: 100em) {
+ #songs {
+ column-count: 3 ;
+ }
}
li {