iSWORD

.INCLUDE "m8def.inc"

;====================================================================
;
; AVR assembly template
;
; Author:	Muhannad Ajjan
; Created:	Tue Dec 8 2015
; Processor:	ATmega8
; Frequency:	1 MHz

iSWORD

div:not(#container){
	background: rgb(127,125,224);
	text-align: center;
	width: 46px;
	height: 46px;
	margin: 2px;
	font: 26px Helvetica;;
}

#container{

iSWORD

<textarea style="display:block" cols=42 rows=10 onkeyup="t=this;t.nextElementSibling.value=t.value.replace(/</g,'&amp;lt;').replace(/>/g,'&amp;gt;')"></textarea>
<textarea readonly onclick="t=this;t.focus();t.select();"></textarea>

iSWORD

<select name="project" onchange="t=this;n=t.nextElementSibling;if(t.value=='new')if(confirm('Add new '+t.name+'?')){n.style.display='inline-block'; n.name=t.name; t.name=''; t.style.display='none'; n.focus()}">
  <option value="new"><new project></option>
  <option selected>Project1</option>
  <option>Project2</option>
  <option>Project3</option>
  </select>
<input style="display:none">

iSWORD

<style>
  .select-editable { position:relative; background-color:white; border:solid grey 1px; width:120px; height:18px; }
  .select-editable select { position:absolute; top:0px; left:0px; font-size:14px; border:none; width:120px; margin:0; }
  .select-editable input { position:absolute; top:0px; left:0px; width:100px; padding:1px; font-size:12px; border:none; }
  .select-editable select:focus, .select-editable input:focus { outline:none; }
</style>

<div class="select-editable">
  <select tabindex="-1" onchange="this.nextElementSibling.value=this.value">
    <option value=""></option>

iSWORD

#o{
width: 200px;
height: 20px;
box-shadow: 0 0 1px gray;
}
#i{
background: -webkit-repeating-linear-gradient(-45deg, rgba(157,213,58,1) 0,rgba(161,213,79,1) 15,rgba(128,194,23,1) 16,rgba(124,188,10,1) 30);
height: 20px;
}