Merge pull request #14 from JMCulhane/revert-13-MobileOptimization

Revert "Mobile optimization"

Author: JMCulhane

chelle-fulk-main/src/components/recordings/RecordingContainer.tsx

@@ -36,7 +36,6 @@ const RecordingsContent: React.FC<Props> = ({ recording }) => {
           target="_blank"
           rel="noopener noreferrer"
           className="inline-block bg-yellow-400/80 rounded-md px-4 py-2 text-white text-lg hover:bg-yellow-400 transition-colors"
-          style={{ cursor: 'pointer', pointerEvents: 'auto', zIndex: 10 }}
         >
           Buy Album
         </a>

chelle-fulk-main/src/components/recordings/RecordingContent.tsx

@@ -12,15 +12,12 @@
   flex-shrink: 0;
 }
 
-.content-container {
-  position: relative;
-  width: clamp(150px, 20vw, 400px);
-  aspect-ratio: 1;
-  flex-shrink: 0;
+.shift-left {
+  transform: translate(-5%, 20%);
 }
 
 .shift-right {
-  transform: translateX(5%);
+  transform: translate(5%, 20%);
 }
 
 

chelle-fulk-main/src/components/styling/HugContainer.scss

@@ -1,6 +1,7 @@
 import React from 'react';
 import './HugContainer.scss';
 import ScaleOnScroll from './ScaleOnScroll';
+import { MusicalNoteIcon } from '@heroicons/react/24/outline';
 import { RecordingDTO } from '../../models/RecordingsDTO';
 import AudioSamples from '../recordings/AudioSamples';
 import RecordingContent from '../recordings/RecordingContent';
@@ -32,8 +33,6 @@ const LeftHuggingContainer: React.FC<Props> = ({ image, knot, recording, alignRi
           <div className="flex flex-row gap-8" style={samplesStyle}>
             <RecordingContent recording={recording} />
 
-          </div>
-          <div>
             {recording.samples.length > 0 && (
               <div className="mt-2 samples-frame">
                 <p className="text-lg font-fell text-yellow-400 mb-2">Listen to samples:</p>

chelle-fulk-main/src/components/styling/LeftHuggingContainer.tsx

@@ -16,24 +16,23 @@ type Props = {
 const RightHuggingContainer: React.FC<Props> = ({ image, knot, recording, deleteButton }) => {
   return (
     <ScaleOnScroll>
-      <div className="shift-right">
-        <div className="flex flex-row items-center gap-8">
+      <div className="shift-left">
+        <div className="flex flex-row-reverse items-center gap-8">
+          <div className="relative knot-frame">
+            {deleteButton}
+            <img src={knot} alt="Knotwork" className="knot-img" draggable={false} />
+            <img src={image} alt={recording.title} className="right-nested-img" />
+          </div>
+
           <div className="flex flex-row gap-8">
             {recording.samples.length > 0 && (
               <div className="mt-2 samples-frame">
                 <p className="text-lg font-fell text-yellow-400 mb-2">Listen to samples:</p>
                 <AudioSamples samples={recording.samples} />
               </div>
             )}
-          </div>
-          <div>
             <RecordingContent recording={recording} />
           </div>
-          <div className="relative knot-frame">
-            {deleteButton}
-            <img src={knot} alt="Knotwork" className="knot-img" draggable={false} />
-            <img src={image} alt={recording.title} className="right-nested-img" />
-          </div>
         </div>
       </div>
     </ScaleOnScroll>

chelle-fulk-main/src/components/styling/RightHuggingContainer.tsx

@@ -11,10 +11,10 @@ export const getRecordings = async (): Promise<RecordingDTO[]> => {
       image: "/assets/recordings/images/2DoBeatles.png",
       title: "2 Do Beatles",
   // yearPublished removed
-      description: "2 Do Beatles is a creative tribute to the legendary band, reimagining classic Beatles songs with unique instrumental arrangements for violin and friends. A fresh take on timeless hits for fans old and new.",
+      description: "2 Do Beatles is a creative tribute to the legendary band, reimagining classic Beatles songs with unique arrangements for violin and friends. A fresh take on timeless hits for fans old and new.",
       performers: ["Chelle Fulk", "Robert Raines"],
       trackCount: 9,
-      link: "https://chelle-fulk.square.site/product/2-do-beatles-by-chelle-fulk-and-robert-raines/1?cp=true&sa=true&sbp=false&q=false",
+      link: "https://chellefulk.square.site/product/2-do-beatles/20?cp=true&sa=false&sbp=false&q=false&category_id=2",
       samples: [
         {
           trackName: "The Fool On the Hill",
@@ -53,7 +53,7 @@ export const getRecordings = async (): Promise<RecordingDTO[]> => {
       description: "Keltish brings together the best of Celtic and folk traditions, featuring lively fiddle tunes, heartfelt ballads, and a fusion of world music influences. A musical journey across the British Isles and beyond.",
       performers: ["Chelle Fulk"],
       trackCount: 12,
-      link: "https://chelle-fulk.square.site/product/keltish-by-keltish/4?cp=true&sa=true&sbp=false&q=false",
+      link: "https://chellefulk.square.site/product/keltish/1?cp=true&sa=false&sbp=false&q=false&category_id=2",
       samples: [
         {
           trackName: "Dublin Lullaby",
@@ -80,7 +80,7 @@ export const getRecordings = async (): Promise<RecordingDTO[]> => {
       description: "Island Time is a collection of original and classic tunes with a tropical flair, blending violin, steel drums, and guitar for a relaxing, beachy vibe. Perfect for unwinding or bringing the island spirit to any occasion.",
       performers: ["Chelle Fulk", "Pete Kudelich"],
       trackCount: 10,
-      link: "https://chelle-fulk.square.site/product/island-time-by-chelle-fulk-and-peter-kudelich/5?cp=true&sa=true&sbp=false&q=false",
+      link: "https://chellefulk.square.site/product/island-time/19?cp=true&sa=false&sbp=false&q=false&category_id=2",
         samples: [
           { trackName: "Yell Yell", audioUrl: "/assets/recordings/islandTime/01 Yell Yell.mp3" },
           { trackName: "Carolina in the Morning", audioUrl: "/assets/recordings/islandTime/02 Carolina in the Morning.mp3" },