Jump to content


  • Posts

  • Joined

  • Last visited

andreassoteriou's Achievements

  1. 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
  2. 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
  3. 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; } }
  4. yes of course! andreassoteriou.com under subsection "projects". And sorry for late reply!
  5. 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).
  6. Hi all! It has been resolved. I dont know how really, but deleted a bunch of code and it seems to resolved the issue.
  7. 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?
  8. 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".
  9. 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.
  10. 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>
  11. Should mention. Link: andreassoteriou.com/projects password: letstrythisout
  12. Hello all, I want to add the caption on my gallery as a transparent strip on the bottom of the image when viewing on mobile. I have used the same code as in the desktop view (>640px) but changed the following: - Height 10% - Position as flex-end (does seem to end up on the top instead??) Ideally I want the caption to be at the bottom of each image, and I do not want a hover effect either. It should be there permanently so to speak, anyone know what I am doing wrong here?Currently working from below code: @media only screen and (max-width:640px) { .gallery-grid .gallery-caption { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.4); // overlay color height: 10%; padding: 0; opacity: 0; pointer-events: none; } .gallery-grid .gallery-caption-wrapper { display: flex; align-items: flex-end; // center vertically justify-content: center; // center horizontally } .gallery-grid .gallery-caption-content { font-size: 1.2rem !important; // caption font size color: white; //caption font color padding: 1vw; // padding around the caption text-transform: none !important; } .gallery-grid-item { position: relative; } .gallery-grid-item:hover .gallery-caption { opacity: 1; } .gallery-caption-grid-simple { transition-delay: 0ms; max-width: unset; } }
  13. Hi all, So I am having an issue. I recently changed the font size in the nav menu for mobile view, and it looks good. But when I close the menu by clicking on the hamburger again, the old font size briefly pops up. Anyone know a workaround on this? Question no 2: my hamburger is currently black on most sites, is it a way to make it turn white as soon as my black background menu opens up? As of now, I am not able to see the black cross against the black background on the menu. password: letstrythisout
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.