Render success and error messages colours
[MAILPOET-2909]
This commit is contained in:
@ -67,15 +67,6 @@ class Styles {
|
|||||||
.mailpoet_message {
|
.mailpoet_message {
|
||||||
}
|
}
|
||||||
|
|
||||||
.mailpoet_validate_success {
|
|
||||||
font-weight: 600;
|
|
||||||
color:#468847;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_validate_error {
|
|
||||||
color:#B94A48;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mailpoet_form_loading {
|
.mailpoet_form_loading {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -173,7 +164,13 @@ EOL;
|
|||||||
// Width styles
|
// Width styles
|
||||||
$widthStyles = $this->renderWidthStyles($formSettings, $selector, $displayType);
|
$widthStyles = $this->renderWidthStyles($formSettings, $selector, $displayType);
|
||||||
|
|
||||||
return $formWrapperStyles . $formElementStyles . $widthStyles . $media;
|
$messagesStyles = $this->renderMessagesStyles($formSettings, $selector);
|
||||||
|
|
||||||
|
return $formWrapperStyles
|
||||||
|
. $formElementStyles
|
||||||
|
. $widthStyles
|
||||||
|
. $messagesStyles
|
||||||
|
. $media;
|
||||||
}
|
}
|
||||||
|
|
||||||
private function renderWidthStyles($formSettings, $selector, $displayType) {
|
private function renderWidthStyles($formSettings, $selector, $displayType) {
|
||||||
@ -229,4 +226,30 @@ EOL;
|
|||||||
private function getWidthValue(array $width) {
|
private function getWidthValue(array $width) {
|
||||||
return $width['value'] . ($width['unit'] === 'percent' ? '%' : 'px');
|
return $width['value'] . ($width['unit'] === 'percent' ? '%' : 'px');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private function renderMessagesStyles(array $formSettings, string $selector): string {
|
||||||
|
$styles = '';
|
||||||
|
if (isset($formSettings['success_validation_color']) && $formSettings['success_validation_color']) {
|
||||||
|
$success = $formSettings['success_validation_color'];
|
||||||
|
$styles .= "
|
||||||
|
$selector .mailpoet_validate_success {color: $success}
|
||||||
|
$selector input.parsley-success {color: $success}
|
||||||
|
$selector select.parsley-success {color: $success}
|
||||||
|
$selector textarea.parsley-success {color: $success}
|
||||||
|
";
|
||||||
|
}
|
||||||
|
if (isset($formSettings['error_validation_color']) && $formSettings['error_validation_color']) {
|
||||||
|
$error = $formSettings['error_validation_color'];
|
||||||
|
$styles .= "
|
||||||
|
$selector .mailpoet_validate_error {color: $error}
|
||||||
|
$selector input.parsley-error {color: $error}
|
||||||
|
$selector select.parsley-error {color: $error}
|
||||||
|
$selector textarea.textarea.parsley-error {color: $error}
|
||||||
|
$selector .parsley-errors-list {color: $error}
|
||||||
|
$selector .parsley-required {color: $error}
|
||||||
|
$selector .parsley-custom-error-message {color: $error}
|
||||||
|
";
|
||||||
|
}
|
||||||
|
return $styles;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -112,6 +112,20 @@ class StylesTest extends \MailPoetUnitTest {
|
|||||||
expect($styles)->contains('background-size: contain');
|
expect($styles)->contains('background-size: contain');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function testItShouldRenderErrorMessageColor() {
|
||||||
|
$form = Fixtures::get('simple_form_body');
|
||||||
|
$form['settings'] = ['error_validation_color' => 'xxx'];
|
||||||
|
$styles = $this->styles->renderFormSettingsStyles($form, '#prefix', FormEntity::DISPLAY_TYPE_OTHERS);
|
||||||
|
expect($styles)->contains('#prefix .mailpoet_validate_error {color: xxx}');
|
||||||
|
}
|
||||||
|
|
||||||
|
public function testItShouldRenderSuccessMessageColor() {
|
||||||
|
$form = Fixtures::get('simple_form_body');
|
||||||
|
$form['settings'] = ['success_validation_color' => 'xxx'];
|
||||||
|
$styles = $this->styles->renderFormSettingsStyles($form, '#prefix', FormEntity::DISPLAY_TYPE_OTHERS);
|
||||||
|
expect($styles)->contains('#prefix .mailpoet_validate_success {color: xxx}');
|
||||||
|
}
|
||||||
|
|
||||||
public function testItRendersWidthCssForBellowPost() {
|
public function testItRendersWidthCssForBellowPost() {
|
||||||
$form = Fixtures::get('simple_form_body');
|
$form = Fixtures::get('simple_form_body');
|
||||||
$form['settings'] = ['backgroundColor' => 'red'];
|
$form['settings'] = ['backgroundColor' => 'red'];
|
||||||
|
Reference in New Issue
Block a user