Radio Box

adio box can be used for making clear and distinctive labels with more information. radio box does not require additional css and JavaScript apart from atmos defaults.

<div class="option-box">
    <input id="radio-new1" name="bigradios" type="radio">
    <label for="radio-new1">
         <span class="radio-content">
                  <span class="h6 d-block">Starter Plan
                      <span class="badge-soft-primary badge">$12 MONTH</span>
                  </span>
                   <span class="text-muted d-block m-b-10">
                                                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium blanditiis ducimus ipsa provident quae quaerat similique? Consequatur consequuntur cum, inventore nihil porro quis. Ad assumenda eligendi illum impedit quis totam.
                   </span>
         </span>
    </label>
</div>

Radio box Columns

Radio box Column is similar to radio-box with a slight variation

<div class="option-box-column">
				<input id="radio-column-1" name="column-radio" type="radio">
				<label for="radio-column-1">
					<span class="radio-content">
						<span class="p-all-15 d-block">
							<span class="h3 d-block">$15</span>
							<span class="list-group">
								<span class="list-group-item">Cras justoodio</span>
								<span class="list-group-item">Dapibus ac facilisis in</span>
								<span class="list-group-item">Morbi leo risus</span>
								<span class="list-group-item">Vestibulum ateros</span>
							</span>
						</span>
						<span class="radio-highlight">Basic Plan</span>
					</span>
				</label>
</div>

Last updated