Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

tuanphan

Circle Member
  • Posts

    32,834
  • Joined

  • Last visited

  • Days Won

    330

Community Answers

  1. tuanphan's post in Resizing Images/Responsive Design for Mobile Optimization was marked as the answer   
    Add to Design > Custom CSS
    /* Mobile */ @media screen and (max-width:640px) { /* Fix white bar on right of screen */ html, body { overflow-x: hidden; } /* homepage image */ div#block-yui_3_17_2_1_1631304561541_3905 { padding-bottom: 0px !important; } /* about image */ div#block-yui_3_17_2_1_1631167739251_2488 { padding-bottom: 0px !important; } }  
  2. tuanphan's post in Header: Primary Navigation button issue was marked as the answer   
    Change this link
    to this
     
  3. tuanphan's post in Reducing size of portfolio project tiles was marked as the answer   
    Add to Design > Custom CSS
    @media screen and (min-width:992px) { div#gridThumbs { padding-left: 15vw; padding-right: 15vw; } }  
  4. tuanphan's post in Problems With Mobile Overlay (and desktop) Navigation was marked as the answer   
    #1. Add to Custom CSS
    a[data-folder-id] { position: relative; right: -10px; } #2. Add to Custom CSS
    [data-folder] .header-menu-nav-folder-content { justify-content: flex-start; } #3. Use this CSS
    a.header-nav-folder-title:after { content: "\e009"; font-family: 'squarespace-ui-font'; } /* Dropdown auto width */ .header-nav-folder-content { width: auto !important; min-width: unset !important; }  
  5. tuanphan's post in Custom fonts for Henson template help was marked as the answer   
    Add to Design > Custom CSS. You can adjust values
    /* Index typography */ span.collection-nav-item-span { font-family: monospace; font-size: 1.5em; } /* gallery overlay */ .page-desc p { font-family: proxima-nova !important; font-size: 1.5em !important; } /* gallery title */ .image-title * { font-family: monospace; font-size: 40px; } .image-desc * { font-family: monospace !important; font-size: 50px !important; }  
  6. tuanphan's post in Resize Image/Logo for Mobile View Only was marked as the answer   
    Add to Design > Custom CSS
    /* resze footer mobile logo */ @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1633912708210_14107 { width: 50%; margin: 0 auto; } }  
  7. tuanphan's post in How to align the text beside the image on mobile was marked as the answer   
    Use this new code
    /* Align text - image */ [data-section-id="61664c437456c9037969db05"] { .row:nth-child(2) { display: flex; align-items: center; flex-wrap: wrap; } @media screen and (max-width:767px) { .row:nth-child(2) .span-1 { width: 30% !important; float: left !important; } .row:nth-child(2) .span-3 { width: 65% !important; float: left !important; } .row:nth-child(2) .span-1 .image-block { width: 90% !important; } }}  
  8. tuanphan's post in How to align the text beside the image on mobile was marked as the answer   
    Add to Design > Custom CSS
    /* Align text - image */ div#block-yui_3_17_2_1_1634254936727_33211 + .row .row { display: flex; align-items: center; } @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1634254936727_33211 + .row .row .span-1 { width: 30% !important; } div#block-yui_3_17_2_1_1634254936727_33211 + .row .row .span-1 .image-block { width: 90%; } }  
  9. tuanphan's post in How to align the text beside the image on mobile was marked as the answer   
    Use this new code
    /* Align text - image */ [data-section-id="61664c437456c9037969db05"] { .row:nth-child(2) { display: flex; align-items: center; flex-wrap: wrap; } @media screen and (max-width:767px) { .row:nth-child(2) .span-1 { width: 30% !important; float: left !important; } .row:nth-child(2) .span-3 { width: 65% !important; float: left !important; } .row:nth-child(2) .span-1 .image-block { width: 90% !important; } }}  
  10. tuanphan's post in How to align the text beside the image on mobile was marked as the answer   
    Add to Design > Custom CSS
    /* Align text - image */ div#block-yui_3_17_2_1_1634254936727_33211 + .row .row { display: flex; align-items: center; } @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1634254936727_33211 + .row .row .span-1 { width: 30% !important; } div#block-yui_3_17_2_1_1634254936727_33211 + .row .row .span-1 .image-block { width: 90%; } }  
  11. tuanphan's post in How to align the text beside the image on mobile was marked as the answer   
    Use this new code
    /* Align text - image */ [data-section-id="61664c437456c9037969db05"] { .row:nth-child(2) { display: flex; align-items: center; flex-wrap: wrap; } @media screen and (max-width:767px) { .row:nth-child(2) .span-1 { width: 30% !important; float: left !important; } .row:nth-child(2) .span-3 { width: 65% !important; float: left !important; } .row:nth-child(2) .span-1 .image-block { width: 90% !important; } }}  
  12. tuanphan's post in Image Overlay in Place of Text in Banner was marked as the answer   
    Add to Design > Custom CSS
    body#collection-6155e76677c14e03eb5441c2 .banner-thumbnail-wrapper p:last-child strong { background-image: url(https://cdn.pixabay.com/photo/2021/09/15/12/52/animal-6626792__340.jpg); background-size: contain; background-repeat: no-repeat; background-position: center center; color: transparent !important; }  
  13. tuanphan's post in Create Button in Main Navigation Bar but Maintaining Dropdown Options was marked as the answer   
    #1. Add to Design > Custom CSS
    a.header-nav-folder-title[href="/Donate"] { background-color: #00a876; color: white !important; padding: 10px; border-radius: 10px; } nav.header-nav-list { align-items: center; } #2. Just drag it to after Contact item
  14. tuanphan's post in Link font color changed in markdown block, can't change? was marked as the answer   
    Use this new code
    div#page-section-615f29a16875bf14ab76f63d .markdown-block a { color: #15655e !important; }  
  15. tuanphan's post in Site Title Font Different on Mobile Site Compared to "Mobile View" When Editing was marked as the answer   
    Your font name code is incorrect
    .header-title-logo a:after { content: "Lobuzzetta Copy - Giving Your Copy A Lotta Buzz"; display: inline-block; font-size: 20px; font-family: 'proxima-nova'; color: #000; text-align: center; vertical-align: middle; font-weight: 500; padding-left: 15px; }  
  16. tuanphan's post in tweaking auto-layout list section for tablet (squarespace 7.1) was marked as the answer   
    Add to Design > Custom CSS
    /* Homepage List section */ @media screen and (max-width:991px) and (min-width:768px) { body.homepage .list-item-content h2 { font-size: 20px !important; } .user-items-list-item-container[data-section-id="615b2fd71249de2a06ebdfcf"] { grid-gap: 20px 20px !important; } }  
  17. tuanphan's post in List section being cut off was marked as the answer   
    Add this CSS
    .user-items-list-carousel[data-show-adjacent-slides="false"] .user-items-list-carousel__slides-revealer { overflow: visible; }  
  18. tuanphan's post in Blog page not displaying correctly was marked as the answer   
    in Design > Custom CSS > Find this code (this code affects on both Site Header & Blog Post Meta info (meta has post title))
    header { position: fixed !important; } change it to
    header#header { position: fixed !important; }  
  19. tuanphan's post in Adjusting Newsletter block in footer was marked as the answer   
    Try adding to Design > Custom CSS
    .newsletter-form-body { padding: 0 !important; } .newsletter-form-body>div { margin: 0 !important; } @media screen and (max-width:767px) { footer.sections .newsletter-form-fields-wrapper.form-fields { width: 50% !important; float: left !important; margin-right: 10px; } footer.sections .newsletter-form-button-wrapper.submit-wrapper { width: 40% !important; float: right; } }  
  20. tuanphan's post in All of my sections are only vertically centered in edit, and would move closer to the top when not in edit mode. was marked as the answer   
    Try adding to Design > Custom CSS
    .image-block { padding-top: 17px !important; padding-bottom: 17px !important; }  
  21. tuanphan's post in Custom search icon png in 7.0 Brine was marked as the answer   
    Try adding to Design > Custom CSS
    header.Header .Header-search-form-submit { background-image: url(https://cdn.pixabay.com/photo/2021/10/03/04/21/woman-6676901__340.jpg); background-size: contain; } header.Header .Header-search-form-submit svg { visibility: hidden; }  
  22. tuanphan's post in Help with re-Ordering blocks on Mobile. was marked as the answer   
    @Dhowbearcat Don't remove above code
    Add this to Design > Custom CSS
    @media screen and (max-width:640px) { section#up-trip-pt2 .columns-12>.row { flex-direction: column-reverse !important; } }  
  23. tuanphan's post in Flatiron: How to right align navigation menu on desktop, but use hamburger icon on mobile? was marked as the answer   
    Try new code
    @media screen and (min-width:769px) { #navigator header#topBar ul#nav { display: block; float: right; } }  
  24. tuanphan's post in Split screen layout issue was marked as the answer   
    Hi,
    The WillMyers code override it.
    Use this
    @media (min-width:799px) { body:not(.sqs-edit-mode-active).tweak-fixed-header-style-basic .split-sticky { top: 0 !important; } } This code will override the WillMyers plugin code. I'm not sure if it's causing problems with the plugin you're using.
  25. tuanphan's post in Icon in Secondary Navigation Affecting Text was marked as the answer   
    Add this CSS
    a.Header-nav-item[href="/coop-curbside"] { position: relative; top: 2px; }  
×
×
  • Create New...