Skip to content

Commit

Permalink
fix(radiosfield): bad rendering of buttons when printing
Browse files Browse the repository at this point in the history
Signed-off-by: Thierry Bugier <tbugier@teclib.com>
  • Loading branch information
btry committed Apr 21, 2020
1 parent 7f9451a commit b600e76
Show file tree
Hide file tree
Showing 3 changed files with 39 additions and 77 deletions.
38 changes: 0 additions & 38 deletions css/print_form.css
Original file line number Diff line number Diff line change
Expand Up @@ -133,41 +133,3 @@ label[for] {
height:16px;
width:16px;
}


/** RADIO BUTTONS */

.formcreator_radios input[type = radio] {
display: none;
}
.formcreator_radios input[type = radio] + label {
cursor: pointer;
padding-left: 22px;
position: relative;
display: block;
height: 26px;
}
.formcreator_radios input[type = radio] + label:before,
.formcreator_radios input[type = radio] + label:after {
position: absolute;
content: "";
border-radius: 50%;
transition: all 0.3s ease;
}
.formcreator_radios input[type = radio] + label:before {
top: -1px;
left: 0;
width: 15px;
height: 15px;
background-color: #727272;
box-shadow: inset 0 0 0 13px #FFF;
border: 2px solid #727272;
}
.formcreator_radios input[type = radio] + label:after {
top: 40%;
left: 9px;
width: 54px;
height: 54px;
background-color: rgba(50, 50, 50, 0.1);
transform: translate(-50%, -50%) scale(0);
}
65 changes: 30 additions & 35 deletions css/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -420,49 +420,44 @@ input.submit_button:focus {
border: 2px solid #727272;
}


.formcreator_radios .form-group-radio {
position: relative;
display: inline-block;
width: 16px;
height: 16px;
}
.formcreator_radios .form-group-radio + label {
margin-left: 7px;
}
.formcreator_radios input[type = radio] {
display: none;
}
.formcreator_radios input[type = radio] + label {
cursor: pointer;
padding-left: 22px;
position: relative;
display: inline-block;
height: 26px;
.formcreator_radios .radio {
padding: 2px 0;
}
.formcreator_radios input[type = radio] + label:before,
.formcreator_radios input[type = radio] + label:after {
.formcreator_radios input[type = radio] + label.label-radio span {
display: inline-block;
position: absolute;
content: "";
border-radius: 50%;
transition: all 0.3s ease;
width: 16px;
height: 16px;
}
.formcreator_radios input[type = radio] + label:before {
top: -1px;
left: 0;
width: 15px;
height: 15px;
background-color: #727272;
box-shadow: inset 0 0 0 13px #FFF;
.formcreator_radios input[type = radio] + label.label-radio .box {
background-color: #fff;
border: 2px solid #727272;
border-radius: 50%;
}
.formcreator_radios input[type = radio] + label.label-radio .check {
left: 4px;
top: 4px;
width: 0px;
height: 0px;
opacity: 0;
}
.formcreator_radios input[type = radio] + label:after {
top: 40%;
left: 9px;
width: 54px;
height: 54px;
background-color: rgba(50, 50, 50, 0.1);
transform: translate(-50%, -50%) scale(0);
}
.formcreator_radios input[type = radio]:checked + label:before {
box-shadow: inset 0 0 0 2px #E0E0E0;
}
.formcreator_radios input[type = radio]:checked + label:after {
transform: translate(-50%, -50%) scale(1);
-moz-animation: ripple 1s forwards;
-webkit-animation: ripple 1s forwards;
animation: ripple 1s forwards;
.formcreator_radios input[type = radio]:checked + label.label-radio .check {
border: 6px solid #727272;
border-radius: 50%;
transition: opacity 0.3s ease;
opacity: 1;
}


Expand Down
13 changes: 9 additions & 4 deletions inc/fields/radiosfield.class.php
Original file line number Diff line number Diff line change
Expand Up @@ -108,17 +108,22 @@ public function getRenderedHtml($canEdit = true) {
if ((trim($value) != '')) {
$i++;
$checked = ($this->value == $value) ? ['checked' => ''] : [];
$html .= '<p>';
$html .= '<div class="radio">';
$html .= '<span class="form-group-radio">';
$html .= Html::input($fieldName, [
'type' => 'radio',
'class' => 'form-control',
'id' => $domId . '_' . $i,
'value' => $value
] + $checked);
$html .= '<label for="' . $domId . '_' . $i . '">';
$html .= $value;
$html .= '<label class="label-radio" title="' . $value . '" for="' . $domId . '_' . $i . '">';
$html .= '<span class="box"></span>';
$html .= '<span class="check"></span>';
$html .= '</label>';
$html .= '</p>';
$html .= '</span>';
$html .= '<label class="label-radio" title="' . $value . '" for="' . $domId . '_' . $i . '">';
$html .= '</label>';
$html .= '</div>';
}
}
$html .= '</div>';
Expand Down

0 comments on commit b600e76

Please sign in to comment.