This change restructures the Button element styles for better a11y and expected color behaviors. Here what has changed: - The `button-style()` mixin is now the ''single source or truth'' for how Button should look site-wide. - Button Block, File Block, and Search form Blocks all rely on this one mixin. - The same styles is also applied to the `<button>` element which appears in widgets, the 404 search form and comments form. - Improves expected button styles for various conditions and contexts as follows: - User color palette selections for Buttons are retained regardless of a parent block’s color settings or dark-mode. - Supports both Default/Filled styles and Outline styles. - More consistent `:hover` and `:active` styles. - `:focus` styles are now always visible and legible. - Adds a `--local-color` color variable to scope color relationships to nested blocks. - Reduces selectors in `style.css` output. - 1:1 experience between editor and front end button styles. - Properly supports Dark-mode. Props allancole, poena, scruffian, megphillips91. Fixes #51927. git-svn-id: https://develop.svn.wordpress.org/trunk@49987 602fd350-edb4-49c9-b593-d223f7449a82
WordPress
Welcome to the WordPress development repository! Please check out the contributor handbook for information about how to open bug reports, contribute patches, test changes, write documentation, or get involved in any way you can.
Getting Started
WordPress is a PHP, MySQL, and JavaScript based project, and uses Node for its JavaScript dependencies. A local development environment is available to quickly get up and running.
You will need a basic understanding of how to use the command line on your computer. This will allow you to set up the local development environment, to start it and stop it when necessary, and to run the tests.
You will need Node and npm installed on your computer. Node is a JavaScript runtime used for developer tooling, and npm is the package manager included with Node. If you have a package manager installed for your operating system, setup can be as straightforward as:
- macOS:
brew install node
- Windows:
choco install nodejs
- Ubuntu:
apt install nodejs npm
If you are not using a package manager, see the Node.js download page for installers and binaries.
You will also need Docker installed and running on your computer. Docker is the virtualization software that powers the local development environment. Docker can be installed just like any other regular application.
Development Environment Commands
Ensure Docker is running before using these commands.
To start the development environment for the first time
Clone the current repository using git clone https://github.com/WordPress/wordpress-develop.git
. Then in your terminal move to the repository folder cd wordpress-develop
and run the following commands:
npm install
npm run build:dev
npm run env:start
npm run env:install
Your WordPress site will accessible at http://localhost:8889. You can see or change configurations in the .env
file located at the root of the project directory.
To watch for changes
If you're making changes to WordPress core files, you should start the file watcher in order to build or copy the files as necessary:
npm run watch
To stop the watcher, press ctrl+c
.
To run a WP-CLI command
npm run env:cli <command>
WP-CLI has a lot of useful commands you can use to work on your WordPress site. Where the documentation mentions running wp
, run npm run env:cli
instead. For example:
npm run env:cli help
To run the tests
These commands run the PHP and end-to-end test suites, respectively:
npm run test:php
npm run test:e2e
To restart the development environment
You may want to restart the environment if you've made changes to the configuration in the docker-compose.yml
or .env
files. Restart the environment with:
npm run env:restart
To stop the development environment
You can stop the environment when you're not using it to preserve your computer's power and resources:
npm run env:stop
To start the development environment again
Starting the environment again is a single command:
npm run env:start
Credentials
These are the default environment credentials:
- Database Name:
wordpress_develop
- Username:
root
- Password:
password
To login to the site, navigate to http://localhost:8889/wp-admin.
- Username:
admin
- Password:
password
To generate a new password (recommended):
- Go to the Dashboard
- Click the Users menu on the left
- Click the Edit link below the admin user
- Scroll down and click 'Generate password'. Either use this password (recommended) or change it, then click 'Update User'. If you use the generated password be sure to save it somewhere (password manager, etc).