Jump to content

pixies1

Member
  • Posts

    45
  • Joined

  • Last visited

Everything posted by pixies1

  1. Site URL: https://type-a-professionals.squarespace.com https://type-a-professionals.squarespace.com password: verbatim Hello experts! I'm using a typewriter effect on my redesigned site and I've gotten it close to the way I want it to look, but I need some help with the finishing touches, please! How do I get the cursor to finish "typing" after the last period and not continue on to the end of the code block? I have the display set to "flex" but the tablet view still cuts off the A and the period. How do I fix that? (It looks fine on mobile.) And while we're at it, if it's possible to make the cursor a little shorter top-to-bottom, I'd love for it to be the same height as the letters. Here's my current code, many thanks in advance! HTML: <div class="typewriter"> <div class="typewriter-text"> <h1> Hi, we're Type A. </h1> </div> </div> CSS: .typewriter { font-family: Rubik, monospace; display: flex; } .typewriter-text { display: flex; overflow: hidden; animation: typing 4s steps(20, end), blink 1s step-end infinite; white-space: nowrap; color: #006373; border-right: 3px solid #bdbdbd; box-sizing: border-box; margin: auto; } @keyframes typing { from { width: 0% } to { width: 100% } } @keyframes blink { from, to { border-color: transparent } 50% { border-color: #bdbdbd; } }
  2. Or if it's easier/cleaner, here's the CSS I added to hide the phone number in my primary navigation header from the mobile navigation menu. This CSS does this correctly, but then it also hides the phone number everywhere else on the site, which I do not want it to do. //hide phone number in mobile nav// @media screen and (max-width: 640px) { [href="tel:+18055008973"]{ display: none; } }
  3. Site URL: https://typeaprofessionals.com Hello Squarespace community! I'm redoing my site using the Brine template (not yet published, current site still visible). I want to add a line that looks like this, but with the phone number as a clickable link: Call or text: 805-500-TYPE I need to do this in a code block rather than adding a phone link the normal way (long story). I have this line of code that makes the colors look right, but I don't know where to put the href=“tel:805-500-8973” to make the number clickable: Call or text: <p1 style="color:#BABC16;">805-500-TYPE</p1> Thank you!
  4. Thank you! Looks much better. Is it possible to have the second column underneath the first column and the fourth column underneath the third column so they read down in alphabetical order?
  5. Yes! My site looks okay on a horizontal tablet view but vertical looks terrible, as you noticed 🙂 If you can instruct me how to fix it, I would be most grateful. Thank you!
  6. @lplabranche, did you try adding this entire code?: //remove underlines from hyperlinks// .sqs-block-html a {background-image:none!important} /* Remove non-background image underline for heading and paragraph links */ h1 a, h2 a, h3 a, h4 a, p a {text-decoration: none!important}
  7. @Anat13 That worked, thank you! I had to keep my current line of code and add yours to remove both underlines: //remove underlines from hyperlinks// .sqs-block-html a {background-image:none!important} /* Remove non-background image underline for heading and paragraph links */ h1 a, h2 a, h3 a, h4 a, p a {text-decoration: none!important} I chatted with Squarespace and they said they weren't aware of any issues or recent changes that would cause the problem and they said I shouldn't use CSS on my site 😒 I'm still wondering what is causing a double underline on my site, but at least I'm able to get rid of it now. Thank you SO much!!
  8. Site URL: https://typeaprofessionals.com Please help!! The first CSS I ever entered on my site was to remove the underlines from all hyperlinks throughout my site: .sqs-block-html a {background-image:none!important} Today I was playing around in a code block to see if I could make the hyperlinked text semi-bold and for some reason now the underlines are back in all of my hyperlinks that are not in a code block (the hyperlinks in code blocks still look correct with no underline). I didn't change anything to the CSS and I deleted that code block that I was playing with, but the underlines are still there. If I delete that CSS above, it actually adds a second underline to all the hyperlinks. Can you please help me fix this?? Thank you!!
  9. Haha, I thought I deleted your placeholder text when I pasted the new URL but now I see that I hadn't 🙃 It looks perfect!! Thank you for the elegant solution!!
  10. Thank you bangank36, I uploaded a green version of the icon and added your CSS, but now the icon disappears on hover instead of turning green. Any ideas?
  11. Site URL: https://typeaprofessionals.com Hello! For my social media icons, I was able to replace Squarespace's generic link icon with a customized Google icon using the code below (and uploading an image of the Google icon). However, I would like the Google icon to hover on the same color as my other social media icons. Does someone know how to add to my code below to make this work? Thank you in advance! ------ //replace link icon with Google icon// .sqs-svg-icon--list a:nth-of-type(2) { svg { display:none; } background-image: url(https://static1.squarespace.com/static/5ec8617eea936a6584ab0cca/t/603c4d56d5c9360a36489e3a/1614564694083/G+icon.png); background-size: 83%; background-repeat: no-repeat;} //social media icons color// //standard color// .sqs-use--icon { fill: #d9d9d6 !important; } //social media icons color on hover// .sqs-svg-icon--wrapper:hover { .sqs-use--icon { fill: #babc16 !important; } }
  12. Thank you, I'll look into plug-ins if adding code to Squarespace to make this adjustment is not possible. Thanks!
  13. Hi there, I’m using a summary carousel block to display testimonials (actually blog posts). I click the right arrow to scroll through the testimonials. When I reach the last one, it stops and does this fast rewind left back to the first one. Is it possible to add code so you can keep clicking the right arrow and it will keep cycling through in a continuous loop? I don’t want it to scroll automatically, I just want the right arrow (or left arrow) to keep cycling through instead of stopping at the end and then fast-rewinding back to the first one. Any help is much appreciated. Thanks!
×
×
  • 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.