github.com/EngineerKamesh/gofullstack@v0.0.0-20180609171605-d41341d7d4ee/volume3/section1/basics/templates/basics.html (about)

     1  <head>
     2  	<title>Basics</title>	
     3  	<link rel="stylesheet" type="text/css" href="/static/css/style.css">
     4  	<link rel="icon" type="image/png" href="/static/images/isomorphic_go_icon.png">
     5  	<link rel="stylesheet" href="/static/css/pure-min.css">
     6  	<script src="/static/js/client.js" type="text/javascript"></script>
     7  </head>
     8  <body>
     9  
    10  
    11  <h1>GopherJS Front-End Examples</h1>
    12  
    13  <div class="example">
    14  <form class="pure-form">
    15  	<fieldset class="pure-group">
    16  
    17  	<h2>Example: Display Alert Message</h2>
    18  	</fieldset>
    19  	<fieldset class="pure-control-group">
    20  	<label for="messageInput">Alert Message: </label>
    21  	<input id="messageInput" type="text" value="Hello Gopher!" />
    22  	</fieldset>
    23  	<fieldset class="pure-group">
    24  
    25  	<button id="alertMessageJSGlobal" type="button" class="pure-button pure-button-primary">Display Alert Message using js.Global</button>
    26  	<button id="alertMessageDOM" type="button" class="pure-button pure-button-primary">Display Alert Message using dom package</button>
    27  </fieldset>
    28  </form>
    29  </div>
    30  
    31  <div class="example">
    32  	<form class="pure-form">
    33  	<fieldset class="pure-group">
    34  		<h2>Example: Change An Element's CSS Style Property</h2>
    35  	</fieldset>
    36  	<fieldset class="pure-group" style="min-height: 272px">
    37  		<img id="isomorphicGopher" border="0" src="/static/images/isomorphic_go_logo.png">
    38  	</fieldset>
    39  	<fieldset class="pure-group">
    40  		<button id="showGopher" type="button" class="pure-button pure-button-primary">Show Gopher</button>
    41  		<button id="hideGopher" type="button" class="pure-button pure-button-primary">Hide Gopher</button>
    42  	</fieldset>
    43  	</form>
    44  </div>
    45  
    46  <div class="example">
    47  	<h2>Example: JavaScript Builtin Functionality for typeof operation</h2>
    48  	<button id="builtinDemoButton" type="button" class="pure-button pure-button-primary">Builtin Demo</button>
    49  </div>
    50  
    51  <div class="example">
    52  	<form class="pure-form">
    53  	<fieldset class="pure-group">
    54  		<h2>Example: XHR Post</h2>
    55  	</fieldset>
    56  	<fieldset class="pure-control-group">
    57  		<label for="textToLowercase">Enter Text to Lowercase: </label>
    58  		<input id="textToLowercase" type="text" placeholder="Enter some text here to lowercase." value="GopherJS" />
    59  	</fieldset>
    60  	<fieldset class="pure-group">
    61  		<button id="lowercaseTransformButton" type="button" class="pure-button pure-button-primary">Lowercase It!</button>
    62  	</fieldset>
    63  	</form>
    64  </div>
    65  
    66  </body>
    67  </html>