Intégration de mes livres à mes articles

themes/42/assets/css/aside.css

@@ -18,4 +18,77 @@ aside {
             margin: var(--margin-half);
         }
     }
+}
+
+.oeuvre-panel {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    gap: var(--gap-oeuvre-panel);
+}
+
+.oeuvre-panel__image {
+    margin: 0;
+    flex: 0 0 var(--width-oeuvre-cover);
+}
+
+.oeuvre-panel__image img {
+    display: block;
+    width: 100%;
+    height: auto;
+}
+
+.oeuvre-panel__content {
+    flex: 1 1 auto;
+    display: flex;
+    flex-direction: column;
+    gap: var(--gap-oeuvre-panel);
+}
+
+.oeuvre-panel h2 {
+    margin: 0;
+    font-size: var(--font-size-card-title);
+    color: var(--color-oeuvre-heading);
+}
+
+.oeuvre-panel p {
+    margin: 0;
+    color: var(--color-oeuvre-text);
+}
+
+.oeuvre-panel p+p {
+    margin-top: var(--gap-third);
+}
+
+.oeuvre-panel p:last-of-type {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--gap-third);
+}
+
+.oeuvre-panel p:last-of-type a {
+    display: inline-block;
+    padding: 0.35rem 0.9rem;
+    font-size: 0.95em;
+    text-decoration: none;
+    background: var(--color-oeuvre-link-primary-bg);
+    color: var(--color-oeuvre-link-primary-text);
+    border: 1px solid var(--color-oeuvre-link-primary-border);
+}
+
+.oeuvre-panel p:last-of-type a:hover,
+.oeuvre-panel p:last-of-type a:focus-visible {
+    color: var(--color-oeuvre-link-primary-text);
+    text-decoration: underline;
+}
+
+@media (max-width: 768px) {
+    .oeuvre-panel {
+        flex-direction: column;
+        align-items: stretch;
+    }
+
+    .oeuvre-panel__image {
+        max-width: 220px;
+    }
 }

themes/42/assets/css/variables/structure.css

@@ -49,4 +49,7 @@
     --weather-metric-padding: var(--padding-half);
     --weather-badge-padding: 0.35rem 0.6rem;
     --weather-sources-margin: var(--gap-half);
+
+    --width-oeuvre-cover: 140px;
+    --gap-oeuvre-panel: var(--gap-half);
 }