JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/css/materialize.min.css">
<style>
.card-image {
padding: 15px;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.99.0/js/materialize.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<div class="container" id="container">
<a class="waves-effect waves-light btn" href="#modal1">Dodaj postavko</a>
<!-- Modal Structure -->
<div id="modal1" class="modal modal-fixed-footer">
<div class="modal-content">
<div class="input-field col l7">
<input placeholder="" id="opis" type="text" class="validate">
<label for="date">Opis postavke</label>
</div>
<div class="input-field col l3">
<input placeholder="" id="cena" type="text" class="validate">
<label for="date">Cena</label>
</div>
<div class="input-field col l2">
<input placeholder="" id="kosi" type="text" class="validate">
<label for="date">Št. kosov</label>
</div>
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close waves-effect waves-red btn-flat">Prekini</a>
<a...