WooCommerce Mix and Match - Mobile Styles

Quickstart

This is a developmental repo. Clone this repo and run composer install && npm install && npm run build
OR
Download latest release

What's This?

Experimental mini-extension for WooCommerce Mix and Match that turns the counter error message into a sticky footer.

Important

1. This is proof of concept and not officially supported in any way.
2. Not ideal for use with Name Your Price or Product Addons.
3. Requires Mix and Match 2.7+

Styling the progress bar

You can adjust the styles of the progress bar with the following rules:

.mnm-mobile-container progress.mnm-container-progress::-webkit-progress-bar {
  background-color: #eee;
}
.mnm-mobile-container progress.mnm-container-progress::-webkit-progress-value {
  background-color: green;
}
.mnm-mobile-container progress.mnm-container-progress::-moz-progress-bar {
  background-color: #eee;
}
.mnm-mobile-container progress.mnm-container-progress::-moz-progress-value {
  background-color: green;
}

Then for the first CSS rule you shared that looked like,
.mnm-mobile-container progress.mnm-container-progress[value] {
  accent-color: green;
  background-color: #eee;
}

Automatic plugin updates

Plugin updates can be enabled by installing the Git Updater plugin.