Update snippet html & css for consistency between edit and show

Author: rossta

app/javascript/css/components/snippet.css

@@ -1,5 +1,5 @@
 .snippet {
-  filter: drop-shadow(0 0 0.75rem var(--joy-color-50));
+  filter: drop-shadow(0.25rem 0.5rem 0.75rem var(--joy-color-500));
   width: fit-content;
   max-width: var(--grid-max-width) - (2 * var(--grid-gutter));
 
@@ -9,10 +9,20 @@
     padding-bottom: var(--space-m);
     padding-inline-start: var(--space-m);
   }
+
+  & .clipboard-copy-container {
+    position: absolute;
+    right: 0px;
+    display: none;
+  }
+
+  &:hover .clipboard-copy-container {
+    display: block;
+  }
 }
 
 .snippet-background {
-  background-color: var(--joy-color-200);
+  background: linear-gradient(var(--joy-color-300), var(--joy-color-200));
   padding: var(--space-l);
   width: fit-content;
   aspect-ratio: 2 / 1;

app/views/components/code_block/snippet.rb

@@ -13,7 +13,7 @@ def initialize(snippet, screenshot: false, **options)
 
   def view_template
     div(class: "snippet-background", **options) do
-      render CodeBlock::Container.new(language: language) do
+      render CodeBlock::Container.new(language: language, class: "snippet") do
         render CodeBlock::Header.new { title_content } if title_content.present?
 
         render CodeBlock::Body.new do

app/views/share/snippets/form.rb

@@ -15,7 +15,7 @@ def initialize(snippet)
 
   def view_template
     turbo_stream.update "flash", partial: "application/flash"
-    div(class: "section-content") do
+    div do
       form_with(
         model: [:share, snippet],
         class: "section-content",