wuestgr61132/mdt5-2-webapp
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

raw website

Browse Source 
- open form with button
- some styling
This commit is contained in:
Gregor Wüst 2020-05-21 17:57:03 +02:00
parent e7a34b32cb
commit 029d2276fa
3 changed files with 65 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
css/notes_app.css
View File

@ -1,3 +1,37 @@
h1 { body{
color:green background-color:#f9f5f4;
} columns:#555555;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
}
#mainHeader h1{
margin:0;
padding:2.5px;
}
#mainHeader h6{
margin-top:0;
padding:2.5px;
}
#noteFormDiv{
display: none;
}
#noteForm{
padding:5px;
margin-top:2px;
display: inline-block;
border:1px black solid;
}
#memo{
width: 300px;
height: 150px;
box-sizing: border-box;
}
#input1{
margin-bottom:5px;
}

25
html/index.html
View File

@ -4,11 +4,32 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> <title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="/scripts/notes_app.js"></script> <script src="/scripts/notes_app.js"></script>
<link rel="stylesheet" href="/css/notes_app.css" type="text/css"> <link rel="stylesheet" href="/css/notes_app.css" type="text/css">
</head> </head>
<body> <body>
<h1>Hello World</h1> <div id=mainHeader>
<p>Whats the matter ?</p> <h1>
Quick Notes
</h1>
<h6>
A sample note web app to demonstrate the usage of Promises/Async/Await.
</h6>
</div>
<div id=addNoteDiv>
<button type="button" id=addNote>+</button>
</div>
<div id=noteFormDiv>
<form id=noteForm>
<input type="text" name="noteTitle" id="input1" placeholder="Enter title...">
<div>
<textarea name=noteText id=memo placeholder="Enter notes..."></textarea>
</div>
<button type="button" id=saveNote>Save</button>
</form>
</div>
</body> </body>
</html> </html>

10
scripts/notes_app.js
View File

@ -1,5 +1,5 @@
function test() { $(document).ready(function(){
alert("Test something"); $("#addNoteDiv").on('click', function() {
} $("#noteFormDiv").toggle()
})
console.log("Hello") })