45 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Svelte
		
	
	
	
	
	
			
		
		
	
	
			45 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			Svelte
		
	
	
	
	
	
| <script>
 | |
|     import Island from "$lib/islands/island.svelte";
 | |
|     export let variables = {
 | |
|         title: "Uninitialised",
 | |
|         action: "/",
 | |
|         placeholder: "Uninitialised",
 | |
|         queryName: "uninitiailsed"
 | |
|     };
 | |
| </script>
 | |
| 
 | |
| <Island {variables}>
 | |
| <form action={variables.action}>
 | |
|     <input class="form-input" type="text" id="input-headcode" name={variables.queryName} placeholder={variables.placeholder}>
 | |
|     <br>
 | |
|     <button type="submit">Submit</button>
 | |
| </form>
 | |
| </Island>
 | |
| 
 | |
| <style>
 | |
|     .form-input {
 | |
|         width: 75%;
 | |
|         height: 32px;
 | |
|         margin-top: 5px;
 | |
|         margin-bottom: 5px;
 | |
|         border-radius: 50px;
 | |
|         border: none;
 | |
|         text-align: center;
 | |
|         font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 | |
|         text-transform: uppercase;
 | |
|         font-size: 15px;
 | |
|     }
 | |
|     button {
 | |
|         width: 50%;
 | |
|         margin-bottom: 5px;
 | |
|         margin-top: 5px;
 | |
|         border: none;
 | |
|         border-radius: 20px;
 | |
|         padding: 5px;
 | |
|         font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 | |
|         font-size: 16px;
 | |
|         font-weight: 400;
 | |
|         background-color: var(--main-bg-color);
 | |
|         color: var(--link-color);
 | |
|     }
 | |
| </style> |