[Resolved] css and new download block

Home Forums Support [Resolved] css and new download block

Home Forums Support css and new download block

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #780013
    Frans

    I added a “file-block” with the new block editor (Gutenberg, WP 5.03). It shows a download-button, black background, white text. I tried to adapt the css characteristics of this button:

    .wp-block-file__button:link, .wp-block-file__button:visited, .wp-block-file__button:active {
    	border: 1px solid #628907;
    	border-radius: 5px;
    	padding: 5px 10px;
    	background-color: #fff;
    	color: #628907;
    	font-size: 15px;
    }
    .wp-block-file__button:hover {
    	border: 1px solid #90CB0D;
      background-color: #90CB0D;
    }

    It works, except one: color: #628907; does not work. The text remains white, whatever I choose as color value.

    How can I override the standard text color (white) of this button ?

    Thanks !

    Frans van Ittersum

    #780072
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Looks like the block library is using these selectors in their CSS:

    .wp-block-file a.wp-block-file__button:active, 
    .wp-block-file a.wp-block-file__button:focus, 
    .wp-block-file a.wp-block-file__button:hover, 
    .wp-block-file a.wp-block-file__button:visited {
    
    }

    You’ll want to use the same selectors to overwrite it.

    #780528
    Frans

    Thanks! It works !
    Frans

    #780760
    Tom
    Lead Developer
    Lead Developer

    You’re welcome 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.