Snippets Collections
.sqs-announcement-bar {

  overflow: hidden;

}

.sqs-announcement-bar-text {

  -moz-transform: translateX(100%);

  -webkit-transform: translateX(100%);

  transform: translateX(100%);

  -moz-animation: scroll 15s linear infinite;

  -webkit-animation: scroll 15s linear infinite;

  animation: scroll 15s linear infinite;

}

@-moz-keyframes scroll {

  from { -moz-transform: translateX(100%); }

  to { -moz-transform: translateX(-100%); }

}

@-webkit-keyframes scroll {

  from { -webkit-transform: translateX(100%); }

  to { -webkit-transform: translateX(-100%); }

}

@keyframes scroll {

  from {

    -moz-transform: translateX(100%);

    -webkit-transform: translateX(100%);

    transform: translateX(100%);

  }

  to {

    -moz-transform: translateX(-100%);

    -webkit-transform: translateX(-100%);

    transform: translateX(-100%);

  }

}

.sqs-announcement-bar-close {display:none}

.sqs-announcement-bar-text a {
    text-decoration: none !important;
}
//Small Button//
.sqs-block-button-element--small {  position:relative;   height: 60px; line-height: 60px;  text-align: center; transition: 0.5s;  padding: 0 20px;  cursor: pointer; -webkit-transition:0.5s;}.sqs-block-button-element--small:hover {  background-color: transparent;  border-color: transparent; color: #000000;} .sqs-block-button-element--small:hover:before{ transition-delay: .2s; }.sqs-block-button-element--small:before{  width: 0%; height:100%;  z-index: 3;   content:'';  position: absolute;  bottom:-1px;   left:0;  box-sizing: border-box;  transition: .2s;}.sqs-block-button-element--small:hover:before {  width: 100% !important;  transition: .7s; }.sqs-block-button-element--small:before { border-bottom: 2px solid #000000;}

//Medium Button//
.sqs-block-button-element--medium {  position:relative;   height: 60px; line-height: 60px;  text-align: center; transition: 0.5s;  padding: 0 20px;  cursor: pointer; -webkit-transition:0.5s;}.sqs-block-button-element--medium:hover {  background-color: transparent;  border-color: transparent; color: #000000;} .sqs-block-button-element--medium:hover:before{ transition-delay: .2s; }.sqs-block-button-element--medium:before{  width: 0%; height:100%;  z-index: 3;   content:'';  position: absolute;  bottom:-1px;   left:0;  box-sizing: border-box;  transition: .2s;}.sqs-block-button-element--medium:hover:before {  width: 100% !important;  transition: .7s; }.sqs-block-button-element--medium:before { border-bottom: 2px solid #000000;}

//Large Button//
.sqs-block-button-element--large {  position:relative;   height: 60px; line-height: 60px;  text-align: center; transition: 0.5s;  padding: 0 20px;  cursor: pointer; -webkit-transition:0.5s;}.sqs-block-button-element--large:hover {  background-color: transparent;  border-color: transparent; color: #000000;} .sqs-block-button-element--large:hover:before{ transition-delay: .2s; }.sqs-block-button-element--large:before{  width: 0%; height:100%;  z-index: 3;   content:'';  position: absolute;  bottom:-1px;   left:0;  box-sizing: border-box;  transition: .2s;}.sqs-block-button-element--large:hover:before {  width: 100% !important;  transition: .7s; }.sqs-block-button-element--large:before { border-bottom: 2px solid #000000;}
star

Tue Dec 28 2021 14:20:32 GMT+0000 (Coordinated Universal Time) https://insidethesquare.co/squarespace-tutorials/scrolling-announcement-bar

#announcement #bar #scrolling #underline #link-text
star

Fri Nov 12 2021 17:22:58 GMT+0000 (Coordinated Universal Time) https://www.youtube.com/watch?v=GB_LBQ48oow&list=PLvVYrLE5_eds3eNOqxtUSG8VEwlG9otax&index=2

#squarespace #button #hover #underline

Save snippets that work with our extensions

Available in the Chrome Web Store Get Firefox Add-on Get VS Code extension