-
Posts
8 -
Joined
-
Last visited
Reputation Activity
-
AshwinG reacted to tuanphan in Adjusting the vertical alignment of mobile menu nav items
Use this CSS
[data-folder="root"]>.header-menu-nav-folder-content { justify-content: flex-start; }
-
AshwinG reacted to timoneill in How to change mobile menu font size in 7.1?
Hi,
Try the above from another poster tuanphan...the CSS works well for me
-
AshwinG reacted to tuanphan in Change of linked text on hover in 7.1
Add to Design > Custom CSS
/* link hover color */ #page a:hover { color: violet; }
-
AshwinG reacted to tuanphan in Change text link color on hover; code not working
Edit second code to this
a:hover, a:hover span { font-weight: bold; color: #5fb6e4 !important; }
-
AshwinG reacted to tuanphan in Setting up a separate footer for mobile or have it centered
Suppose you have 2 sections in Footer.
To hide Second section on desktop, use this CSS code
/* desktop */ @media screen and (min-width:992px) { footer.sections section:nth-child(2) { display: none !important; }} To hide First section on mobile, use this code
/* Mobile */ @media screen and (max-width:991px) { footer.sections section:nth-child(1) { display: none !important; }}
-
AshwinG reacted to creedon in Want to change color of ONE option in my menu
Replace your code with the following.
body:not( .header--menu-open ) [ data-header-style="solid" ].header .header-nav-wrapper .header-nav-item--external a { color : #000; font-weight : bold; } Let us know how it goes.
-
AshwinG reacted to markadekoning in Change Header Height on Mobile Only Squarespace 7.1
Hi guys,
I'd like to change the header height on mobile only.
Website: www.thehomecollective.com.au
pword: Torquay1!
I have this code for header height on desktop:
.tweak-fixed-header .header .header-announcement-bar-wrapper {
padding-top: 1.5vw !important;
padding-bottom: 1.5vw !important;
}
Thanks.
-
AshwinG reacted to tuanphan in Change Header Height on Mobile Only Squarespace 7.1
Add this code under
@media screen and (max-width:767px) { .tweak-fixed-header .header .header-announcement-bar-wrapper { padding-top: 2vw !important; padding-bottom: 2vw !important; } }
-
AshwinG reacted to HighPointers in Need to add space between images in slideshow reel
This code worked perfectly and didn't crop images even if they weren't the same size.
.gallery-reel-item img {
transform: scale(.9);
}
-
AshwinG reacted to LUDA in Adding space between images in Slideshow Reel gallery
Hi, i'm not a developer or anything but I think I've found my own personal solution i'd like to share with you. Only because it took me hours of trial and error to find the right soultion.
Basically, from what I can tell. 7.1 is using a sort of "container" to hold the images in which it reels through the gallery. Probably changing things like padding might just be changing the container as opposed to the image size itself. With that being said, trail and error, I figured why not just change the .gallery-reel-item img as opposed to the src or even gallery. Anyways, basically resizing the inner image within gallery-reel-item.
Code found below to what I believe basically resized the inner image a bit to give your images more visual space in between them. If they end up to small then just enlarge the size of the gallery.
.gallery-reel-item img { width: 100%; ///change percentage to a smaller value in order to resize height: auto; }
the height set to auto to allow for scaled transformation. Hopefully this helps.
-
AshwinG got a reaction from creedon in Button which links to random page on site
Awesome, it works.
Thank you so much
-
AshwinG reacted to creedon in Go to a random page from a list of 100
This requires the business plan or above.
Add the following to Website > Pages > Website Tools > Code Injection > HEADER.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
Add element url string random.html to Page Settings > Advanced > Page Header Code Injection for the page. Please see per-page code injection.
Alternately if you want a site-wide effect add the code to Website > Pages > Website Tools > Code Injection > FOOTER..
Let us know how it goes.
-
AshwinG reacted to creedon in Button which links to random page on site
Please see the following.
Let us know how it goes.
-
AshwinG reacted to creedon in Button which links to random page on site
The selector needs to be...
const selector = '#block-yui_3_17_2_1_1688984615330_1727 a'; This targets the block and the link in the block so the URL can be replaced.
-
AshwinG got a reaction from tuanphan in Fixed position Header Logo, but not navigation links
Perfect, thanks
-
AshwinG reacted to tuanphan in Fixed position Header Logo, but not navigation links
Add to Design > custom CSS
/* hide nav on scroll */ header#header.shrink nav { visibility: hidden; }
-
AshwinG reacted to tuanphan in How do I put 1px border between the header and footer and main body container in 7.1
Add to Home > Design > Custom CSS
/* Add a line to bottom of header */ header#header { border-bottom: 1px solid green; } /* Add a line to top of footer */ footer#footer-sections { border-top: 1px solid green; }
-
AshwinG reacted to tuanphan in Creating custom aspect ratios for portfolio page
Add this to these page header
<style> .grid-image { object-fit: contain !important; } .grid-image { padding-bottom: unset !important; } .grid-image-inner-wrapper { position: static !important; } a.grid-item { padding: unset !important; height: auto !important; } </style>
-
AshwinG got a reaction from tuanphan in Vertical Site Navigation
Awesome, it works. Thank you
Also want to say I've used code you've posted onto other forum posts in the past, thanks for all the great work
-
AshwinG reacted to tuanphan in How to remove underline site navigation on mobile view
Add this CSS
nav.header-menu-nav-list .header-menu-nav-item * { background-image: none !important; text-decoration: none !important; border: none !important; }
-
AshwinG reacted to tuanphan in Header Customization - move logo to center and move menu to left
I think Site Header should have this option. You try checking again.
Or add this to Design > Custom CSS
.header-title-nav-wrapper { flex-direction: row-reverse; } .header-title-logo { text-align: center; }
-
AshwinG reacted to tuanphan in Removing underline from navigation on 7.1
Add to Home > Design > Custom CSS
.header-nav-wrapper a { background-image: none !important; }
-
AshwinG reacted to tuanphan in how to remove previous and next project links from version 7.1 portfolio
add to Page Settings > Advanced > Header
<style> .item-pagination {display: none !important;} </style>
-
AshwinG reacted to tuanphan in Vertical Site Navigation
Add to Design > Custom CSS
nav.header-nav-list { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }