Modify inline code color in `_base.scss` not working about hexo-theme-tranquilpeak HOT 4 CLOSED

OK, I finally get it worked. Here are the steps:

1. Modifying the inline code color as above.

2. Comment out background in _variables.scss as following:

   // Highlight code
   $highlight: (
       // 'background':  #f7f8f8,  // <-- COMMENT OUT HERE
       'font-size':   1.4rem,
       'border':      1px solid,
       'line-height': 1.3em
   );

3. The above code will result in losing backround color of the pre code, so we have to specify the background color in _code.scss:

   // Reset for tag `pre` and  for class `.gutter`, `.code`, `.tag`
       pre,
       .gutter,
       .code,
       .tag {
           background-color: #f7f8f8;  // <-- MODIFY COLOR HERE
           font-family:      #{map-get($font-families, 'highlight')};
           border:           none;
           padding:          0;
           margin:           0;
           // To override cursor attribute of `.tag` components
           cursor:           text;
       }

4. npm run prod

from hexo-theme-tranquilpeak.

👋 @secsilm, it works, it's just that this property is overridden by another one:

from hexo-theme-tranquilpeak.

@LouisBarranqueiro Then how do I keep it from being overridden?

from hexo-theme-tranquilpeak.

I can't really tell because you modified the code of the theme. You need to search in the different files where the property background-color:#f7f8f8; is set and remove it.

from hexo-theme-tranquilpeak.