diff --git a/admin/css/admin-styles.css b/admin/css/admin-styles.css index 040509b..b5bac39 100644 --- a/admin/css/admin-styles.css +++ b/admin/css/admin-styles.css @@ -6,140 +6,140 @@ /* General Admin Styles */ .wpst-admin-page { - max-width: 1200px; - margin: 20px auto; - padding: 20px; - background: #fff; - border-radius: 5px; - box-shadow: 0 1px 3px rgb(0 0 0 / 10%); + max-width: 1200px; + margin: 20px auto; + padding: 20px; + background: #fff; + border-radius: 5px; + box-shadow: 0 1px 3px rgb(0 0 0 / 10%); } .wpst-admin-header { - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #eee; + margin-bottom: 20px; + padding-bottom: 20px; + border-bottom: 1px solid #eee; } .wpst-admin-header h1 { - margin-top: 0; - color: #23282d; + margin-top: 0; + color: #23282d; } /* Admin Form Styles */ .wpst-form-table { - width: 100%; - border-collapse: collapse; + width: 100%; + border-collapse: collapse; } .wpst-form-table th { - text-align: left; - padding: 15px 10px 15px 0; - width: 200px; - vertical-align: top; + text-align: left; + padding: 15px 10px 15px 0; + width: 200px; + vertical-align: top; } .wpst-form-table td { - padding: 15px 0; - vertical-align: middle; + padding: 15px 0; + vertical-align: middle; } .wpst-form-table input[type="text"], .wpst-form-table input[type="number"], .wpst-form-table select, .wpst-form-table textarea { - width: 400px; - max-width: 100%; + width: 400px; + max-width: 100%; } .wpst-form-table textarea { - min-height: 100px; + min-height: 100px; } .wpst-form-description { - color: #666; - font-style: italic; - margin-top: 5px; + color: #666; + font-style: italic; + margin-top: 5px; } /* Admin Notices */ .wpst-notice { - padding: 10px 15px; - margin: 15px 0; - border-radius: 3px; - border-left: 4px solid #00a0d2; - background: #f7fcff; + padding: 10px 15px; + margin: 15px 0; + border-radius: 3px; + border-left: 4px solid #00a0d2; + background: #f7fcff; } .wpst-notice.success { - border-left-color: #46b450; - background: #ecf7ed; + border-left-color: #46b450; + background: #ecf7ed; } .wpst-notice.error { - border-left-color: #dc3232; - background: #fbeaea; + border-left-color: #dc3232; + background: #fbeaea; } .wpst-notice.warning { - border-left-color: #ffb900; - background: #fff8e5; + border-left-color: #ffb900; + background: #fff8e5; } /* Admin Cards */ .wpst-card-container { - display: flex; - flex-wrap: wrap; - margin: 0 -10px; + display: flex; + flex-wrap: wrap; + margin: 0 -10px; } .wpst-card { - flex: 1 0 300px; - margin: 10px; - padding: 20px; - background: #fff; - border-radius: 3px; - box-shadow: 0 1px 3px rgb(0 0 0 / 10%); + flex: 1 0 300px; + margin: 10px; + padding: 20px; + background: #fff; + border-radius: 3px; + box-shadow: 0 1px 3px rgb(0 0 0 / 10%); } .wpst-card-header { - margin-bottom: 15px; - padding-bottom: 15px; - border-bottom: 1px solid #eee; + margin-bottom: 15px; + padding-bottom: 15px; + border-bottom: 1px solid #eee; } .wpst-card-title { - margin: 0; - font-size: 16px; - font-weight: 600; + margin: 0; + font-size: 16px; + font-weight: 600; } .wpst-card-content { - margin-bottom: 15px; + margin-bottom: 15px; } .wpst-card-footer { - padding-top: 15px; - border-top: 1px solid #eee; - text-align: right; + padding-top: 15px; + border-top: 1px solid #eee; + text-align: right; } /* Responsive Styles */ @media screen and (width <= 782px) { - .wpst-form-table th { - width: 100%; - display: block; - padding-bottom: 0; - } + .wpst-form-table th { + width: 100%; + display: block; + padding-bottom: 0; + } - .wpst-form-table td { - width: 100%; - display: block; - } + .wpst-form-table td { + width: 100%; + display: block; + } - .wpst-form-table input[type="text"], - .wpst-form-table input[type="number"], - .wpst-form-table select, - .wpst-form-table textarea { - width: 100%; - } + .wpst-form-table input[type="text"], + .wpst-form-table input[type="number"], + .wpst-form-table select, + .wpst-form-table textarea { + width: 100%; + } } diff --git a/admin/css/update-source-selector.css b/admin/css/update-source-selector.css index 3f8b91e..35cca99 100644 --- a/admin/css/update-source-selector.css +++ b/admin/css/update-source-selector.css @@ -6,138 +6,138 @@ /* Modal Styles */ .wpst-modal { - display: none; - position: fixed; - z-index: 100000; - left: 0; - top: 0; - width: 100%; - height: 100%; - overflow: auto; - background-color: rgb(0 0 0 / 40%); + display: none; + position: fixed; + z-index: 100000; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgb(0 0 0 / 40%); } .wpst-modal-content { - position: relative; - background-color: #fefefe; - margin: 10% auto; - padding: 20px; - border-radius: 5px; - box-shadow: 0 4px 8px rgb(0 0 0 / 10%); - width: 500px; - max-width: 90%; + position: relative; + background-color: #fefefe; + margin: 10% auto; + padding: 20px; + border-radius: 5px; + box-shadow: 0 4px 8px rgb(0 0 0 / 10%); + width: 500px; + max-width: 90%; } .wpst-modal-header { - padding-bottom: 15px; - border-bottom: 1px solid #eee; - margin-bottom: 15px; + padding-bottom: 15px; + border-bottom: 1px solid #eee; + margin-bottom: 15px; } .wpst-modal-title { - margin: 0; - font-size: 18px; - font-weight: 600; + margin: 0; + font-size: 18px; + font-weight: 600; } .wpst-modal-close { - position: absolute; - top: 10px; - right: 15px; - font-size: 20px; - font-weight: 700; - color: #666; - cursor: pointer; + position: absolute; + top: 10px; + right: 15px; + font-size: 20px; + font-weight: 700; + color: #666; + cursor: pointer; } .wpst-modal-close:hover, .wpst-modal-close:focus { - color: #000; - text-decoration: none; + color: #000; + text-decoration: none; } .wpst-modal-body { - margin-bottom: 20px; + margin-bottom: 20px; } .wpst-modal-footer { - padding-top: 15px; - border-top: 1px solid #eee; - text-align: right; + padding-top: 15px; + border-top: 1px solid #eee; + text-align: right; } /* Source Selection Styles */ .wpst-source-options { - margin: 15px 0; + margin: 15px 0; } .wpst-source-option { - display: block; - margin-bottom: 10px; - padding: 10px; - border: 1px solid #ddd; - border-radius: 3px; - cursor: pointer; + display: block; + margin-bottom: 10px; + padding: 10px; + border: 1px solid #ddd; + border-radius: 3px; + cursor: pointer; } .wpst-source-option:hover { - background-color: #f9f9f9; + background-color: #f9f9f9; } .wpst-source-option.selected { - border-color: #0073aa; - background-color: #f0f6fc; + border-color: #0073aa; + background-color: #f0f6fc; } .wpst-source-option input[type="radio"] { - margin-right: 10px; + margin-right: 10px; } .wpst-source-option-label { - font-weight: 600; + font-weight: 600; } .wpst-source-option-description { - margin-top: 5px; - color: #666; - font-size: 13px; + margin-top: 5px; + color: #666; + font-size: 13px; } /* Loading Indicator */ .wpst-loading { - display: inline-block; - width: 20px; - height: 20px; - border: 2px solid rgb(0 0 0 / 10%); - border-radius: 50%; - border-top-color: #0073aa; - animation: wpst-spin 1s ease-in-out infinite; - margin-right: 10px; - vertical-align: middle; + display: inline-block; + width: 20px; + height: 20px; + border: 2px solid rgb(0 0 0 / 10%); + border-radius: 50%; + border-top-color: #0073aa; + animation: wpst-spin 1s ease-in-out infinite; + margin-right: 10px; + vertical-align: middle; } @keyframes wpst-spin { - to { - transform: rotate(360deg); - } + to { + transform: rotate(360deg); + } } /* Message Styles */ .wpst-modal-message { - padding: 10px; - margin: 10px 0; - border-radius: 3px; - display: none; + padding: 10px; + margin: 10px 0; + border-radius: 3px; + display: none; } .wpst-modal-message.success { - background-color: #ecf7ed; - border: 1px solid #46b450; - color: #2a6f31; + background-color: #ecf7ed; + border: 1px solid #46b450; + color: #2a6f31; } .wpst-modal-message.error { - background-color: #fbeaea; - border: 1px solid #dc3232; - color: #8a1f1f; + background-color: #fbeaea; + border: 1px solid #dc3232; + color: #8a1f1f; } diff --git a/package.json b/package.json index 07c980b..c934d13 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "test:phpunit:multisite": "WP_MULTISITE=1 composer test", "build": "./build.sh", "lint:js": "eslint cypress/", + "lint:css": "stylelint \"**/*.css\" --allow-empty-input", "lint:php": "composer run-script phpcs", "lint:php:simple": "composer run-script phpcs:simple", "lint:phpstan": "composer run-script phpstan", @@ -38,7 +39,7 @@ "test:php": "composer run-script test", "lint": "composer run-script lint", "fix": "composer run-script fix", - "quality": "npm run lint && npm run test:php" + "quality": "npm run lint && npm run lint:css && npm run test:php" }, "repository": { "type": "git", @@ -64,6 +65,8 @@ "@wp-playground/cli": "^3.0.22", "cypress": "^13.17.0", "eslint": "^8.57.0", - "eslint-plugin-cypress": "^2.15.1" + "eslint-plugin-cypress": "^2.15.1", + "stylelint": "^16.0.0", + "stylelint-config-standard": "^36.0.0" } }