Jump to content

lapanimation

Member
  • Posts

    15
  • Joined

  • Last visited

lapanimation's Achievements

  1. I have attached screenshots, they are the beginnings of my separated areas for desktop and mobile. I have my entire websites coding in two different areas (desktop above mobile). Same code / different section for mobile. I can not figure out why I can' target the mobile form. MOBILE CODE BEGIN (SAME AS DESKTOP BUT CHANGED FONT SIZES ETC.) //LOCATIONS_ROGERS & ANDREWS_AUGUSTA_START// //locations_rogers & andrews_augusta_infopanel// section[data-section-id="64399f685682fd05e043bb9d"]{ h1 {font-family: 'WorkSans_Black'; font-size: 16px; letter-spacing: 0.001em; line-height: 1px; color: black;} h2 {font-family: 'WorkSans_Black'; font-size: 13px; letter-spacing: 0.001em; line-height: 1px; color: red;} h3 {font-family: 'WorkSans_Black'; font-size: 38px; letter-spacing: 0.001em; line-height: 50px; color: black;} h4 {font-family: 'WorkSans_Black'; font-size: 24px; letter-spacing: 0.001em; line-height: 30px; color: black;} p {font-family: 'WorkSans_Thin'; font-size: 17px; letter-spacing: -.03em; line-height: 12px; color: black;} //locations_rogers & andrews_augusta_infopanel// //_location title box_// #block-yui_3_17_2_1_1685548508079_5277{ background-color: white; box-shadow: 2px 2px 5px black;} //_location title box_// ////_LIGHTBOX FORM_//// //_form title_// .sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper .form-title { font-family: 'WorkSans_Black'!important; font-size: 50px!important; text-align: center; color: pink!important;} //_form title_// //_form border_// .sqs-modal-lightbox-content .lightbox-inner .lightbox-content { border: none; padding: 40px; border-radius: 15px;} //_form border_// //_form margins_// .form-wrapper .field-list .fields { margin: 0px 0px 0px -2%;} //_form margins_// //_close button style_// .sqs-modal-lightbox-content .lightbox-inner .lightbox-content .lightbox-close { position: absolute; color: white; background-color: black; font-family: 'WorkSans_Black'!important; font-size: 25px !important; top: 35px; right: 35px;} //_close button style_// //_field titles_// .sqs-block-form .field-list .title, .form-wrapper .field-list .title { font-family: 'WorkSans_Black' !important; font-size: 14px!important; color: black!important;} //_field titles_// //_field descriptions_// .form-wrapper .field-list .description { font-family: 'WorkSans_Bold'!important; font-size: 20px !important; color: black!important; letter-spacing: 0.001em!important;} //_field descriptions_// //_field captions_// .form-wrapper .field-list .field .caption { font-family: 'WorkSans_Bold'!important; font-size: 20px!important; color: black!important; letter-spacing: 0.001em;} //_field captions_// //_field boxes_// .form-wrapper .field-list .field .field-element { font-family: 'WorkSans_Black'!important; width: 100%; padding: 14px; margin: 6px 0px 4px; background-color: #D3D3D3!important; font-size: 3em!important; line-height: 10px; box-sizing: border-box; border-radius: 5px; color: red !important; border-left: none; border-right: none; border-top: none; border-bottom: none;} //_field boxes_// //_checkbox field list font_// .form-wrapper .field-list .field.checkbox label, .form-wrapper .field-list .field.radio label { font-family: 'WorkSans_Bold'!important; font-size: 40px!important; color: red!important;} //_checkbox field list font_// //_SELECT pull-down menu contents_// .form-wrapper .field-list .field select { font-family: 'WorkSans_Black' !important; font-size: 20px !important; padding: 10px 10px; border: none; border-bottom: none; background-color: #D3D3D3; color: black;} //_SELECT pull-down menu contents_// //_INPUT & placeholder text_// .form-wrapper .field-list .field .field-element { font-family: 'WorkSans_Bold'; font-size: 1.2rem!important; color: black!important;} //_INPUT & placeholder text_// //_FORM_title text_// .form-wrapper .field-list .section .title { font-family: 'WorkSans_Bold'!important; font-size: 20px!important; color: black!important;} //_line section title text_// //_FORM_description text_// .form-wrapper .field-list .description { font-family: 'WorkSans_Bold'!important; font-size: 20px!important; color: black!important;} //_line section description text_// //_REMOVE FOCUS-shows when clicking on a form field_// .form-wrapper .field-list .field .field-element:focus { outline: none !important; //removes default outline background-color: #D3D3D3!important;} //_REMOVE FOCUS-shows when clicking on a form field_// //_FORM_ACCESS BUTTON_STYLE_// button.lightbox-handle { width: 100%; background-color: red; font-family: 'WorkSans_Black'!important; font-size: 22px!important; color: white!important;} //_FORM_access button_STYLE// //_FORM_SUBMIT BUTTON_style_// section[data-section-id="64399f685682fd05e043bb9d"]{ .button.sqs-system-button.sqs-editable-button { color: #726b6a !important; background-color: transparent !important; border: 1px solid #726b6a !important; font-family: adobe-garamond-pro; font-weight: 600; font-style: normal; letter-spacing: 0em; text-transform: none; line-height: 1.6em;}} //_FORM_SUBMIT BUTTON_style_// //_lightbox_upload file button_// .field-list .title a { background-color: red!important; border-radius: 3px; margin-left: 10px; padding: 10px 10px; color: white; letter-spacing: 0.001em; font-size: 12px; font-family: 'WorkSans_Black';} //_lightbox_upload file button_// } //_lightbox form_// //locations_rogers & andrews_augusta_infopanel// MOBILE CODE END (SAME AS DESKTOP BUT CHANGED FONT SIZES ETC.)
  2. I am having trouble specifically targeting the "mobile version" of my lightbox form. I have my site running with CUSTOM CSS for pretty much every section. I am unable to TARGET my lightbox form "mobile version", but only the actual form contents, my CSS for targeting the OPEN FORM button in "mobile version" works. I can give you my login information if needed. Hoping to resolve this, it is the last step for making my site operational basically. The problem is on the LOCATIONS page, dealing with the BEGIN QUOTE button. Hoping to have separate CSS sections to customize the OPEN FORM button and also the inner FORM contents, including the SUBMIT button. Thanks for your time in advance. It is greatly appreciated. https://www.lapanimation.com/locations password: lapanimation
  3. https://www.lapanimation.com/the-process I would like to put different looping .gif texture in various sections to help give visual separation between sections. There are already .gifs in there obviously
  4. Yes. I am under the impression that I need to write a source code line, as the screenshot below shows for my custom font files. I am wanting the source code for custom images, so I can use textures as backgrounds or gifs in certain areas due to size changes. Hopefully this makes sense. Sorry for the late response. @font-face {font-family: 'WorkSans_Black'; src: url('https://static1.squarespace.com/static/6324b1c9fb6a995e4f496a1d/t/63a269ab3c6d585a59b3b80a/1671588267330/WorkSans_Black.ttf');} *that is my source code setup for fonts* / What is the image version?
  5. I apologize for the late response. www.lapanimation.com / password: lapanimation I am using numerous gifs for my website, and have been unable to use the CUSTOM CSS coded method vs. using the fluid engine upload. It may be that one is not better than the other. But I would like to be able to put in different size/layout GIFS for mobile & desktop if possible. I am looking for best result if there is anything other than making sure you file size is not to large. Thanks for your time.
  6. "Custom CSS" code to use images (.gifs) from CUSTOM FILES in image blocks, so they will hopefully not have to load. password: lapanimation
  7. Ziggy, I hope this explains. I am still unable to get my mobile logo bigger than in this screenshot. Thanks for your time, once again.
  8. Ziggy, Well done, sir. That was an awesome experience seeing it be fixed. I really do appreciate your time and support. I have already checked out your website. I am just trying to get my site functional. I will be back when I am ready to level up. Thanks,
  9. this looks good, except my navigation links are still wrapping to 2 lines. I really appreciate your help, sir.
  10. I've been able to go in multiple times and try to piece together code from other peoples examples of code for getting the navigation bar on one line. But there is always a small issue in spacing. .header-actions.header-actions--right { width: 10%; } /* Nav one line */ .header-title-nav-wrapper { flex: 1 0 90%; } .header-layout-nav-center .header-nav { width: 100% !important; flex: 1 1 100%; } This was the last code I attempted.
  11. Yes sir. I was hoping for everything to be on one line. (LOGO) space (navigation links equally spaced however) space (social links). If that makes sense.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.