tea3
CSS syntax error in tag 'style amp-custom'
BUG
I'm using the theme hexo-theme-suka and I was added the generator_amp part to the theme's file (themes/suka/layout/_partial/head/index.ejs)'s first line
But when I was trying to test my blog via https://validator.ampproject.org , I got this error
- CSS syntax error in tag 'style amp-custom' - incomplete declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 290
- CSS syntax error in tag 'style amp-custom' - invalid declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 309
- CSS syntax error in tag 'style amp-custom' - incomplete declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 317
- CSS syntax error in tag 'style amp-custom' - invalid declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 337
- CSS syntax error in tag 'style amp-custom' - incomplete declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 378
- CSS syntax error in tag 'style amp-custom' - invalid declaration.AUTHOR_STYLESHEET_PROBLEM line 1744, column 392
This is the error part.
#hexo-amp-id-1{color:#DB4D6D;}#hexo-amp-id-2{color:#DB4D6D;}#hexo-amp-id-3{color:#DB4D6D;}#hexo-amp-id-4{color:#DB4D6D;}#hexo-amp-id-5{color:#DB4D6D;}#hexo-amp-id-6{background-color:black;color:white;text-decoration:none;padding:4px 6px;font-family:-apple-system, BlinkMacSystemFont, "San Francisco", "Helvetica Neue", Helvetica, Ubuntu, Roboto, Noto, "Segoe UI", Arial, sans-serif;font-size:12px;font-weight:bold;line-height:1.2;display:inline-block;border-radius:3px}#hexo-amp-id-7{display:inline-block;padding:2px 3px}#hexo-amp-id-8{height:12px;width:auto;position:relative;vertical-align:middle;top:-2px;fill:white}#hexo-amp-id-9{display:inline-block;padding:2px 3px}
the problem is I could't find how is this part comes from, and how to fix it (exclude the first minus sign)
- "San Francisco", "Helvetica Neue", Helvetica, Ubuntu, Roboto, Noto, "Segoe UI"
the is Example HTML file to this full page
Environment Info
OS version
- OSX 10.14
Node version(node -v)
v12.11.1
Your site _config.yml
generator_amp:
templateDir: amp-template
assetDistDir: amp-dist
logo:
path: sample/sample-logo.png
width: 600
height: 60
substituteTitleImage:
path: sample/sample-substituteTitleImage.png
width: 1024
height: 800
warningLog: true # To display warning, please set true.
generateAmpPath: amp/archives/:abbrlink/
Plugin version(npm ls --depth 0)
[email protected] /Users/edisonjwa/Documents/git/Hexo-CI
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]
After testing only if there exist headers this part will comes out if post with out context https://gist.github.com/EdisonJwa/81ac75c2fc9298b4ea119b7a20b044f6
Are fonts used in the content embedded in your articles, such as iframes ? Also If you delete an iframe or embedded CSS, will the error disappear ?
The font specification may not be converted successfully with the hexa-generator-amp plug-in, and ; may have changed to ".
Are fonts used in the content embedded in your articles, such as iframes ? Also If you delete an iframe or embedded CSS, will the error disappear ?
The font specification may not be converted successfully with the hexa-generator-amp plug-in, and
;may have changed to".
Yes that's it. So it's there any way to fix it?
@EdisonJwa
I visited your web site that before it was converted AMP. https://www.wevg.org/archives/pair-locking-your-iphone/
The source code for the button is probably the source of the problem.
In the source code, double quotes are the reference characters. Please check if the reference character " is in the template or in the article, and replace code to the ". That will solve it.
Although it is possible to deal with bugs as a plug-in, this is a rare case.