Glanum DNA Forms™

Required files

Include the DNA Forms stylesheet, that all.

<head>
    <link type="text/css" rel="stylesheet" href="DNAForms/css/style.css" />
    ...
</head>

You can also include Bootstrap3 framework and stylesheets to customize appearence.

<head>
    <!-- stylesheets -->
    <link type="text/css" rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css" />
    <link type="text/css" rel="stylesheet" href="DNAForms/css/style.css" />
    ...
</head>
<body>
    ...
    <!-- javascripts -->
    <script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js" ></script>
    <script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js" ></script>
    ...
</body>

Markup

DNA Forms use simple HTML markup structure :

<form action="" method="post">
    <fieldset class="dnaf_fieldset">
        <legend>Fieldset legend</legend>
        <div class="dnaf_row">
            <label>Field label</label>
            <input type="text" />
        </div>
    </fieldset>
</form>