Jump to content

caffeineandcopics

Member
  • Posts

    15
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

caffeineandcopics's Achievements

  1. Site URL: https://iris-bugle-4zwc.squarespace.com Hi, Just need to know how to hide a section on mobile. Getting errors when I use this code: @media screen and (max-width:640px) { section[data-section-id=“MY-ID_HERE”] { display: none;} }
  2. @tuanphan The "work" page from my above screenshots. I want the images to be stacked on mobile but remain in a 3 column layout on desktop
  3. Site URL: https://iris-bugle-4zwc.squarespace.com Anybody know how to reduce the footer padding/margin so it lines up with the header on desktop? I've tried a couple different things in CSS and it's not working. https://iris-bugle-4zwc.squarespace.com/config/design/custom-css
  4. Site URL: https://iris-bugle-4zwc.squarespace.com Hi! Needing some help adjusting a mobile app gallery for a clients site. On desktop I have it displaying 3 images per row, on mobile I want it to display 1 per row. Also, I'm wanting the captions to be centred on both mobile and desktop below the images. Here's what I have; any help would be appreciated, I've tried a number of things in css and nothings work so far
  5. @tuanphan - you probably won't be able to see it unless you look really close - but it's on the right side of my desktop hamburger, centered and the text is white. I want it too look like an actual button with a border box and hover - but when I go to change it, it changes all my other links
  6. It's so weird, I tried to apply CSS to my 'a' (links) and it changed all the buttons. Now the 'coffee?' in my menu section is tiny any ideas?
  7. Site URL: https://taranaomi.com/contact Hi there! wanting to get rid of the original hover effect on my lightbox form and replace it with a gradual underline. This is the code I have so far - the underline works but I don't know how to get rid of the black background. I need it to be transparent so I can put a background colour/images. I also need the underline to be brought closer to the "Coffee?" - tried reducing padding but it's not working. Any help would be appreciated! //Lightbox Adjustments // .lightbox-handle { border: none !important; font-family: 'lost-lovers-regular' !important } button.lightbox-handle:before { width: 0%; height: 100%; z-index: 3; content: ''; position: absolute; left: 0; transition: .2s; } button.lightbox-handle:before { border-bottom: 1px solid #000000!important; } button.lightbox-handle:hover:before { transition-delay: .3s; } button.lightbox-handle:hover:before { width: 100% !important; transition: .7s; } button.lightbox-handle:hover { position: relative; transition: 0.5s; padding: 0 10px; cursor: pointer; -webkit-transition: 0.5s; font-style: italic !important; }
  8. Site URL: https://taranaomi.com/home Hi there, Looking to install githubs plugin for locomotive scroll. I tried to install the javascript and css but I'm likely putting it in the wrong places because when I go to edit the CSS properties nothing happens. If anyone has any idea what I need to do here it would be much appreciated. Here's a code pen version: https://codepen.io/dotpot420/pen/MWwWaaQ Github: https://github.com/locomotivemtl/locomotive-scroll End goal is something like this homepage but one image and no letter shuffle to the type centre: https://mathieulevesque.com/en Thanks so much
  9. @tuanphan Yes! I was able, but for some reason my button is weird...do you think you could help? I want the button that says "Coffee?" to have a border box at 1px/solid/black which I set through my site style - but it's not showing up? The button should be centre but I'm also wanting the sizing a bit larger.
  10. @bangank36 I'm hoping to apply the locomotive scroll of the portion of this website to my own portfolio pieces on my "works" page. The only portion I'm interested in is the type and photo scrolling vertically. I've tried to look into Locomotive Scroll and I understand the idea of the JS but I'm just a little confused on how to apply it. I have "Project #" (1-6) set up on my own site, I was going to set up photo's as well because it seems like I need to layer sections but I'm not 100% sure. If anyone can help apply it to my website and maybe explain how this example is set up that would be helpful. Thanks
  11. Site URL: https://taranaomi.com/home Hi! Looking to achieve a split section navigation like the one from this site: https://www.violahillstudio.com I'm interested left and right animation and the closed navigation with button aligned to the right and burger to the left. Any help would be much appreciated.
  12. Site URL: https://taranaomi.com/home Hi! Looking to understand and figure out how to code Locomotive scroll. I want my "Works" page to scroll through my portfolio pieces. The project titles will be links to external pages I have set up already. Here's what I'm hoping for: https://mathieulevesque.com/en Here's a couple of resources I've found online: https://codesandbox.io/s/b0c5t?file=/src/App.js:1092-1100 https://locomotivemtl.github.io/locomotive-scroll/ I've looked at YouTube resources and tried to play around with inspect element to see if I could figure it out but nothings worked so far. My site URL is taranaomi.com - any help would be appreciated, even just setting up the overlapping type and images. Thanks!
  13. Site URL: https://taranaomi.squarespace.com Hi Everyone! I'm wondering if someone could help me out with changing my navigation typeface to a custom typeface. I was able to change to a custom typeface for my h1, h2, h3, p etc. but for some reason can't change my links within the hamburger navigation itself. So far I have this; @font-face { font-family: 'Voyager-Regular'; src: url(https://static1.squarespace.com/static/6015f371cbc71f649dab977e/t/6052b16db706164bacfb8e7a/1616032109736/Voyage-Regular.otf) } h1 { font-family: 'Voyager-Regular';} h2 { font-family: 'Voyager-Regular';} h3 { font-family: 'Voyager-Regular';} h4 { font-family: 'Voyager-Regular';} p { font-family: 'Voyager-Regular';} .header-nav { display: none; } .header-burger { display: flex; } .header--menu-open .header-menu { opacity: 1; visibility: visible; } I've attached screenshots so you can see what I'm referring to. Headings work great on my other pages, it's just the links within the hamburger menu that won't change for both mobile and desktop.
×
×
  • 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.