user6333114
user6333114

Reputation: 51

Chrome extension not injecting css

I've read similar many questions on stack overflow and havent found anyone with a problem similar to mine. I am not sure what i am doing wrong. (if i am doing something wrong) I hope you could help.

What i am trying to do is to inject css into the website minds.com using a chrome extension. The problem is that it is not injecting. I dont think its just that website because i have tried on one other.

manifest file:

{
  "manifest_version": 2,

  "name": "My Style",
  "description": "None",
  "version": "0.3",

  "content_scripts": [{
    "matches": ["http://www.minds.com/*"],
    "css": ["my-style.css"],
    "run_at": "document_start"
  }]
} 

css

 html{ 
            color: #cacaca; 
          } 
          .mdl-card{ 
            background: rgba(0,0,0,0.64) !important; 
            color: #fff !important; 
          } 
          /*header*/ 
          .mdl-color--white{ 
            background: linear-gradient(#000, #333) !important; 
          } 
          .mdl-color--blue-grey-800 { 
            background-color: #121212 !important; 
          } 
          /*text*/ 
          .mdl-color-text--blue-grey-500 { 
            color: #cacaca !important; 
          } 
          minds-activity.mdl-card .mdl-card__supporting-text, minds-activity .mdl-card__supporting-text { 
            color: #aaa !important; 
          } 

          .minds-avatar { 
            background: rgba(0,0,0,0.0) !important; 
          } 
          .mdl-card .m-owner-block { 
            background: rgba(0,0,0,0.6) !important; 
          } 
          .m-owner-block a{ 
            color: #cacaca !important; 
          } 
          .minds-dropdown-menu{ 
            background: rgba(0,0,0,0.5) !important; /* 
            box-shadow: 0px 9px 0px !important;*/ 
          } 
          .mdl-menu__item{ 
            color: #fff !important; 
                box-shadow: 0px 0px 9px !important; 
          } 
          .mdl-color--blue-grey-50 { 
            background: rgba(0,0,0,0.6) !important; 
          } 
          .mdl-color-text--blue-grey-900 { 
            color: #78ad56 !important; 
          } 
          /*BG*/ 

          .mdl-color--grey-100 { 
            background: url("http://powerpictures.crystalgraphics.com/photo/seamless_black_circuit_board_pattern_cg5p0977241c_th2.jpg") !important; 
          } 
          /*Blogs*/ 
          .m-title-block, .m-title-block-fixed { 
            background: rgba(0,0,0,0.9) !important; 
          } 
          /*usercard*/ 
          .m-discovery-suggested .mdl-cell minds-card-user .m-usercard-bio { 
           color: #aaa !important; 
          } 
          /*active tab*/ 
          .mdl-color--blue-grey-600 { 
            background-color: #333 !important; 
          } 
          .mdl-card__title{ 
            color: #fff !important; 
          } 
          .mdl-button{ 
            color: #acacac !important; 
          } 
          minds-gatherings .minds-gatherings-search{ 
            background: rgba(0,0,0,0.6) !important; 
            color: #aaa !important; 
          } 
          h1{ 
            color: #fff !important; 
          } 
          .mdl-tabs__tab{ 
            color: #fff !important; 
            text-shadow: 0px 0px 9px #000 !important; 
          } 
          .mdl-menu__outline { 
            background: rgba(0,0,0,0.7) !important; 
          } 
          .mdl-menu__item:hover{ 
            background: rgba(20,20,20,0.6) !important; 
            color: #fff !important; 
          } 
          .mdl-card__supporting-text textarea{ 
            color: #aaa !important; 
          } 
          body a{ 
            color: #21CE54 !important; 
          } 
          minds-blog-view{ 
            background: url("http://powerpictures.crystalgraphics.com/photo/seamless_black_circuit_board_pattern_cg5p0977241c_th2.jpg") !important;     
          } 
          minds-comments form textarea{ 
            color: #aaa !important; 
          } 
          .mdl-grid { 
            background: rgba(0,0,0,0.6); 
          } 
          .minds-blog-body p{ 
            color: #fff !important; 
          } 
          .m-h1-input { 
            color: #cacaca !important; 
          }

Upvotes: 1

Views: 69

Answers (2)

fred02138
fred02138

Reputation: 3371

Something else that can trip you up (I spent a couple of hours on this one):

In the json for matches under the content_scripts in your manifest, it matters if the protocol is correct, i.e. http or https. If you access a site with https, and the manifest says http, the extension won't inject the script/css (and vice-versa).

Upvotes: 0

Vlas Bashynskyi
Vlas Bashynskyi

Reputation: 2013

You should replace "http://www.minds.com/*" with "https://www.minds.com/*"

Upvotes: 1

Related Questions