Compare commits
No commits in common. "main" and "master" have entirely different histories.
|
@ -1,26 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="hu">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Jegyzettömb</title>
|
|
||||||
<script src="script.js" defer></script>
|
|
||||||
<link rel="stylesheet" href="style.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1>Jegyzettömb</h1>
|
|
||||||
<div id="notes"></div>
|
|
||||||
<div id="addnotes">
|
|
||||||
<p>
|
|
||||||
<label for="inphead">Add meg a címet: </label><input type="text" id="inphead" name="inphead"><br>
|
|
||||||
<label for="inptext">Add meg a szöveget: </label><br><textarea name="inptext" id="inptext" rows="5" cols="50"></textarea><br>
|
|
||||||
<label for="notecolor">Jegyzet színe: </label><br><input type="color" id="notecolor" name="notecolor" value="#FF00FF"><br>
|
|
||||||
<button id="addbtn">Jegyzet hozzáadása</button>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div id="msg">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,40 +0,0 @@
|
||||||
const button = document.getElementById("addbtn")
|
|
||||||
const notes = document.getElementById("notes")
|
|
||||||
const msg = document.getElementById("msg")
|
|
||||||
let idnum = 1
|
|
||||||
|
|
||||||
|
|
||||||
button.addEventListener("click", ()=>{
|
|
||||||
let inphead = document.getElementById("inphead")
|
|
||||||
let inptext = document.getElementById("inptext")
|
|
||||||
console.log(inphead.value);
|
|
||||||
if (inphead.value != "" && inptext.value != ""){
|
|
||||||
let newnote = document.createElement("div")
|
|
||||||
newnote.innerHTML = `<h3>${inphead.value}</h3>`
|
|
||||||
newnote.innerHTML += `<p>${inptext.value}<p>`
|
|
||||||
newnote.classList.add("notescss")
|
|
||||||
newnote.setAttribute("id", `note-${idnum++}`)
|
|
||||||
newnote.setAttribute("title", "Kattintásra törölheted a jegyzetedet...")
|
|
||||||
newnote.style.background = document.getElementById("notecolor").value
|
|
||||||
notes.appendChild(newnote)
|
|
||||||
msg.innerHTML = ""
|
|
||||||
msg.innerHTML = "<i>Üzenet hozzáadva!</i>"
|
|
||||||
inphead.value = ""
|
|
||||||
inptext.value = ""
|
|
||||||
|
|
||||||
newnote.onclick = function(){
|
|
||||||
this.parentElement.removeChild(this)
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
notes.appendChild(newnote)
|
|
||||||
|
|
||||||
msg.innerHTML = '<span class="msgok">Üzenet hozzáadva!</span'
|
|
||||||
inphead.value = ""
|
|
||||||
inptext.value = ""
|
|
||||||
|
|
||||||
} else{
|
|
||||||
msg.innerHTML = '<span class="msgerr">Töltsd ki a hiányzó mezőket!</span'
|
|
||||||
}
|
|
||||||
|
|
||||||
})
|
|
|
@ -1,36 +0,0 @@
|
||||||
body{
|
|
||||||
background: linear-gradient(to right, hsl(130, 50%, 40%), hsl(150, 40%, 40%));
|
|
||||||
}
|
|
||||||
|
|
||||||
.notescss{
|
|
||||||
background-color: aqua;
|
|
||||||
width: 250px;
|
|
||||||
height: auto;
|
|
||||||
margin: 10px;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.notescss h3{
|
|
||||||
margin-top: 2px;
|
|
||||||
margin-bottom: 2px;
|
|
||||||
margin-left: 5x;
|
|
||||||
border-bottom: 1px solid black;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.notescss p{
|
|
||||||
margin-top: 5px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.msgerr{
|
|
||||||
color: white;
|
|
||||||
background-color: red;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.msgok{
|
|
||||||
color: white;
|
|
||||||
background-color: green;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user