This is an example of a bootstrap survey form which includes buttons and radio buttons, designed using HTML and CSS. The radio buttons in the same group are given the same name to avoid selecting multiple buttons at the same time. There are five types of radio buttons; Very Good, Good, Mediocre, Bad, and Very Bad which are assigned its color code. Very Good buttons are given a background and a border color of #2e7d32, Good are given a border and a background color of #64dd17, Mediocre are given a color of #ffea00, Bad are given the color of #ff9800 whereas Very Bad are given the background and border color of #d50000.
Models are dialog box /popup that is displayed on top of the current page. This can be used to show any important message or any information. This snippet is an example of showing more information on the clicked object. It is a simple example of buttons to show the model. Here the buttons are having the image out planets and styled using CSS. A click on any button or image displays model with the information of planets. To open the model set the data-target to model to be opened. To create a Model you need to define the model class with a dialog containing, header, body, and footer if needed and id as a reference to a button click. A close button dismisses button can be seen at the bottom and at top of the model. You can use this snippet to display the information in dialogue in the form of Model. You can style the model accordingly.