SIS Excerpts

[ghost]

Top of video gets cut off in x-large screens When button on video- in mobile- button drops- too much padding In desktop/ large screen- video height gets cut off Text padding field was removed- add it back? Mobile- too much top and bottom spacing Mobile- images full width Mobile- boxes should be full width Mobile- text should be consistent with size in desktop to mobile Title + Subtitle doesn’t pull above form in desktop- does show in mobile

[ghost]

@eplumb897 Would you mind attaching a test video file here that I can use for this module?

[ghost]

Also we may need to hop on a call and get some clarification on this, I have a few questions.

[eplumb897]

There should be video files in media gallery

[ghost]

@eplumb897 For the title and subtitle on the form, I'm not seeing it in mobile or desktop, which makes sense because there's no code for that! Which of the following text options do you want to show up above the form?

• [x] Title
• [x] Subtitle
• [x] Excerpt
• [ ] Phone Number
• [ ] Address
• [ ] Button
• [ ] Logo

[eplumb897]

the check boxes are fun!

[ghost]

I'm glad they actually worked as expected, I wasn't sure. I'll work on this today and some other things.

[ghost]

1. Top of video gets cut off in x-large screens.

2560x1600 2560x1920 3840x2160

2. When button on video- in mobile- button drops- too much padding

I worked on positioning the video and the button for a while, but it occurred to me that video shouldn't really play like that on tablet any more than mobile. What I ended up doing was switching to picture/no video as soon as it gets below 1,200 pixels, and just making sure the video is well positioned on anything above 1,200 pixels. That allowed me to just work on styling the button on mobile sizes by itself. I removed any padding on mobile, but I did leave a top and bottom margin. In the pictures below, the padding below the button is on the module itself, and can be removed by you in the admin dashboard if you like. Tablet on Chrome Mobile on Safari

3. Duplicate of 1

4. Text padding field was removed- add it back?

5. Mobile- too much top and bottom spacing

I resolved this by resetting the padding to only 35 pixels of top padding on mobile and tablet, which we agreed on as a working solution on the phone on 9/8.

6. Mobile- images full width

I restyled the images in this module so that they are always full width on mobile and not distorted (meaning their height is automatically set based on being full width). I put rules in for this, but they aren't showing up on Browser Stack yet, but I confirmed these with you on the phone on 9/8 by showing you how the rules would look on an iPhone.

7. Mobile- boxes should be full width

Restyled so that a text box is always full width on mobile.

8. Mobile- text should be consistent with size in desktop to mobile

Something else we discussed on the phone on 9/8 and 9/5. The solution at the moment is to set a max font-size in mobile, with the understanding that using the wysiswyg editor for those excerpts has many advantages, but the disadvantage that whatever is put into that excerpt box will look exactly the same on all sizes, so we have to just style the child theme for mobile in this instance.

9. Title + Subtitle doesn’t pull above form in desktop- does show in mobile

iPhone 14 Plus Desktop Chrome