-
Posts
20 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by handyandmarvelous
-
7.1 NAV CUSTOM FONT CSS
handyandmarvelous replied to sunrisehomestead's topic in Customize with code
Worked perfectly! Thank you so much! -
7.1 NAV CUSTOM FONT CSS
handyandmarvelous replied to sunrisehomestead's topic in Customize with code
Greetings! Can you also provide the code to change the font (to the custom font) in the navigation button? Thank you! -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan Unfortunately that didn't work. -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan the link worked just fine. Thank you! -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan Thank you. Can I delay the color change by a second or ease it in? -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan #c8a47e Also, is there a page on your website where I can leave a tip? You are always so helpful with everyone in the forum. You're very appreciated. -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
Also, is there a page on beaverhero.com where I can leave a tip? -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
#c8a47e -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
Thank you so very much! Is there code to change the color of the text within the button on hover? https://brianthomaslawblueprint.squarespace.com/ Password: Strat3gy I'm currently using this markdown block: <button class="button"> Areas of Practice <div class="button__horizontal"></div> <div class="button__vertical"></div> </button> <style> .button { --offset: 7px; --border-size: 1.5px; display: block; position: relative; padding: .5em 1em; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background: transparent; color: #000000; text-transform: uppercase; letter-spacing: .1em; outline: none; cursor: pointer; font-weight: normal; font-family: orpheus pro !; border-radius: 0; box-shadow: inset 0 0 0 var(--border-size) currentcolor; transition: background 0.8s ease; } .button:hover { background: #997799; } .button__horizontal, .button__vertical { position: absolute; top: var(--horizontal-offset, 0); right: var(--vertical-offset, 0); bottom: var(--horizontal-offset, 0); left: var(--vertical-offset, 0); transition: transform 0.8s ease; will-change: transform; } .button__horizontal::before, .button__vertical::before { content: ""; position: absolute; border: inherit; } .button__horizontal { --vertical-offset: calc(var(--offset) * -1); border-top: var(--border-size) solid currentcolor; border-bottom: var(--border-size) solid currentcolor; } .button__horizontal::before { top: calc(var(--vertical-offset) - var(--border-size)); bottom: calc(var(--vertical-offset) - var(--border-size)); left: calc(var(--vertical-offset) * -1); right: calc(var(--vertical-offset) * -1); } .button:hover .button__horizontal { transform: scaleX(0); } .button__vertical { --horizontal-offset: calc(var(--offset) * -1); border-left: var(--border-size) solid currentcolor; border-right: var(--border-size) solid currentcolor; } .button__vertical::before { top: calc(var(--horizontal-offset) * -1); bottom: calc(var(--horizontal-offset) * -1); left: calc(var(--horizontal-offset) - var(--border-size)); right: calc(var(--horizontal-offset) - var(--border-size)); } .button:hover .button__vertical { transform: scaleY(0); } </style> -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
Thank you! Would you be able to assist with converting this Codepen so that I can use the animation use on my Squarespace site? https://codepen.io/handyandmarvelous/pen/PMGWKo/9bae05fbcc597facf42983e3d6404bd2 -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
Thank you so much for this! Can you tell me how to change the font on this button animation to Orpheus Pro? I tried adding font-type but it was ineffective. -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan Could you please assist with the code to add this pen to my site: https://codepen.io/electerious/pen/qPjbGm Thank you! -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
My apologies. I pasted the wrong link. But the first one works marvelously, thank you. Here is the correct link:https://codepen.io/handyandmarvelous/pen/PMGWKo/9bae05fbcc597facf42983e3d6404bd2 -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan Could you please help me with the code for this pen? https://codepen.io/handyandmarvelous/pen/yLpxgXb/d5e679dc1c0575eb7fdac1cbfaea27c5 -
Time-delay appearance of buttons on cover page
handyandmarvelous replied to codefordummies's topic in Images & Videos
I tried this with the "Read On" button here without success. Any suggestions? -
How to add Codepen code my website?
handyandmarvelous replied to joeyyanna's topic in Customize with code
@tuanphan https://codepen.io/handyandmarvelous/pen/yLpxgXb/d5e679dc1c0575eb7fdac1cbfaea27c5