[ยื่นขอเปิดห้องทดลองโค้ต]
<!-- Font Awesome for icons --><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
.jupiter-container {
display: flex;
flex-direction: column;
width: 100%;
height: 140vh;
background-color: #f7f5ef;
justify-content: center;
align-items: center;
}
.olympus-content {
display: flex;
justify-content: center;
align-items: center;
padding: 2rem;
background-color: #f7f5ef;
position: relative;
width: 100%;
height: 100%;
}
.romanus-scroll-container {
position: relative;
width: 80%; /* Adjusted for better responsiveness */
height: auto;
border-radius: 12px;
box-shadow: 0 10px 25px rgba(0,0,0,0.15);
background-color: transparent; /* Changed to transparent to let image background show */
padding: 0;
display: flex;
justify-content: center;
align-items: center;
}
.romanus-scroll-container img {
width: 100%;
height: auto;
object-fit: contain; /* Ensure image scales properly */
}
.divine-text-overlay {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
color: #4b4b4b;
font-family: 'Times New Roman', serif;
font-size: clamp(0.8rem, 2vw, 1.25rem); /* Use clamp for fluid typography */
line-height: 1.5;
width: 50%; /* Constrain text width to prevent overflow */
overflow-wrap: break-word; /* Ensure long words don't overflow */
}
.divine-text-overlay h1 {
font-size: clamp(1rem, 3vw, 1.75rem); /* Use clamp for fluid typography */
font-weight: bold;
margin-bottom: 0.5rem;
}
.divine-text-overlay p {
font-size: clamp(0.7rem, 1.5vw, 1rem); /* Use clamp for fluid typography */
margin: 0;
}
</style>
<div class="jupiter-container rounded-lg shadow-xl">
<!-- Main Content -->
<main class="olympus-content">
<div class="romanus-scroll-container">
<img src="https://i.imgur.com/rHrhUvi.png" alt="Ancient Scroll">
<div class="divine-text-overlay">
<h1>ห้องนี้สำหรับใช้ลองโค้ตเท่านั้น</h1><div>ห้ามฝากเนื้อหาสำคัญใด ๆ ไว้ในห้องนี้</div><div>โปรดเก็บรักษาเนื้อหาที่จะใช้งานใน Google Docs</div><div>หรือบนคอมพิวเตอร์เสมอ</div><div><br></div><div>แบบฟอร์มขอรับกระทู้ทดลองโค้ต</div><div>ชื่อเต็ม:</div><div>Username:</div><div>ชื่อกระทู้ทดลองโค้ต:</div><div><br></div><div>เทมเพลต Code html หน้าปก: (แนบใส่กล่องโค้ต)</div><div><br></div><div>เมื่อได้รับอนุมัติจะปรากฎกระทู้ทดลองโค้ตส่วนตัวที่ <a href="https://percyjackson.mooorp.com/forum/140/1">[ห้องทดลองโค้ต</a>] </div>
</div>
</div>
</main>
</div>
แบบฟอร์มขอรับกระทู้ทดลองโค้ต
ชื่อเต็ม: Moneka Marantear BlossomUsername: Monekaชื่อกระทู้ทดลองโค้ต: [ห้องทดลองโค้ด] สมุดทดลองโค้ดโง่ ๆ ของ มนกเทมเพลต Code html หน้าปก:
<div style="text-align: center;"><font face="TH SarabunPSK" size="6" color="#9932cc"><b><i>สมุดโง่ ๆ ของ มนก </i></b></font></div>
แบบฟอร์มขอรับกระทู้ทดลองโค้ดชื่อเต็ม: แมคเคนซี คลอดด์ ลินคอล์นUsername: Mackenzieชื่อกระทู้ทดลองโค้ด: Mackenzie : ดินแดนพิศวง อย่าลืมพกยาดมก่อนเข้ามาเทมเพลต Code html หน้าปก:
<div class="bt1b-fondo" style="background:#0f1637;"><div class="bt1-baul" style="background:url('https://img2.pic.in.th/pic/testcode01.png')center; background-size:cover;"><div class="bt1baul-barra"><a bt-title="Expediente" href="#"><i class="fas fa-user-tie"></i></a><a bt-title="MP" href="#"><i class="fas fa-envelope"></i></a><a bt-title="Relaciones" href="#"><i class="fas fa-users"></i></a><a bt-title="Moodboard" href="#"><i class="fas fa-camera-retro"></i></a> <a bt-title="Playlist" href="#"><i class="fas fa-compact-disc"></i></a><a bt-title="Instagram" href="#"><i class="fab fa-instagram"></i></a><a bt-title="Twitter" href="#"><i class="fab fa-twitter"></i></a> </div><div class="bt1baul-titulo"> <div><b><font color="#041243">Mackenzie</font></b><span><font color="#000000">For Code Test</font></span></div></div></div><div class="bt1baul-imagenredonda"><img src="https://64.media.tumblr.com/21bd6617088e63531596a701492aa51a/d73664946304f49b-a6/s400x600/5697218c06aaa607cb233ca48eec7f9d54db2562.gifv"></div></div><link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap" rel="stylesheet"><a class="bettycred" href="http://bettyleg.tumblr.com/">bettyleg</a>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap" rel="stylesheet"><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"><style>@font-face {font-family: 'Goldie Rainbow'; src: url('https://dl.dropbox.com/s/vy3ql8rmyhe42au/Goldie%20Rainbow.ttf');src: url('https://dl.dropbox.com/s/vy3ql8rmyhe42au/Goldie%20Rainbow.ttf') format('truetype'); font-weight: normal;font-style: normal;} .bt1b-fondo{margin:30px auto; width:400px; background:#ddd; padding-bottom:40px; overflow:hidden; outline:1px solid #ddd;}.bt1-baul{width:400px; height:400px; border-bottom:1px solid #fff; overflow:hidden;}.bt1baul-imagenredonda{width:120px; height:120px; background:#fff; border-radius:180px; margin:0 auto; margin-top:-60px; border:1px solid #fff; display:flex; align-items:center; justify-content:center; } .bt1baul-imagenredonda img{width:120px; height:120px; border-radius:180px;} .bt1b-titulom{border-bottom:1px solid #ddd; height:80px; display:flex; align-items:center; justify-content:center; background:#fafafa;font-family: 'Goldie Rainbow'; font-size:40px; font-weight:700; letter-spacing:2px; } .bt1baul-barra{height:60px; border-bottom:1px solid #888; backdrop-filter:grayscale(1) blur(4px); display:flex; align-items:center; justify-content:center; position:relative; top:-61px; webkit-transition: 1s; -o-transition: 1s;transition: 1s;} .bt1baul-titulo{height:150px; margin-top:160px; display:flex; align-items:center; justify-content:center; line-height:28px; text-align:center;} .bt1baul-titulo span{color:#fafafa; text-transform:uppercase; font-weight:700; font-size:12px; letter-spacing:2px; font-family:'Lato', sans-serif;} .bt1baul-barra a {color:#fff; font-size:16px; padding:0px 12px;} .bt1baul-barra a i{transform:rotate(0deg);webkit-transition: 1s; -o-transition: 1s;transition: 1s;}.bt1-baul:hover .bt1baul-barra{top:0px; webkit-transition: 1s; -o-transition: 1s;transition: 1s;} .bt1baul-barra a:hover i{color:#1c3172;webkit-transition: 1s; -o-transition: 1s;transition: 1s; transform:rotate(10deg)} .bt1baul-imagenredonda{width:120px; height:120px; background:#fff; border-radius:180px; margin:0 auto; margin-top:-60px; border:1px solid #fff; display:flex; align-items:center; justify-content:center; } .bt1baul-imagenredonda img{width:120px; height:120px; border-radius:180px;} .bt1baul-titulo b{display:block; font-family: 'Goldie Rainbow'; font-size:60px; color:#fff; letter-spacing:1px; text-shadow:2px 2px #333;} .bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>
แบบฟอร์มขอรับกระทู้ทดลองโค้ตชื่อเต็ม: Denista Nortara (Nereza Henladys)Username: Denistaชื่อกระทู้ทดลองโค้ต: 𝖉𝖊𝖓𝖎𝖘𝖙𝖆 ⋆ 𝖊𝖗𝖆
เทมเพลต Code html หน้าปก: <style>
.profile-card {
width: 600px;
background: #fff;
border: 2px solid #f3d6df;
border-radius: 15px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 20px;
text-align: center;
}
.profile-card img {
width: 100px;
height: 100px;
border-radius: 50%;
border: 5px solid #f3d6df;
}
.profile-card h1 {
font-size: 28px;
color: #d37a8c;
margin: 15px 0;
}
.profile-card p {
font-size: 14px;
color: #888;
line-height: 1.6;
margin: 20px 0;
}
.profile-card p span {
font-weight: bold;
color: #d37a8c;
}
.button-group {
display: flex;
justify-content: space-around;
margin-top: 20px;
}
.button-group a {
display: inline-block;
padding: 5px 10px;
background: #f3d6df;
color: #d37a8c;
font-size: 14px;
border-radius: 5px;
text-decoration: none;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transition: background-color 0.3s, box-shadow 0.3s;
}
.button-group a:hover {
background: #d37a8c;
color: #fff;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}
</style>
<div align="center">
<div class="profile-card"><font face="Kanit"><font size="3">
<img src="https://i.imgur.com/vsD0DGo.png" alt="Profile Picture">
<h1><font size="5">DENISTA - NEREZA</font></h1>
<p>Welcome to MY PAGE for HTML (T T)</p>
<div class="button-group">
<a href="#">dm for someone who need help</a>
</div>
</font></font></div></div>
หน้า:
[1]