Skip to content

GitLab

Commit 6a6e578c authored by ferhat tamer's avatar ferhat tamer 💬
Browse files

Initial commit

parents
Hide whitespace changes
Inline Side-by-side
admin.jpg 0 → 100644
View file @ 6a6e578c
admin.jpg

17.5 KB

divolustur.html 0 → 100644
View file @ 6a6e578c
<!DOCTYPE html>
<html lan="tr">
<head>
<meta charset="utf-8">
<title> DİV OLUŞTURMA </title>
<script src="divolustur.js">
</script>
</head>
<body>
<form action="" style="background:yellow; width:500px;" >
<table>
<tr>
<td width="200" height="30">Genişlik</td>
<td width="300"><input name="" type="text" id="genislik" placeholder="0"/></td>
</tr>
<tr>
<td width="200" height="30">Yükseklik</td>
<td width="300"><input name="" type="text" id="yukseklik" placeholder="0"/></td>
</tr>
<tr>
<td width="200" height="30">Kenar kalınlığı</td>
<td width="300" ><select name="" id="kenarkalinlik">
<option>Bir çizgi kalınlığı seçiniz.</option>
<option value="2px">2px</option>
<option value="3px">3px</option>
<option value="4px">4px</option>
<option value="5px">5px</option>
<option value="10px">10px</option>
<option value="15px">15px</option>
<option value="20px">20px</option>
<option value="30px">30px</option>
<option value="50px">50px</option>
<select></td>
</tr>
<tr>
<td width="200" height="30">Kenar tipi</td>
<td width="300"><select name="" id="kenartipi">
<option>Bir kenarlık tipi seçiniz.</option>
<option value="solid">solid</option>
<option value="dashed">dashed</option>
<option value="dotted">dotted</option>
<option value="double">double</option>
</select></td>
</tr>
<tr>
<td width="200" height="30">Kenar rengi</td>
<td width="300"><select name="" id="kenarrengi">
<option>Bir kenarlık rengi seçiniz.</option>
<option value="black">siyah</option>
<option value="white">beyaz</option>
<option value="red">kırmızı</option>
<option value="blue">mavi</option>
<option value="darkblue">lacivert</option>
<option value="turquoise">turkuaz</option>
<option value="green">yeşil</option>
<option value="orange">turuncu</option>
<option value="brown" >kahverengi</option>
<option value="yellow">sarı</option>
<option value="purple">mor</option>
<option value="pink">pembe</option>
</select></td>
</tr>
<tr>
<td width="200" height="30">Arka plan rengi</td>
<td width="300"><select name="" id="arkarenk">
<option>Bir arkaplan rengi seçiniz.</option>
<option value="black">siyah</option>
<option value="white">beyaz</option>
<option value="red">kırmızı</option>
<option value="blue">mavi</option>
<option value="darkblue">lacivert</option>
<option value="turquoise">turkuaz</option>
<option value="green">yeşil</option>
<option value="orange">turuncu</option>
<option value="brown" >kahverengi</option>
<option value="yellow">sarı</option>
<option value="purple">mor</option>
<option value="pink">pembe</option>
</select>
</select></td>
</tr>
<tr>
<td width="200" height="30">Ovallik</td>
<td width="300"><select name="" id="ovallik">
<option>Ovallik miktarı seçiniz.</option>
<option value="3px">3px</option>
<option value="5px">5px</option>
<option value="10px">10px</option>
<option value="15px">15px</option>
<option value="50px">50px</option>
<option value="100px">100px</option>
<option value="180px">180px</option>
<option value="360px">360px</option>
</select></td>
</tr>
<tr>
<td witd ="200" height="30">Seçim yap</td>
<td width="300">
<input name="" type="button" value="sıfırla" onclick="window.location.href ='divolustur.html';">
<input name="" type="button" value="oluştur" onclick="kutuyarat()">
<input name="" type="button" value="random renk üret" style="background-image:linear-gradient(120deg,green,blue,black); color:white"; onclick="window.location.href ='renkuret.html'; "/></td>
</tr>
</table>
</form>
<br/><br/><br/>
<div id="kutu"></div>
</body>
</html>
\ No newline at end of file
divolustur.js 0 → 100644
View file @ 6a6e578c
function kutuyarat(){
document.getElementById("kutu").style.width=document.getElementById("genislik").value+"px";
document.getElementById("kutu").style.height=document.getElementById("yukseklik").value+"px";
document.getElementById("kutu").style.borderWidth=document.getElementById("kenarkalinlik").value;
document.getElementById("kenarkalinlik").style.borderWidth=document.getElementById("kenarkalinlik").value;
document.getElementById("kutu").style.borderStyle=document.getElementById("kenartipi").value;
document.getElementById("kenartipi").style.borderStyle=document.getElementById("kenartipi").value;
document.getElementById("kutu").style.borderColor=document.getElementById("kenarrengi").value;
document.getElementById("kenarrengi").style.borderColor=document.getElementById("kenarrengi").value;
document.getElementById("kutu").style.backgroundColor=document.getElementById("arkarenk").value;
document.getElementById("arkarenk").style.backgroundColor=document.getElementById("arkarenk").value;
document.getElementById("kutu").style.borderRadius=document.getElementById("ovallik").value;
}
\ No newline at end of file
giris.html 0 → 100644
View file @ 6a6e578c
<!DOCTYPE html>
<html lang="en">
<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>Admin Panel Giriş</title>
<link rel="stylesheet" href="style.css">
<script src="giris.js">
</script>
</head>
<body>
<div class="kutu">
<div class="contact-form">
<img src="admin.jpg" class="adminimg">
<h2>Giriş Yap</h2>
<form>
<div class="txtb">
<input id="kullaniciAdi" type="text" placeholder="Username" >
</div>
<div class="txtb">
<input id="sifre" type="password" placeholder="Password">
</div>
<input type="button" class="logbtn" value="Login" onclick="giris()">
<br><input type="button" class="logbtn" value="Sign" onclick="window.location.href ='kayıtol.html';">
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
giris.js 0 → 100644
View file @ 6a6e578c
function giris()
{
var kullanici=document.getElementById("kullaniciAdi").value;
var sfr=document.getElementById("sifre").value;
if(kullanici=="admin" && sfr=="123")
{
alert("Giriş Başarılı :)");
window.location.href=window.location.href='divolustur.html';
}
else{
alert("Giriş Başarısız!!");
}
}
kayıtol.html 0 → 100644
View file @ 6a6e578c
<!DOCTYPE html>
<html lang="en">
<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>Admin Panel Giriş</title>
<link rel="stylesheet" href="style.css">
<script src="giris.js">
</script>
</head>
<body>
<div class="kutu">
<div class="contact-form">
<img src="admin.jpg" class="adminimg">
<h2>Kayıt Ol</h2>
<form action="">
<div class="txtb">
<input type="text" placeholder="İsim" id="isim" required="" />
<input type="text" placeholder="Soyisim " id="sisim" required="" />
<input type="text" placeholder="Kullanıcı Adı" id="kadi" required="" />
<input type="email" placeholder="E-posta adresi" id="eposta" required=""/>
<input type="password" placeholder="Şifre" id="kayitSifre" required=""/>
</div>
<input type="button" class="logbtn" value="Sign"/>
<br><input type="button" class="logbtn" value="Login" onclick="window.location.href ='giris.html';"/>
</form>
</div>
</div>
</body>
</html>
\ No newline at end of file
renkuret.css 0 → 100644
View file @ 6a6e578c
body{
box-sizing:border-box;
color:black;
font-weight:700;
font-family:sans-serif;
font-size:1.5rem;
padding:0;
margin:0;}
#kutu{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
height:100vh;
width:100%;
}
#button{
background-color:white;
cursor:pointer;
border-radius:7px;
user-select: none;
border:5px solid black;
}
#button:hover{
background-color:yellow;
}
#kutu input[type="button"]{
background: white;
margin-top: 10px;
}
#cikis,
#button{
padding:2rem;
}
renkuret.html 0 → 100644
View file @ 6a6e578c
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Renk Kodu Üret</title>
<link rel="stylesheet" href="renkuret.css">
<script src="renkuret.js">
</script>
</head>
<body>
<div id="kutu">
<div id="button" onclick="uret();">
Random Renk Üret
</div>
<div id="cikis"></div>
<input type="button" name="" value="div olustura git" onClick="window.location.href='divolustur.html'"/>
<input type="button" name="" value="Çıkış Yap" onClick="window.location.href='giris.html'"/>
</div>
</body>
</html>
\ No newline at end of file
renkuret.js 0 → 100644
View file @ 6a6e578c
function uret(){
var sayilar=
["0","1","2","3","4","5","6","7","8","9"];
var yeniRenk="#";
var x=0;
while(x<6){
var y=Math.round(Math.random()*9);
var z=sayilar[y];
yeniRenk = yeniRenk+z;
x++;
}
document.getElementById("kutu").style.backgroundColor=yeniRenk;
document.getElementById("cikis").innerHTML=yeniRenk;
}
\ No newline at end of file
server.js 0 → 100644
View file @ 6a6e578c
const http = require('http')
const fs=require('fs')
const server =http.createServer((req,res)=>{
console.log(req.url,req.method);
fs.readFile('./giris.html',(err,data)=>{
if(err){
console.log(err);
res.end()
}else{
res.end(data)
}
})
})
server.listen(8080,'localhost',()=>{
console.log('3000 portu dinleniyor');
})
style.css 0 → 100644
View file @ 6a6e578c
*{
margin:0;
padding: 0;
text-decoration: none;
font-family: sans-serif;
box-sizing: border-box;
}
body{
background-image:linear-gradient(120deg,black,gray,white);/*karışık renk ekleme renkleri derece cinsinden karıştırarak basar*/
min-height: 100vh;/*yükseklik*/
}
.kutu{
width: 400px;
background: white;
height: 700px;
padding: 80px 40px;/*sağdan soldan 40px yukarıdan aşağıdan 80 px padding*/
border-radius: 10px;/*köşleri ovalleştirme*/
position: absolute;
left: 50%;/*soldan hizalama*/
top: 50%;/*yukarıdan hizalama*/
transform: translate(-50%,-50%);/*tam hizalama sağlamak için*/
}
.txtb{
/*alt çizgi ekleme*/
position: relative;
margin: 30px 0;
}
.txtb input{
font-size: 15px;
color:#333;
border: none;
width: 100%;
outline: none;
background: none;
padding: 0 5px;
height: 40px;
border-bottom: 2px solid #adadad;
}
img.adminimg{
margin-left: 85px;
margin-bottom: 50px;
display: block;
background: black;
border-radius: 25%;
width: 140px;
height: 140px;
}
.logbtn{
display: block;
width: 100%;
height: 50px;
border: none;
background-image:linear-gradient(120deg,black,gray,white);
background-size: 200%;
color: white;
outline: none;/*köşelerini kapatmak siyah olmamsı için*/
cursor: pointer;
border-radius:15px;
}
.logbtn:hover{
background:white;
color:black;
border:2px solid black;
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment