How to fix invalid CSS error in theme.scss.liquid?

[Caitlin333]

Hey there,

I was editing some code in theme.scss.liquid and ended up changing my mind and deleting the bit I changed. But for some reason my website is no longer working, and when I try to edit I am given the message "Invalid CSS after "x-width:": expected pseudoclass or pseudoelement, was "767px){" at 5810" can someone please help.

Thanks!

Here's the area I believe has the error:

x-width:767px){
.has-secondary.grid-view-item__link img.secondary{
display:none;
}
}
.grid-view-item__title {
margin-top: 10px;
}

[PageFly-Victor]

This is PageFly - Free Landing Page Builder. 

That error because of wrong syntax on the css property. The proper syntax should be like 

@media screen (max-width:767px){
.has-secondary.grid-view-item__link img.secondary{
display:none;
}
}

You can copy my code or you can delete it to make it work

Hope this can help you solve the issue 

Best regards,

PageFly

[Caitlin333]

Hi! Thanks for the reply. Unfortunately, it's still not working. Any other thoughts?

I can't believe I did this right before my new collection launch. Oof!

[PageFly-Victor]

Can you take the screenshot in file, or where the message show for me? 

[Caitlin333]

The error message stopped showing up but the problem is still there. If I give you the website name would that help or more of the CSS?

[PageFly-Victor]

please help me with the website url and take screenshots on the file you have edited, i will have an better overview on the issue. 

[Caitlin333]

www.earthofprini.com

[Caitlin333]

for some reason the error message isnt coming up anymore but the website still is not working.

[Dan-From-Ryviu]

Hi @Caitlin333,

You can try to remove this code, click Save button and then check again 

x-width:767px){
.has-secondary.grid-view-item__link img.secondary{
display:none;
}
}

[Caitlin333]

I accidentally deleted the entire code. I'm really not doing my best tonight! Is there a way to get the entire theme.scss.liquid back? I really appreciate your help.

[PageFly-Victor]

Do you have any backup files? The scss file type cannot revert it back.
You can re-install the theme once again and copy the scss file
or you can contact the theme, they can provide a new file for you 

[PaulNewton]

Hi @Caitlin333 assets like theme.scss don't have a version history in the editor.

The easiest solution is if you made no other changes to this file and this is recent new theme install simply go to the theme store and install a new copy of the theme and copy the contents of the file in the new theme to your old theme, and then start trying you coding changes over again.

[Caitlin333]

Hey there - thanks so much. I made no other changes. I tried what you suggested but it turns out I am using Debut 2.1.0 which is an older version than the one available to install. Man oh man...any other thoughts?

[PaulNewton · Accepted solution]

Unfortunately shopify is in a bad habit of not providing original files of old theme versions.

Duplicate your current broken theme and try the file transplant anyway on the duplicate and if that's not problematic consider trying the transplant on the live theme.

Beyond that a super iffy fallback is to dig through the CDN trying to decrement to older version parameter values.

https://cdn.shopify.com/s/files/1/0260/1061/5830/t/1/assets/theme.scss.css?enable_css_minification=1... 

I tried going back some but did not see any references to the relevant rules like .has-secondary .