andreassoteriou

Thank you!!

Hi all, Initially posted this in site design subforum. But I believe it belongs here as the features I am looking for most likely is created with custom css. I am a photographer and would like to have a very clean website. I want a portfolio page, and when i go into one of the projects and scroll down through the images, I want the portfolio landing page to appear again "under" the project page so to speak when i scroll by the footer. Difficult to explain but the below page has the features I am referring to: https://www.maxwoxberg.com/ Any ideas how I would achieve this?

Hi all, I am a photographer and would like to have a very clean website. I want a portfolio page, and when i go into one of the projects and scroll down through the images, I want to portfolio landing page to appear again "under" the project page so to speak when i scroll by the footer. Difficult to explain but the below page has the features I am referring to: https://www.maxwoxberg.com/ Any ideas how I would achieve this?

Hi all! Just wanted to say that problem has been resolved. Seems to only have been an issue with duckduckgo. Chrome and Safari works just fine. Any ideas why this could be? Best, Andreas

Hi all, I have a super annoying issue with my website. When I am on mobile view on one of the subpages, the scrolling is very "choppy" or "jerky". Almost like some parallax effect. I have added custom CSS where gallery images are enlarged on hover. However, I have added code for min media screen (1000px) so this should not impact mobile view. Any ideas what this could be? https://www.andreassoteriou.com/pris-fotograf-i-stockholm

Thank you so much!

thank you so much! the top project in the portfolio now resembles how i would like it, but the other ones seems just black? Is there also a way to make the static overlay thinner? Many thanks for your reply! @media screen and (max-width:991px) { .portfolio-text { opacity: 1 !important; top: unset !important; background-color: rgba(0,0,0,0.7) !important; } .portfolio-overlay { opacity: 1 !important; top: unset !important; } }

yes of course! andreassoteriou.com under subsection "projects". And sorry for late reply!

Hi all, For mobile view on my portfolio page. I want the overlay text to be static, but at the bottom (on top of) the image. Like below: Anyone have suggestion on code here? I have tried to replicate what I have in the gallery above but without success since this is a portfolio (not gallery).

Hi all! It has been resolved. I dont know how really, but deleted a bunch of code and it seems to resolved the issue.

Hi all, On mobile view. I am having issues with blank space between portfolio and header, but it seems that the same issue persist on basically all pages on my website! Why do I get this blank space between first section and header? It is super annoying. I have previously customized the portfolio landing page to just one column with below code: .portfolio-grid-overlay { grid-template-columns: 1fr!important; } .collection-content-wrapper { padding:0!important; } Anyone has an idea how I can tackle this issue?

Hi all, So I have a photography website where I showcase my portfolio, but I also want to have a website where I offer my services. Ideally I want my portfolio website to be rather clean without any offering, promos etc. But at the same time, I am not too fond of the idea to pay for two separate subscriptions either. I came up with a theoretical solution. Is it possible, lets say, to have a "services" selection on my my page header.. And once I enter this subpage, this page would have a different header within my services (portraits, weddings, commercial etc)? What I want to achieve is to have a separate webpage basically for my services offering, but at the same time "in my current website".

Hi again, FYI I resolved the issue. The problem was that I added padding to the icon class without realizing this class was already used by social media icon in header, hence making that part unaligned.

Hi all, I have added a markdown section with custom code in one of the sections in the portrait page of my website: https://www.andreassoteriou.com/get-your-photo-taken As you can see, the head section is out of alignment (and social media icon is off) with the other pages. I know for a fact that the markdown section (below testimorial carousel) is causing this, because when I delete this section. The header looks normal again. I have no clue what this could be, other than perhaps markdown element taking up too much space? But it is not going outside of the width of the page, so I am a bit confused. Anyone has any idea why this could be? If not exactly why, perhaps any idea of something I might be overlooking? Cheers! Password: letstrythisout The codes for the markdown: HTML: <div class="markdown-block"> <div class="portrait"> <i class="icon fa-solid fa-image-portrait"></i> <div class="boxBorderHeading"> **PORTRAITS** </div> <div class="boxBorderText"> My specialization and passion is portrait photgraphy. I have a burning desire to make your visions come to fruitition. </div> </div> <div class="group"> <i class="icon fa-solid fa-user-group"></i> <div class="boxBorderHeading"> **GROUP PHOTOS** </div> <div class="boxBorderText"> Also available to arrange group </div> </div> <div class="portfolio"> <i class="icon fa-regular fa-image"></i> <div class="boxBorderHeading"> **PORTFOLIO** </div> <div class="boxBorderText"> My specialization and passion is portrait photgraphy. I have a burning desire to make your visions come to fruitition. </div> </div> </div> CSS: <style> .markdown-block { display: flex; flex-direction: row; width: 100%; align-items: flex-end; color: black; justify-content: space-evenly; } .portrait, .group, .portfolio { border: black solid 1px; height: 300px; width: 25%; } .portrait:hover { background: black; color: white; } .group:hover { background: black; color: white; } .portfolio:hover { background: black; color: white; } .boxBorderHeading, .boxBorderText { font-size: 1em; } .boxBorderHeading { padding-left: 20px; padding-top: 60px; } .boxBorderText { padding-left: 20px; padding-top: 20px; padding-right: 30px; text-transform: none; } .icon { padding-left: 20px; padding-top: 20px; font-size: 2em; } </style>

Thank you! Actually yes this worked! Many thanks