diff --git a/frontend/rabbi_gerzi/cypress/e2e/home.cy.ts b/frontend/rabbi_gerzi/cypress/e2e/home.cy.ts index 2e9e197..3a29014 100644 --- a/frontend/rabbi_gerzi/cypress/e2e/home.cy.ts +++ b/frontend/rabbi_gerzi/cypress/e2e/home.cy.ts @@ -42,53 +42,6 @@ describe('homepage hero', () => { .and('have.attr', 'alt') .and('match', /Rabbi Yehoshua Gerzi/i) }) - - it('lets the rabbi portrait rise above the circular frame', () => { - cy.get('[data-cy="hero-portrait"]').then( - (portraitElements) => { - const portraitImage = portraitElements[0] - const frameElement = portraitImage.parentElement - - if (frameElement === null) { - throw new Error('Portrait frame is missing') - } - - const frameStyle = getComputedStyle(frameElement) - - expect(frameStyle.overflowX).to.equal('visible') - expect(frameStyle.overflowY).to.equal('visible') - expect(portraitImage.getBoundingClientRect().top).to.be.lessThan( - frameElement.getBoundingClientRect().top, - ) - }, - ) - }) - - it('extends the circular background to the portrait base edges', () => { - cy.get('[data-cy="hero-portrait"]').then( - (portraitElements) => { - const portraitImage = portraitElements[0] - const frameElement = portraitImage.parentElement - - if (frameElement === null) { - throw new Error('Portrait frame is missing') - } - - const portraitBounds = portraitImage.getBoundingClientRect() - const frameBounds = frameElement.getBoundingClientRect() - const backgroundStyle = getComputedStyle(frameElement, '::before') - const backgroundWidth = Number.parseFloat(backgroundStyle.width) - const backgroundLeft = - frameBounds.left + (frameBounds.width - backgroundWidth) / 2 - const backgroundRight = backgroundLeft + backgroundWidth - - expect(backgroundStyle.content).to.not.equal('none') - expect(backgroundWidth).to.be.closeTo(portraitBounds.width, 1) - expect(backgroundLeft).to.be.closeTo(portraitBounds.left, 1) - expect(backgroundRight).to.be.closeTo(portraitBounds.right, 1) - }, - ) - }) }) describe('homepage discover path section', () => { diff --git a/frontend/rabbi_gerzi/src/views/HomePage.vue b/frontend/rabbi_gerzi/src/views/HomePage.vue index 9afeea6..d202d11 100644 --- a/frontend/rabbi_gerzi/src/views/HomePage.vue +++ b/frontend/rabbi_gerzi/src/views/HomePage.vue @@ -468,34 +468,17 @@ const projects: Project[] = [ } .hero__portrait-frame { - --portrait-frame-size: clamp(180px, 22vw, 320px); - - width: var(--portrait-frame-size); - height: var(--portrait-frame-size); - position: relative; + width: clamp(180px, 22vw, 320px); + aspect-ratio: 1; border-radius: 50%; - overflow: visible; + background: var(--color-slate); + overflow: hidden; display: flex; align-items: flex-end; justify-content: center; } -.hero__portrait-frame::before { - content: ''; - position: absolute; - left: 50%; - bottom: 0; - z-index: 0; - width: 110%; - aspect-ratio: 1; - border-radius: 50%; - background: var(--color-slate); - transform: translateX(-50%); -} - .hero__portrait { - position: relative; - z-index: 1; width: 110%; height: auto; display: block;