<?php /** * Form CSS */ $url = current_page_url(); $ipsum = elgg_view('developers/ipsum'); ?> <style> td, th {padding: 5px;} </style> <div class="elgg-page mal"> <?php echo elgg_view('theme_preview/header', $vars); ?> <h2>Form</h2> <form action="#"> <fieldset> <legend>Form legend</legend> <div> <label for="f1">Text input:</label> <?php echo elgg_view('input/text', array( 'name' => 'f1', 'id' => 'f1', 'value' => 'input text', )); ?> </div> <div> <label for="f2">Password input:</label> <?php echo elgg_view('input/password', array( 'name' => 'f2', 'id' => 'f2', 'value' => 'password', )); ?> </div> <div> <label for="f3">Radio input:</label><br /> <?php echo elgg_view('input/radio', array( 'name' => 'f3', 'id' => 'f3', 'options' => array('a' => 1, 'b' => 2), )); ?> </div> <div> <label for="f4">Checkboxes input:</label><br /> <?php echo elgg_view('input/checkboxes', array( 'name' => 'f4', 'id' => 'f4', 'options' => array('a' => 1, 'b' => 2), )); ?> </div> <div> <label for="f5">Dropdown input:</label><br /> <?php echo elgg_view('input/dropdown', array( 'name' => 'f5', 'id' => 'f5', 'options' => array('option 1', 'option 2'), )); ?> </div> <div> <label for="f6">Access input:</label> <?php echo elgg_view('input/access', array( 'name' => 'f6', 'id' => 'f6', 'value' => ACCESS_PUBLIC, )); ?> </div> <div> <label for="f7">File input:</label> <?php echo elgg_view('input/file', array( 'name' => 'f7', 'id' => 'f7', )); ?> </div> <div> <label for="f8">URL input:</label> <?php echo elgg_view('input/url', array( 'name' => 'f8', 'id' => 'f8', 'value' => 'http://elgg.org/', )); ?> </div> <div> <label for="f9">Tags input:</label> <?php echo elgg_view('input/tags', array( 'name' => 'f9', 'id' => 'f9', 'value' => 'one, two, three', )); ?> </div> <div> <label for="f10">Email input:</label> <?php echo elgg_view('input/email', array( 'name' => 'f10', 'id' => 'f10', 'value' => 'noone@elgg.org', )); ?> </div> <div> <label for="f11">Autocomplete input:</label> <?php echo elgg_view('input/autocomplete', array( 'name' => 'f11', 'id' => 'f11', 'match_on' => 'users', )); ?> </div> <div> <label for="f12">Date picker input:</label> <?php echo elgg_view('input/datepicker', array( 'name' => 'f12', 'id' => 'f12', )); ?> </div> <div> <label for="f13">User picker input:</label> <?php echo elgg_view('input/userpicker', array( 'name' => 'f13', 'id' => 'f13', )); ?> </div> <div> <label for="f14">Long text input:</label> <?php echo elgg_view('input/longtext', array( 'name' => 'f14', 'id' => 'f14', 'value' => $ipsum, )); ?> </div> <div> <label for="f15">Plain text input:</label> <?php echo elgg_view('input/plaintext', array( 'name' => 'f15', 'id' => 'f15', 'value' => $ipsum, )); ?> </div> </fieldset> </form> <div class="mtl"> <h2>Buttons</h2> <table> <thead> <tr> <th>Anchors</th> <th>Default</th> <th>Hover</th> <th>Focus</th> <th>Active</th> <th>Disabled</th> <th>Selected</th> </tr> </thead> <tbody> <tr> <th>Default</th> <td><a href="#" class="elgg-button">anchor</a></td> <td><a href="#" class="elgg-button elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-state-disabled">anchor</a></td> <td><a href="#" class="elgg-button elgg-state-selected">anchor</a></td> </tr> <tr> <th>Action</th> <td><a href="#" class="elgg-button elgg-button-action">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-action elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-action elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-action elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-action elgg-state-disabled">anchor</a></td> </tr> <tr> <th>Cancel</th> <td><a href="#" class="elgg-button elgg-button-cancel">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-cancel elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-cancel elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-cancel elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-cancel elgg-state-disabled">anchor</a></td> </tr> <tr> <th>Submit</th> <td><a href="#" class="elgg-button elgg-button-submit">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-submit elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-submit elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-submit elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-submit elgg-state-disabled">anchor</a></td> </tr> <tr> <th>Special</th> <td><a href="#" class="elgg-button elgg-button-special">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-special elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-special elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-special elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-special elgg-state-disabled">anchor</a></td> </tr> <tr> <th>Delete</th> <td><a href="#" class="elgg-button elgg-button-delete">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-delete elgg-state-hover">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-delete elgg-state-focus">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-delete elgg-state-active">anchor</a></td> <td><a href="#" class="elgg-button elgg-button-delete elgg-state-disabled">anchor</a></td> </tr> </tbody> </table> </div> </div>