Jump to content

CarinaG

Circle Member
  • Posts

    4
  • Joined

  • Last visited

Recent Profile Visitors

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

CarinaG's Achievements

Level 2

Level 2 (2/20)

1

Reputation

  1. Site URL: https://apricots-round-erx9.squarespace.com/ Hi, The site URL is https://apricots-round-erx9.squarespace.com/ I added a Burger Menu to desktop. I'd like to have hover states on these items. Underline is fine, but ideally a line that goes from left to right and pushes the hovered text to the right.
  2. Hi 👋 I added the code to a code block in a section on my website. It's not working. It's just showing the actual code.... See attachment of what I want and what is currently happening. Id also like the "Scroll to Discover" to be clickable and it anchors you down to the next section. <div class="scroll-down"></div> <style> .scroll-down { position: absolute; left: 50%; bottom: 10px; display: block; text-align: center; font-size: 20px; z-index: 100; text-decoration: none; text-shadow: 0; width: 13px; height: 13px; border-bottom: 2px solid red; border-right: 2px solid red; z-index: 9; left: 50%; -webkit-transform: translate(-50%, 0%) rotate(45deg); -moz-transform: translate(-50%, 0%) rotate(45deg); transform: translate(-50%, 0%) rotate(45deg); -webkit-animation: fade_move_down 4s ease-in-out infinite; -moz-animation: fade_move_down 4s ease-in-out infinite; animation: fade_move_down 4s ease-in-out infinite; } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -moz-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { transform:translate(0,10px) rotate(45deg); opacity: 0; } } </style>
  3. Hi there!😀 I'm having the same problems. The header does not seem to be affected by the code. My goal is to have a fixed transparent header. Currently, SS has a transparent header that is fixed, but scrolls back with a color of chosen theme color palette. Here is what I tried: - Adding Custom CSS header#header {position: fixed!important;} .header-nav-folder-content { background: transparent!important; } - Then deleted and tried: .tweak-transparent-header:not(.header--menu-open) .header-announcement-bar-wrapper { background: transparent; } - Then deleted and tried: .header { background: transparent!important;} - None of the above seem to have any impact on the design. Site link: https://apricots-round-erx9.squarespace.com/ Please help 🙏 UPDATE: I just figured out an easy solution from a different forum. - Use this code in Custom Css #header { background: rgba(0,0,0,0.5); } - Remove the ".5" and it will be completely transparent. '0.5' will make it 50% transparent which is kinda a nice solution too! Carina K
×
×
  • 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.