Revert "css hack to make images wider than the article"

This reverts commit cb5b539ccc4b8e78b474cbf5bdc25baa1fcb6617.

3 files changed, 6 insertions, 18 deletions

diff --git a/blog/site-update-better-css.markdown b/blog/site-update-better-css.markdown
index 1844182..787b6ae 100644
--- a/blog/site-update-better-css.markdown
+++ b/blog/site-update-better-css.markdown
@@ -38,7 +38,6 @@ there is more of a border:
 
 When a conversation has mutiple parts, they will get smaller and look like this:
 
-<div>
 <xeblog-conv name="Numa" mood="delet">Have you ever been far even as decided to
 use even go want to do look more like?</xeblog-conv>
 <xeblog-conv name="Aoi" mood="coffee">What.</xeblog-conv>
@@ -50,7 +49,6 @@ then that he has really been far even as decided to use even go want to do look
 more like. It's just common sense.</xeblog-conv>
 <xeblog-conv name="Aoi" mood="coffee">Is that supposed to be
 English????</xeblog-conv>
-</div>
 
 As you can see, this is a lot more clear and easy to understand. The
 "standalone" snippets are a bit bigger so that the character is emphasized.
diff --git a/lib/xesite_templates/src/lib.rs b/lib/xesite_templates/src/lib.rs
index e3f5704..413aa90 100644
--- a/lib/xesite_templates/src/lib.rs
+++ b/lib/xesite_templates/src/lib.rs
@@ -44,9 +44,9 @@ pub fn picture(path: String) -> Markup {
 pub fn hero(file: String, prompt: Option<String>, ai: Option<String>) -> Markup {
     let ai = ai.unwrap_or("MidJourney".to_string());
     html! {
-        meta property="og:image" content={"https://cdn.xeiaso.net/file/christine-static/hero/" (file) "-smol.png"};
+        meta property="og:image" content={"https://cdn.xeiaso.net/file/christine-static/hero/" (file) "-smol.png"}
         figure.hero style="margin:0" {
-            picture.hero style="margin:0" {
+            picture style="margin:0" {
                 source type="image/avif" srcset={"https://cdn.xeiaso.net/file/christine-static/hero/" (file) ".avif"};
                 source type="image/webp" srcset={"https://cdn.xeiaso.net/file/christine-static/hero/" (file) ".webp"};
                 img style="padding:0" loading="lazy" alt={"hero image " (file)} src={"https://cdn.xeiaso.net/file/christine-static/hero/" (file) "-smol.png"};
diff --git a/static/css/shim.css b/static/css/shim.css
index 8781792..716490a 100644
--- a/static/css/shim.css
+++ b/static/css/shim.css
@@ -83,7 +83,9 @@ article blockquote {
 
 figcaption {
     background-color: #282828;
-    padding: 1rem;
+    margin-left: 1em;
+    margin-right: 1em;
+    margin-bottom: 1em;
 }
 
 .logo {
@@ -108,6 +110,7 @@ figcaption {
 .media {
     background-color: #32302f;
     color: #fbf1c7;
+
     margin: auto;
     max-width: 80ch;
     padding: 2ch;
@@ -120,19 +123,6 @@ figcaption {
     min-height: 16px;
 }
 
-@media screen and (min-width: 992px) {
-    picture.hero > img {
-        left: 72.5%;
-        right: 30%;
-        margin-left: -50vw;
-        margin-right: -50vw;
-        width: 100vw;
-        max-width: 1280px;
-        position: relative;
-        overflow: hidden;
-    }
-}
-
 @media (prefers-color-scheme: light) {
     .warning {
         background-color: #fbf1c7;