yubrajs
-
Posts
104 -
Joined
-
Last visited
Community Answers
-
yubrajs's post in Custom code to make header logo bigger doesn't work any more in 7.0 site was marked as the answer
Add this code:
.Header-branding-logo {
max-width: 100%;
width: 60vw !important;
}
Image look grainy to fix that you have to remove the sizes attribute from the image tag with javascript.
This is for mobile:
.Mobile-bar-branding-logo {
width: 340px;
}
-
yubrajs's post in Audio progress bar with wave animation not working was marked as the answer
Fixed it!
-
yubrajs's post in Product page lightbox pop-up not showing thumbnail was marked as the answer
Thanks tuanphan!
Its actually Standard license version I was using. So I upgraded to Business license it worked.
-
yubrajs's post in Edit Site Header for Three Pages Only was marked as the answer
Hi, Here is the code you have to put in custom css:
#collection-658323ea6ebb5533fc88dbe7 .header-background-solid, #collection-6589b02f549719130fe08df7 .header-background-solid, #collection-6588f7e4f48be01f828283bc .header-background-solid{ background-color: rgba(42, 107, 172, 0.30) !important; } This will make the header bg 70% transparent.
-
yubrajs's post in Create hover state on text link was marked as the answer
Here is the code for underline:
.sqs-html-content h2 a .sqsrte-text-color--black:hover { text-decoration-color: #000 !important; }
-
yubrajs's post in Continually spin image with code was marked as the answer
You can achieve this with keyframe animation.
.fe-block-yui_3_17_2_1_1705023988848_42937{ animation: spin 5s normal linear infinite; } @keyframes spin { 0% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } 25% { -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); } 50% { -webkit-transform: rotate3d(0, 0, 1, 180deg); transform: rotate3d(0, 0, 1, 180deg); } 75% { -webkit-transform: rotate3d(0, 0, 1, 270deg); transform: rotate3d(0, 0, 1, 270deg); } 100% { -webkit-transform: rotate3d(0, 0, 1, 360deg); transform: rotate3d(0, 0, 1, 360deg); } }
-
yubrajs's post in Pass through was marked as the answer
Hi,
Instead of applying transition to an image with class .img; apply it on whole "a" tag. Like:
.thumbnail2 a{
filter: grayscale(0%);
}
.thumbnail2 a:hover{
transition: filter .3s ease-in-out;
-webkit-filter: grayscale(0%);
filter: grayscale(100%);
}
Remove below code:
.img {
transition: filter .3s ease-in-out;
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}
-
yubrajs's post in Can't Align pictures was marked as the answer
Update the custom css code like below:
a[data-wm-popup] {
position: unset !important;
}
.play {
opacity: 80% !important;
position: absolute !important;
width: 150px;
height: 150px;
inset: 0;
margin: auto;
}
-
yubrajs's post in Captions on Mobile in Carson Template was marked as the answer
This code will hide the captions from mobile view:
Add this in website tools > custom CSS
@media only screen and (max-width: 428px) {
.grid-image-wrapper .image-title-desc, .grid-image-wrapper .info-button {
display:none !important;
}
}
-
yubrajs's post in How do I get rid of all this white space? was marked as the answer
Edit the section and adjust the height. Check the screen-shot attached.
-
yubrajs's post in Need to centre align & increase size of embedded video on home page was marked as the answer
You have to unset the max-width value.
Add this code in custom css
#collection-61a89b896988bc2696ca8e25 #page {
max-width: unset !important;
width: 100%;
position: relative;
margin: 20px 0 0;
}
Adding above code will make home like the screen-shot attached.
-
yubrajs's post in Unable to install on my local computer was marked as the answer
Finally solved!
Solution:
Installing sq server => terminal: npm install -g @squarespace/server
Running sq server => terminal: npx squarespace-server https://kangaroo-lilac-1221.squarespace.com --auth
