jQuery mobile LOG IN page

by katalin_2003

HTML

<script src="https://d10ajoocuyu32n.cloudfront.net/codiqa.ext.js"></script>
<script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<div data-role="page" id="page1">
    <div data-theme="b" data-role="header" data-position="fixed">
        <h3>
            TITLE
        </h3>
    </div>
    <div data-role="content">
        <div data-role="fieldcontain">
            <label for="textinput1">
                Identifient:
            </label>
            <input name="" id="textinput1" placeholder="Identifient" value="" type="text" data-mini="true">
        </div>
        <div data-role="fieldcontain">
            <label for="textinput2">
                Mot de passe:
            </label>
            <input name="" id="textinput2" placeholder="Mot de passe" value="" type="text" data-mini="true">
        </div>
		<br /><br /><br />
        <input type="submit" data-theme="b" value="LOG IN ">
    </div>
    <div data-theme="h" data-role="footer" data-position="fixed">
        <h3>
            © csa
        </h3>
    </div>
</div>

CSS

.ui-bar-a {
    border:1px solid #333;
    background:#111;
    color:#fff;
    font-weight:700;
    text-shadow:0 -1px 0 #000;
    background-image:-webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#111));
    background-image:-webkit-linear-gradient(#3c3c3c, #111);
    background-image:-moz-linear-gradient(#3c3c3c, #111);
    background-image:-ms-linear-gradient(#3c3c3c, #111);
    background-image:-o-linear-gradient(#3c3c3c, #111);
    background-image:linear-gradient(#3c3c3c, #111)
}
.ui-bar-a, .ui-bar-a input, .ui-bar-a select, .ui-bar-a textarea, .ui-bar-a button {
    font-family:Helvetica, Arial, sans-serif
}
.ui-bar-a .ui-link-inherit {
    color:#fff
}
.ui-bar-a a.ui-link {
    color:#7cc4e7;
    font-weight:700
}
.ui-bar-a a.ui-link:visited {
    color:#2489ce
}
.ui-bar-a a.ui-link:hover {
    color:#2489ce
}
.ui-bar-a a.ui-link:active {
    color:#2489ce
}
.ui-body-a, .ui-overlay-a {
    border:1px solid #444;
    background:#222;
    color:#fff;
    text-shadow:0 1px 0 #111;
    font-weight:400;
    background-image:-webkit-gradient(linear, left top, left bottom, from(#444), to(#222));
    background-image:-webkit-linear-gradient(#444, #222);
    background-image:-moz-linear-gradient(#444, #222);
    background-image:-ms-linear-gradient(#444, #222);
    background-image:-o-linear-gradient(#444, #222);
    background-image:linear-gradient(#444, #222)
}
.ui-overlay-a {
    background-image:none;
    border-width:0
}
.ui-body-a, .ui-body-a input, .ui-body-a select, .ui-body-a textarea, .ui-body-a button {
    font-family:Helvetica, Arial, sans-serif
}
.ui-body-a .ui-link-inherit {
    color:#fff
}
.ui-body-a .ui-link {
    color:#2489ce;
    font-weight:700
}
.ui-body-a .ui-link:visited {
    color:#2489ce
}
.ui-body-a .ui-link:hover {
    color:#2489ce
}
.ui-body-a .ui-link:active {
    color:#2489ce
}
.ui-btn-up-a {
    border:1px solid #111;
    background:#333;
    font-weight:700;
    color:#fff;
    text-shadow:0 1px 0 #111;
   ...