use solid colours on book entries
[books.alexwlchan.net] / templates / _review_style.css
index 23c41eb..7cea1ed 100644 (file)
@@ -2,25 +2,32 @@
 {% set g = (tint_colors[review_entry.book.cover_image][1] * 255) | int %}
 {% set b = (tint_colors[review_entry.book.cover_image][2] * 255) | int %}
 
+/* See https://stackoverflow.com/a/11615135/1558022 */
 #review_preview_{{ r }}_{{ g }}_{{ b }} {
-  background: rgba({{ r }}, {{ g }}, {{ b }}, 0.05);
   border-color: rgb({{ r }}, {{ g }}, {{ b }});
-}
 
-{% if review_entry.review.rating == 5 %}
-  #review_preview_{{ r }}_{{ g }}_{{ b }}.review_fave {
-    background: rgba({{ r }}, {{ g }}, {{ b }}, 0.2);
-    border-color: rgb({{ r }}, {{ g }}, {{ b }});
+  {% if review_entry.review.rating == 5 %}
+    background: rgb(
+      {{ (r * 0.24 + 0.76 * 255) | int }},
+      {{ (g * 0.24 + 0.76 * 255) | int }},
+      {{ (b * 0.24 + 0.76 * 255) | int }}
+    );
     border-width: 3px;
     margin-left:  -1px;
     margin-right: -1px;
-  }
-{% endif %}
-
-#review_preview_{{ r }}_{{ g }}_{{ b }} a:hover {
-  background: rgba({{ r }}, {{ g }}, {{ b }}, 0.3);
+  {% else %}
+    background: rgb(
+      {{ (r * 0.08 + 0.92 * 255) | int }},
+      {{ (g * 0.08 + 0.92 * 255) | int }},
+      {{ (b * 0.08 + 0.92 * 255) | int }}
+    );
+  {% endif %}
 }
 
-#review_preview_{{ r }}_{{ g }}_{{ b }} .review_preview img {
-  box-shadow: 0px 2.5px 2.5px rgba({{ r }}, {{ g }}, {{ b }}, 0.25);
+#review_preview_{{ r }}_{{ g }}_{{ b }} a:hover {
+  background: rgb(
+    {{ (r * 0.3 + 0.7 * 255) | int }},
+    {{ (g * 0.3 + 0.7 * 255) | int }},
+    {{ (b * 0.3 + 0.7 * 255) | int }}
+  );
 }