mock removed

Seasoned.Backend/Program.cs

@@ -29,7 +29,6 @@ builder.Services.ConfigureApplicationCookie(options =>
     options.Cookie.HttpOnly = true;
     options.Cookie.SameSite = SameSiteMode.None;
     options.Cookie.SecurePolicy = CookieSecurePolicy.Always;
-    
     options.ExpireTimeSpan = TimeSpan.FromMinutes(30);
     options.SlidingExpiration = true; 
     options.Events.OnRedirectToLogin = context =>

Seasoned.Frontend/app/assets/css/app-theme.css

@@ -227,7 +227,7 @@ html, body {
 }
 
 .save-recipe-btn:hover {
-  background-color: #3b4e1e !important;
+  background-color: #8c4a32 !important;
   color: #f4e4bc !important;
   text-shadow: none !important;
   border-radius: 4px;
@@ -262,6 +262,31 @@ html, body {
   border-radius: 4px;
 }
 
+.share-btn {
+  background-color: #8c4a32 !important;
+  font-family: 'Libre Baskerville', serif !important;
+  color: #f4e4bc !important;
+  text-transform: none !important;
+  letter-spacing: 0;
+  border-radius: 8px !important;
+}
+
+.share-btn:hover {
+  background-color: #3b4e1e !important;
+  color: #f4e4bc !important;
+  text-shadow: none !important;
+  border-radius: 4px;
+}
+
+.share-success-btn {
+  opacity: 1 !important;
+  color: #f4e4bc !important;
+  font-family: 'Libre Baskerville', serif !important;
+  text-transform: none !important;
+  letter-spacing: 0;
+  border-radius: 8px !important;
+}
+
 @media print {
   @page {
     margin: 0 !important;
@@ -283,7 +308,7 @@ html, body {
   .chat-container, .v-app-bar, .no-print, .separator, .v-divider, 
   .recipe-description, button, .v-btn, .drop-zone, .v-card-actions,
   .v-btn--variant-text, .v-btn--variant-elevated,
-  footer, .v-footer, .recipe-actions-row {
+  footer, .v-footer, .recipe-actions-row, .share-btn {
     display: none !important;
     visibility: hidden !important;
     opacity: 0 !important;

Seasoned.Frontend/app/components/RecipeDisplay.vue

@@ -70,6 +70,25 @@
             Saved in Archives
           </template>
         </v-btn>
+
+        <v-btn
+          class="px-12 transition-swing"
+          size="large"
+          elevation="0"
+          :color="hasShared ? '#556b2f' : '#5d4a36'"
+          :class="hasShared ? 'share-success-btn' : 'share-btn'"
+          @click="shareRecipe"
+        >
+          <template v-if="!hasShared">
+            <v-icon icon="mdi-share-variant-outline" class="mr-2"></v-icon>
+            Share Recipe
+          </template>
+          
+          <template v-else>
+            <v-icon icon="mdi-content-save-check-outline" class="mr-2"></v-icon>
+            Link Copied!
+          </template>
+        </v-btn>
       </v-row>
     </div>
   </transition>
@@ -78,8 +97,9 @@
 <script setup>
 import { ref } from 'vue'
 import '@/assets/css/app-theme.css'
+const hasShared =ref(false)
 
-defineProps({
+const props = defineProps({
   recipe: { type: Object, default: null },
   isSaving: { type: Boolean, default: false },
   hasSaved: { type: Boolean, default: false }
@@ -91,5 +111,30 @@ const printRecipe = () => {
   window.print()
 }
 
+const shareRecipe = async () => {
+  const shareData = {
+    title: props.recipe.title,
+    text: `Check out this delicious ${props.recipe.title} recipe!`,
+    url: window.location.href
+  }
 
+  try {
+    if (navigator.share) {
+      await navigator.share(shareData)
+      triggerShareSuccess()
+    } else {
+      await navigator.clipboard.writeText(window.location.href)
+      triggerShareSuccess()
+    }
+  } catch (err) {
+    console.error('Error sharing:', err)
+  }
+}
+
+const triggerShareSuccess = () => {
+  hasShared.value = true
+  setTimeout(() => {
+    hasShared.value = false
+  }, 3000)
+}
 </script>