Wie erhalte ich in der konfigurierbaren Liste die selbe CSS wie das Standard Template

formdesigner458

Asked on June 9, 2021 at 6:00 AM

Hallo,
können Sie mir die aktuelle CSS für die konfigurierbare Liste schicken, sodass es es übereinstimmt mit der Standard CSS.
Es sollten die Felder der Liste, auf dieselbe Breite, Höhe und Design matchen.

Zusätzlich springt der Bootstrap Schalter jedesmal an den Rand wenn er angeklickt wird. Dies möchte ich gerne fixen und den Schalter statisch am Rand haben. Die CSS dafür benötige ich ebenfalls.

Page URL: https://form.jotform.com/211593008735354
Nikola JotForm Support

Replied on June 9, 2021 at 8:15 AM

Please add the following CSS code in the Configurable List widget:
input.translatable, input.stepper {
  height: 38px;
  width:290px!important;
  border-color: rgba(18, 69, 141, 0.75);
}
Related Guide: How to Inject CSS Codes to Widgets
Result:
I created a new thread for your other issue: https://www.jotform.com/answers/3149773
formdesigner458

Replied on June 9, 2021 at 9:41 AM

Thank you, it works fine! Could you also share the CSS to customize the "+" Button and the "-" Button
formdesigner458

Replied on June 9, 2021 at 10:02 AM

Have you an idea how I can get this list responsible and the Number Input with the same size?
Nikola JotForm Support

Replied on June 9, 2021 at 11:46 AM

You can increase the size adn add border color to add and remove buttons with this CSS code:
.add, .remove {
  height: 30px;
  border-color: rgba(18, 69, 141, 0.75);
}
To resolve the other 2 issues add this CSS code as well:
input.translatable, input.stepper {
  font-size: 15px!important;
  padding-left: 10px;
}
@media screen and (max-width:480px) {
   input.translatable, input.stepper {
   width:250px!important;
}
}
Result: