💄 Fix display on Samsung Email app
[rhynodge.git] / src / main / kotlin / net / pterodactylus / rhynodge / filters / webpages / savoy / MovieState.kt
index 4ee0fd8..d434ac5 100644 (file)
@@ -14,6 +14,7 @@ import kotlinx.html.section
 import kotlinx.html.style
 import kotlinx.html.title
 import kotlinx.html.ul
+import kotlinx.html.unsafe
 import net.pterodactylus.rhynodge.Reaction
 import net.pterodactylus.rhynodge.states.AbstractState
 import java.time.LocalDateTime
@@ -32,25 +33,27 @@ class MovieState(@JsonProperty val movies: Collection<Movie>, val newMovies: Col
                head {
                        title { +"Savoy Programme" }
                        style("text/css") {
-                               +"html { font-family: 'Recursive Sans Linear Static', Roboto, serif; }"
-                               +"section.new-movies > .label { font-family: Impact, sans-serif; background-color: black; padding: 0.5ex; font-size: 200%; color: #ffffee; font-weight: bold; }"
-                               +"section.new-movies ul { padding: 0; margin: 0; }"
-                               +"section.new-movies li.movie { list-style: none; width: 250px; height: 353px; display: inline-block; position: relative; margin: 1ex 1ex 1ex 0ex; }"
-                               +"section.new-movies li.movie img { width: 100%; height: 100%; display: block; position: absolute; z-index: -1; }"
-                               +"section.new-movies li.movie .text { color: white; text-shadow: 2px 2px black; font-weight: bold; font-size: 150%; display: flex; flex-direction: column; justify-content: end; width: 100%; height: 100%; }"
-                               +"section.new-movies li.movie .text .name { padding: 1ex; font-size: 120%; }"
+                               unsafe {
+                                       +"html { font-family: 'Recursive Sans Linear Static', Roboto, serif; }"
+                                       +"section.new-movies > .label { font-family: Impact, sans-serif; background-color: black; padding: 0.5ex; font-size: 200%; color: #ffffee; font-weight: bold; }"
+                                       +"section.new-movies ul { padding: 0; margin: 0; }"
+                                       +"section.new-movies li.movie { list-style: none; display: grid; margin: 1ex 1ex 1ex 0ex; grid-template-columns: 250px auto; }"
+                                       +"section.new-movies li.movie img { grid-area: 1/1/2/2; height: 353px; }"
+                                       +"section.new-movies li.movie .text { color: white; text-shadow: 2px 2px black; font-weight: bold; font-size: 150%; display: flex; flex-direction: column; justify-content: end; grid-area: 1/1/2/2; height: 353px; }"
+                                       +"section.new-movies li.movie .text .name { padding: 1ex; font-size: 120%; }"
+                                       +"section.new-movies li.movie .description { padding: 1ex; }"
 
-                               +"section.daily-programmes ol { padding: 0; }"
-                               +"section.daily-programmes li { list-style: none; }"
-                               +"section.daily-programmes li.day > .label { font-family: Impact, sans-serif; background-color: black; padding: 0.5ex; font-size: 200%; color: #ffffee; font-weight: bold; }"
-                               +"section.daily-programmes li .performances { display: flex; border-top: 1ex; }"
-                               +"section.daily-programmes li.performance { width: 250px; height: 353px; display: inline-block; margin: 1ex 1ex 1ex 0ex; position: relative; }"
-                               +"section.daily-programmes li.performance a { width: 100%; height: 100%; display: block; text-decoration: none; }"
-                               +"section.daily-programmes li.performance a img { width: 100%; height: 100%; display: block; position: absolute; z-index: -1; }"
-                               +"section.daily-programmes li.performance a .text { color: white; text-shadow: 2px 2px black; font-weight: bold; font-size: 150%; width: 100%; height: 100%; }"
-                               +"section.daily-programmes li.performance a .text .time { padding: 1ex; text-align: right; }"
-                               +"section.daily-programmes li.performance a .text .type { padding: 0ex 1ex 1ex 1ex; text-align: right; }"
-                               +"section.daily-programmes li.performance a .text .name { padding: 1ex; font-size: 120%; bottom: 0px; position: absolute; }"
+                                       +"section.daily-programmes ol { padding: 0; }"
+                                       +"section.daily-programmes li { list-style: none; }"
+                                       +"section.daily-programmes li.day > .label { font-family: Impact, sans-serif; background-color: black; padding: 0.5ex; font-size: 200%; color: #ffffee; font-weight: bold; }"
+                                       +"section.daily-programmes li .performances { border-top: 1ex; }"
+                                       +"section.daily-programmes li.performance { display: inline-block; margin: 1ex 1ex 1ex 0ex; }"
+                                       +"section.daily-programmes li.performance a { text-decoration: none; color: white; text-shadow: 2px 2px black; font-weight: bold; font-size: 150%; display: grid; width: 250px; height: 353px; grid-template-rows: 0fr 0fr 1fr 0fr; grid-template-columns: 250px; }"
+                                       +"section.daily-programmes li.performance a img { grid-area: 1/1/5/1; z-index: -1; width: 100%; height: 100%; }"
+                                       +"section.daily-programmes li.performance a .time { grid-area: 1/1/2/1; padding: 1ex 1ex 0ex 1ex; text-align: right; }"
+                                       +"section.daily-programmes li.performance a .type { grid-area: 2/1/3/1; padding: 0ex 1ex 1ex 1ex; text-align: right; }"
+                                       +"section.daily-programmes li.performance a .name { grid-area: 4/1/5/1; padding: 1ex; font-size: 120%; }"
+                               }
                        }
                }
                body {
@@ -68,6 +71,9 @@ class MovieState(@JsonProperty val movies: Collection<Movie>, val newMovies: Col
                                                                                +(movie.name)
                                                                        }
                                                                }
+                                                               div("description") {
+                                                                       +movie.description
+                                                               }
                                                        }
                                                }
                                        }
@@ -77,7 +83,7 @@ class MovieState(@JsonProperty val movies: Collection<Movie>, val newMovies: Col
                        section("daily-programmes") {
 
                                ol("days") {
-                                       movies.flatMap { it.performances.map(Performance::getTime).map(LocalDateTime::toLocalDate) }.distinct().sorted().forEach { date ->
+                                       movies.flatMap { it.performances.map(Performance::time).map(LocalDateTime::toLocalDate) }.distinct().sorted().forEach { date ->
                                                li("day") {
                                                        attributes += "data-date" to "%tY-%<tm-%<td".format(date)
                                                        div("label") {
@@ -92,16 +98,14 @@ class MovieState(@JsonProperty val movies: Collection<Movie>, val newMovies: Col
                                                                                li("performance") {
                                                                                        a(href = performance.link) {
                                                                                                img(src = movie.imageUrl)
-                                                                                               div("text") {
-                                                                                                       div("time") {
-                                                                                                               +("%tH:%<tM".format(performance.time))
-                                                                                                       }
-                                                                                                       div("type") {
-                                                                                                               +performance.type
-                                                                                                       }
-                                                                                                       div("name") {
-                                                                                                               +(movie.name)
-                                                                                                       }
+                                                                                               div("time") {
+                                                                                                       +("%tH:%<tM".format(performance.time))
+                                                                                               }
+                                                                                               div("type") {
+                                                                                                       +performance.type
+                                                                                               }
+                                                                                               div("name") {
+                                                                                                       +(movie.name)
                                                                                                }
                                                                                        }
                                                                                }
@@ -118,6 +122,6 @@ class MovieState(@JsonProperty val movies: Collection<Movie>, val newMovies: Col
        override fun triggered() = newMovies.isNotEmpty() || triggered
 
        private val earliestMovie = movies.minByOrNull { it.earliestPerformance ?: LocalDateTime.MAX }
-       private val Movie.earliestPerformance: LocalDateTime? get() = performances.minOfOrNull(Performance::getTime)
+       private val Movie.earliestPerformance: LocalDateTime? get() = performances.minOfOrNull(Performance::time)
 
 }