R10 Bakım Sayfası Tasarımı Çok Güzel Olmuş

16-01-2026, 20:50:55

R10 bakım sayfası tasarımını çok beğendim. Forum açıldıktan sonra dikkatimi çekti, benim gibi baya bir beğenen olmuş. Tasarımı yapay zekanın yaptığı belli oluyor ama yine de güzel görünüyor.

16-01-2026, 20:52:18

#2

depresanz

Ben hacklendi sandım

16-01-2026, 20:52:24

#3

pazaryazilim

güzel yinede ama bıktık yapay zeka tasarımlarından daha özgün ve forum tasarımına uygun birşey olabilirdi.

16-01-2026, 20:52:51

#4

gsahin

Güzel ama yapayzeka gibi. Gradient gördüğüm herşey bana artık yapayzeka geliyor

16-01-2026, 20:54:06

#5

ClyStone

pazaryazilim adlı üyeden alıntı: mesajı görüntüle

güzel yinede ama bıktık yapay zeka tasarımlarından daha özgün ve forum tasarımına uygun birşey olabilirdi.

Evet yapay zeka tasarımları bazı yerlerde sıkıcı oluyor ama bu bakım sayfası için iyi olmuş bence. Mesela bir sitenin anasayfasından bahsediyor olsaydık o zaman farklı konuşurduk muhtemelen.

16-01-2026, 20:56:41

#6

ClyStone

gsahin adlı üyeden alıntı: mesajı görüntüle

Güzel ama yapayzeka gibi. Gradient gördüğüm herşey bana artık yapayzeka geliyor

https://uigradients.com/#Kashmir

Şu tür gradient'leri çok seviyorum ama yapay zekanın genel olarak bu tür gradient ve renkleri kullandığını öğrendiğimden beri kullanıp kullanmamak konusunda kararsızım.

16-01-2026, 20:58:07

#7

Lufi

R10 En Hızlı Yazılımcı 🚀

Alın hocam sizin olsun

<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Geçici Erişim Sorunu</title>

<style>
:root{
  --bg:#0b1020;
  --card:#11182c;
  --card2:#0f1528;
  --text:#e6e9f2;
  --muted:#9aa3b2;
  --border:rgba(255,255,255,.08);
  --blue:#4f8cff;
  --green:#2ecc71;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont;
  background: radial-gradient(1200px 500px at top, #162046, var(--bg));
  color:var(--text);
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.container{
  max-width:1100px;
  width:100%;
  padding:24px;
}

.grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:24px;
}

.card{
  background:linear-gradient(180deg,var(--card),var(--card2));
  border:1px solid var(--border);
  border-radius:18px;
  padding:28px;
  box-shadow:0 20px 50px rgba(0,0,0,.45);
}

.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:24px;
}

.badge{
  background:rgba(79,140,255,.15);
  color:#cfe0ff;
  border:1px solid rgba(79,140,255,.35);
  padding:6px 14px;
  border-radius:999px;
  font-size:13px;
}

h1{
  font-size:30px;
  margin:0 0 12px;
}

p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}

.info-grid{
  margin-top:28px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.info{
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
}

.info h3{
  font-size:15px;
  margin:0 0 6px;
  display:flex;
  align-items:center;
  gap:8px;
}

.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--blue);
}

.dot.green{background:var(--green)}

.right h2{
  margin:0 0 18px;
}

.kv{
  display:flex;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px dashed var(--border);
  font-size:14px;
}

.kv:last-child{border-bottom:none}

.buttons{
  margin-top:24px;
  display:flex;
  gap:12px;
}

button{
  background:#1b2340;
  color:#fff;
  border:1px solid var(--border);
  padding:10px 18px;
  border-radius:12px;
  cursor:pointer;
  font-size:14px;
}

button.primary{
  background:linear-gradient(180deg,#4f8cff,#356fe0);
  border:none;
}

.note{
  margin-top:14px;
  font-size:12px;
  color:var(--muted);
}

@media(max-width:900px){
  .grid{grid-template-columns:1fr}
}
</style>
</head>

<body>
<div class="container">
  <div class="grid">

    <!-- SOL -->
    <div class="card">
      <div class="header">
        <strong>R10.NET</strong>
        <span class="badge">Geçici Durum</span>
      </div>

      <h1>Şu anda geçici bir erişim sorunu yaşıyoruz</h1>
      <p>
        Sistem tarafında kısa süreli bir bakım / iyileştirme çalışması yürütülüyor.
        Bu süreçte bazı ziyaretçiler sayfaya erişemeyebilir.
        Lütfen birkaç dakika sonra tekrar deneyin.
      </p>

      <div class="info-grid">
        <div class="info">
          <h3><span class="dot"></span> Durum</h3>
          <p>Bakım modu aktif veya origin yanıt vermiyor olabilir.</p>
        </div>

        <div class="info">
          <h3><span class="dot green"></span> Güvenlik</h3>
          <p>Trafik Cloudflare üzerinden korunmaya devam ediyor.</p>
        </div>

        <div class="info">
          <h3><span class="dot"></span> Öneri</h3>
          <p>Önbelleği temizleyip sayfayı yenileyin (Ctrl / ⌘ + F5).</p>
        </div>

        <div class="info">
          <h3><span class="dot"></span> Beklenen</h3>
          <p>Çalışma tamamlandığında sistem otomatik olarak normale döner.</p>
        </div>
      </div>

      <p class="note">
        Not: Bu sayfa, sunucuya erişilemediğinde otomatik olarak gösteriliyor olabilir.
      </p>
    </div>

    <!-- SAĞ -->
    <div class="card right">
      <h2>Hızlı Bilgiler</h2>

      <div class="kv"><span>Tarih</span><strong>16 Ocak 2026 Cuma</strong></div>
      <div class="kv"><span>Saat</span><strong>19:41:01</strong></div>
      <div class="kv"><span>İstek ID</span><strong>BF9BABD1-19BC7AE8456</strong></div>
      <div class="kv"><span>Sayfa</span><strong>/</strong></div>

      <div class="buttons">
        <button class="primary" onclick="location.reload()">Yenile</button>
        <button onclick="location.href='/'">Ana sayfa</button>
      </div>

      <p class="note">
        Eğer bu ekran uzun süre devam ediyorsa, birkaç dakika sonra tekrar deneyin.
      </p>
    </div>

  </div>
</div>
</body>
</html>

16-01-2026, 21:00:28

#8

ClyStone

Lufi adlı üyeden alıntı: mesajı görüntüle

Alın hocam sizin olsun

<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Geçici Erişim Sorunu</title>

<style>
:root{
  --bg:#0b1020;
  --card:#11182c;
  --card2:#0f1528;
  --text:#e6e9f2;
  --muted:#9aa3b2;
  --border:rgba(255,255,255,.08);
  --blue:#4f8cff;
  --green:#2ecc71;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont;
  background: radial-gradient(1200px 500px at top, #162046, var(--bg));
  color:var(--text);
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.container{
  max-width:1100px;
  width:100%;
  padding:24px;
}

.grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:24px;
}

.card{
  background:linear-gradient(180deg,var(--card),var(--card2));
  border:1px solid var(--border);
  border-radius:18px;
  padding:28px;
  box-shadow:0 20px 50px rgba(0,0,0,.45);
}

.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:24px;
}

.badge{
  background:rgba(79,140,255,.15);
  color:#cfe0ff;
  border:1px solid rgba(79,140,255,.35);
  padding:6px 14px;
  border-radius:999px;
  font-size:13px;
}

h1{
  font-size:30px;
  margin:0 0 12px;
}

p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}

.info-grid{
  margin-top:28px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.info{
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
}

.info h3{
  font-size:15px;
  margin:0 0 6px;
  display:flex;
  align-items:center;
  gap:8px;
}

.dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--blue);
}

.dot.green{background:var(--green)}

.right h2{
  margin:0 0 18px;
}

.kv{
  display:flex;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px dashed var(--border);
  font-size:14px;
}

.kv:last-child{border-bottom:none}

.buttons{
  margin-top:24px;
  display:flex;
  gap:12px;
}

button{
  background:#1b2340;
  color:#fff;
  border:1px solid var(--border);
  padding:10px 18px;
  border-radius:12px;
  cursor:pointer;
  font-size:14px;
}

button.primary{
  background:linear-gradient(180deg,#4f8cff,#356fe0);
  border:none;
}

.note{
  margin-top:14px;
  font-size:12px;
  color:var(--muted);
}

@media(max-width:900px){
  .grid{grid-template-columns:1fr}
}
</style>
</head>

<body>
<div class="container">
  <div class="grid">

    <!-- SOL -->
    <div class="card">
      <div class="header">
        <strong>R10.NET</strong>
        <span class="badge">Geçici Durum</span>
      </div>

      <h1>Şu anda geçici bir erişim sorunu yaşıyoruz</h1>
      <p>
        Sistem tarafında kısa süreli bir bakım / iyileştirme çalışması yürütülüyor.
        Bu süreçte bazı ziyaretçiler sayfaya erişemeyebilir.
        Lütfen birkaç dakika sonra tekrar deneyin.
      </p>

      <div class="info-grid">
        <div class="info">
          <h3><span class="dot"></span> Durum</h3>
          <p>Bakım modu aktif veya origin yanıt vermiyor olabilir.</p>
        </div>

        <div class="info">
          <h3><span class="dot green"></span> Güvenlik</h3>
          <p>Trafik Cloudflare üzerinden korunmaya devam ediyor.</p>
        </div>

        <div class="info">
          <h3><span class="dot"></span> Öneri</h3>
          <p>Önbelleği temizleyip sayfayı yenileyin (Ctrl / ⌘ + F5).</p>
        </div>

        <div class="info">
          <h3><span class="dot"></span> Beklenen</h3>
          <p>Çalışma tamamlandığında sistem otomatik olarak normale döner.</p>
        </div>
      </div>

      <p class="note">
        Not: Bu sayfa, sunucuya erişilemediğinde otomatik olarak gösteriliyor olabilir.
      </p>
    </div>

    <!-- SAĞ -->
    <div class="card right">
      <h2>Hızlı Bilgiler</h2>

      <div class="kv"><span>Tarih</span><strong>16 Ocak 2026 Cuma</strong></div>
      <div class="kv"><span>Saat</span><strong>19:41:01</strong></div>
      <div class="kv"><span>İstek ID</span><strong>BF9BABD1-19BC7AE8456</strong></div>
      <div class="kv"><span>Sayfa</span><strong>/</strong></div>

      <div class="buttons">
        <button class="primary" onclick="location.reload()">Yenile</button>
        <button onclick="location.href='/'">Ana sayfa</button>
      </div>

      <p class="note">
        Eğer bu ekran uzun süre devam ediyorsa, birkaç dakika sonra tekrar deneyin.
      </p>
    </div>

  </div>
</div>
</body>
</html>

Teşekkürler hocam. Kullanmak isteyenler olacaktır mutlaka.

16-01-2026, 21:01:03

#9

gsahin

ClyStone adlı üyeden alıntı: mesajı görüntüle

https://uigradients.com/#Kashmir

Şu tür gradient'leri çok seviyorum ama yapay zekanın genel olarak bu tür gradient ve renkleri kullandığını öğrendiğimden beri kullanıp kullanmamak konusunda kararsızım.

Bence kullanma. Gradient direk yapayzeka algısı yapıyor. Yapyzekayla yapılmasına karşı değilim bu arada. Ama profesyonellik isteyeceğim bir işte yada referans istediğimde bunu sunarsa GG

baştan kaybeder