revert to old design

2 files changed, 27 insertions, 43 deletions

diff --git a/server/src/routes/ui/node.rs b/server/src/routes/ui/node.rs
index e4d53e6..773daa4 100644
--- a/server/src/routes/ui/node.rs
+++ b/server/src/routes/ui/node.rs
@@ -82,24 +82,37 @@ pub async fn r_library_node_filter<'a>(
 
 markup::define! {
     NodeCard<'a>(id: &'a str, node: &'a NodePublic) {
-        @let cls = format!("node card {}", match node.kind {NodeKind::Channel => "aspect-square", NodeKind::Video => "aspect-thumb", NodeKind::Collection => "aspect-land", _ => "aspect-port"});
+        @let cls = format!("node card poster {}", match node.kind {NodeKind::Channel => "aspect-square", NodeKind::Video => "aspect-thumb", NodeKind::Collection => "aspect-land", _ => "aspect-port"});
         div[class=cls] {
             .poster {
-                .inner {
-                    a[href=uri!(r_library_node(id))] {
-                        img[src=uri!(r_item_assets(id, AssetRole::Poster, Some(1024)))];
+                a[href=uri!(r_library_node(id))] {
+                    img[src=uri!(r_item_assets(id, AssetRole::Poster, Some(1024)))];
+                }
+                @if matches!(node.kind, NodeKind::Collection | NodeKind::Channel) {
+                    .cardhover.open {
+                        a[href=&uri!(r_library_node(id))] { "Open" }
+                        @Props { node }
                     }
-                    div.details {
-                        h3 { @node.title }
+                } else {
+                    .cardhover.item {
+                        a.play[href=&uri!(r_player(id, PlayerConfig::default()))] { "▶" }
                         @Props { node }
-                        p.description { @node.description }
-                        @if matches!(node.kind, NodeKind::Collection | NodeKind::Channel) {
-                            a[href=&uri!(r_library_node(id))] { "Open" }
-                        } else {
-                            a.play[href=&uri!(r_player(id, PlayerConfig::default()))] { "Watch now" }
-                        }
                     }
                 }
+                // .inner {
+                //     a[href=uri!(r_library_node(id))] {
+                //         img[src=uri!(r_item_assets(id, AssetRole::Poster, Some(1024)))];
+                //     }
+                //     div.details {
+                //         h3 { @node.title }
+                //         p.descriptioüwn { @node.description }
+                //         @if matches!(node.kind, NodeKind::Collection | NodeKind::Channel) {
+                //             a[href=&uri!(r_library_node(id))] { "Open" }
+                //         } else {
+                //             a.play[href=&uri!(r_player(id, PlayerConfig::default()))] { "Watch now" }
+                //         }
+                //     }
+                // }
             }
             div.title {
                 a[href=uri!(r_library_node(id))] {
diff --git a/web/nodecard.css b/web/nodecard.css
index fb1a9ff..d32d5f4 100644
--- a/web/nodecard.css
+++ b/web/nodecard.css
@@ -40,13 +40,6 @@
 .node.card .poster,
 .node.card .poster img {
     height: var(--card-size);
-    transition-property: height;
-    transition-duration: 0.2s;
-    transition-timing-function: ease;
-    /* transition-delay: 0.2s; */
-}
-.node.card:hover .poster img {
-    height: calc(var(--card-size) + 10em);
 }
 .node.card.aspect-port {
     width: calc(var(--card-size) / var(--port-poster-aspect));
@@ -71,27 +64,6 @@
     text-align: center;
 }
 
-.node.card .inner {
-    transition-property: margin, padding;
-    transition-duration: 0.2s, 0.2s;
-    transition-timing-function: ease, ease;
-    /* transition-delay: 0.2s, 0.2s; */
-}
-.node.card:hover .inner {
-    background-color: rgba(0, 0, 0, 0.76);
-    backdrop-filter: blur(10px);
-    border-radius: 1em;
-    padding: 1.5em;
-    margin: -5em;
-}
-.node.card:not(:hover) .details {
-    display: none;
-}
-.node.card:hover .title {
-    display: none;
-}
-
-/* 
 .node.card .title {
     margin-top: 0.1em;
     text-align: center;
@@ -102,9 +74,8 @@
 }
 .node.card .poster a {
     grid-area: 1 / 1;
-} */
+}
 
-/* 
 .node.card.poster .poster .cardhover.open {
     transition: opacity 0.3s, backdrop-filter 0.3s;
     opacity: 0;
@@ -174,4 +145,4 @@
     position: absolute;
     bottom: 0px;
     left: 0px;
-} */
+}