연습장:Yuc/4: 두 판 사이의 차이

← 이전 편집 다음 편집 →

시각위키텍스트

2026년 2월 2일 (월) 17:29 판

레웨걸용 연습장

커뮤니티

대형사철

대한철도 (수도권) 한성메트로 네오트랜스 경진철도 대원철도 경기철도 강화철도 경동철도 (동남권)

(평양권) 평양메트로

수도권

한성메트로 (사철)
- 1호선
- 2호선
- 3호선
- 4호선
한성도시철도공사
- 5호선
- 6호선
- 7호선
- 8호선
한성부메트로9호선 (사철)
- 9호선
안산전철 (사철)
- 10호선
분당급행전철 (사철)
- 11호선
철도청
- 12호선
- 13호선
서해철도
- 14호선

수도권 사철

네오트랜스
- 신분당선
- 신일산선

새서울철도
- 신용산선

경진철도
- 사당선

경기철도
대원철도

경인급행전철
- 신경인선

강화철도
- 강화본선

경동철도
- 경동본선

만철

일본 국철

2

김유성 金流盛 \| Kim yu-sŏng

△ 양유진의 김유성 코스프레 ^[1]
나이	18세	혈액형	B형
신장	162㎝	체중	45㎏
생년	2009년 5월 12일	성별	여성
국적	대한제국	쓰는 손	오른손
출신지	평안북도 선천시	거주지	경기도 시흥부
다른 이름	류세이 (リュウセイ) 메테오 (メテオ)
학력	상반중학교 (전학) 일직중학교 (졸업)^[2] 금천공업고등학교 (재학 중)
가족	김구성 (아버지) 이세류 (어머니) 김유미 (여동생) 김유한 (남동생)
취미	철도 덕질, 사진 찍기, 자전거 타기, 트위터 하기, 트친들과 놀러다니기

3

대한제국 행정구역 단계

[ 펼치기 · 접기 ]

광역자치단체	기초자치단체	3단계	4단계	5단계	6단계

부	구	동	통	반
	군	읍	리
		면
도	부	시	동		반
			구	동
			읍	리
			면
		군	읍	리
			면
		구	동	통
			읍	리
			면
	시	동		통	반
		구	동
		읍	리
		면
	군	읍	리		반
		면

↑ 작가의 역량 부족으로(...) 일러를 구할 수가 없어서 임시로 사용하는 사진이다... 일러를 구한다면 바로 교체될 것
↑ 시흥부 일직동 소재, 현실의 경상북도 안동시 일직면에 있는 일직중학교와는 연관없는 가상의 중학교이다.

[1] 작가의 역량 부족으로(...) 일러를 구할 수가 없어서 임시로 사용하는 사진이다... 일러를 구한다면 바로 교체될 것

[2] 시흥부 일직동 소재, 현실의 경상북도 안동시 일직면에 있는 일직중학교와는 연관없는 가상의 중학교이다.

[1]

[2]

@@ 2번째 줄: / 2번째 줄: @@
 == ==
+<html lang="ko">
+<head>
+<meta charset="UTF-8">
+<title>커뮤니티</title>
+<style>
+:root {
+  --bg: #f4f6f8;
+  --panel: #ffffff;
+  --text: #1f2937;
+  --subtext: #6b7280;
+  --border: #e5e7eb;
+  --accent: #3b82f6;
+  --accent-hover: #2563eb;
+  --danger: #ef4444;
+}
+* { box-sizing: border-box; font-family: "Pretendard", system-ui, -apple-system, sans-serif; }
+body { margin:0; padding:16px; background:var(--bg); color:var(--text); min-width:320px; }
+.container { width:100%; max-width:100%; }
+.write-box { background:var(--panel); border-radius:14px; padding:16px; margin-bottom:20px; box-shadow:0 6px 18px rgba(0,0,0,0.05);}
+.write-row { display:flex; gap:10px; margin-bottom:10px; flex-wrap:nowrap;}
+.write-row input { flex:1 1 0; min-width:0; border:1px solid var(--border); background:#fafafa; padding:12px; border-radius:8px; font-size:14px; }
+.write-row input:focus { outline:none; border-color:var(--accent); background:#fff;}
+#titleInput { width:100%; margin-bottom:10px; border:1px solid var(--border); background:#fafafa; padding:12px; border-radius:8px; font-size:14px; }
+#titleInput:focus { outline:none; border-color:var(--accent); background:#fff;}
+textarea { width:100%; min-height:150px; resize:vertical; margin-bottom:12px; border:1px solid var(--border); background:#fafafa; padding:12px; border-radius:8px; font-size:14px; }
+textarea:focus { outline:none; border-color:var(--accent); background:#fff;}
+button { background:var(--accent); color:white; border:none; padding:10px 18px; border-radius:8px; cursor:pointer; font-size:14px; }
+button:hover { background:var(--accent-hover); }
+.list { background:var(--panel); border-radius:14px; padding:6px; box-shadow:0 6px 18px rgba(0,0,0,0.05); }
+.post { padding:14px 16px; border-radius:10px; cursor:pointer; }
+.post:hover { background:#f3f4f6; }
+.post + .post { border-top:1px solid var(--border); }
+.title { font-size:15px; font-weight:600; }
+.meta { font-size:12px; color:var(--subtext); margin-top:4px; }
+.modal { position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:999; }
+.modal-content { background:var(--panel); padding:22px; width:90%; max-width:900px; border-radius:16px; }
+#modalTitle { margin:0; font-size:20px; }
+.modal-meta { font-size:13px; color:var(--subtext); margin:6px 0 14px; }
+#modalContent { white-space:pre-wrap; line-height:1.6; margin-bottom:20px; }
+.modal-actions { display:flex; justify-content:flex-end; gap:10px; }
+.delete { background:var(--danger); }
+.delete:hover { background:#dc2626; }
+</style>
+</head>
+<body>
+<div class="container">
+  <!-- 글쓰기 -->
+  <div class="write-box">
+    <div class="write-row">
+      <input id="nicknameInput" placeholder="닉네임">
+      <input id="passwordInput" type="password" placeholder="비밀번호">
+    </div>
+    <input id="titleInput" placeholder="제목">
+    <textarea id="contentInput" placeholder="내용"></textarea>
+    <button onclick="addPost()">등록</button>
+  </div>
+  <!-- 글 목록 -->
+  <div class="list" id="list"></div>
+</div>
+<!-- 모달 -->
+<div class="modal" id="modal" onclick="closeModal()">
+  <div class="modal-content" onclick="event.stopPropagation()">
+    <h3 id="modalTitle"></h3>
+    <div class="modal-meta" id="modalNickname"></div>
+    <div id="modalContent"></div>
+    <div class="modal-actions">
+      <button class="delete" onclick="deletePost()">삭제</button>
+      <button onclick="closeModal()">닫기</button>
+    </div>
+  </div>
+</div>
+<script>
+const nicknameInput = document.getElementById("nicknameInput");
+const passwordInput = document.getElementById("passwordInput");
+const titleInput = document.getElementById("titleInput");
+const contentInput = document.getElementById("contentInput");
+const list = document.getElementById("list");
+const modal = document.getElementById("modal");
+const modalTitle = document.getElementById("modalTitle");
+const modalNickname = document.getElementById("modalNickname");
+const modalContent = document.getElementById("modalContent");
+let posts = [];  // 문법 문자열로 저장
+let currentPostId = null;
+// 문법 예시: [[닉네임]]|비밀번호|제목|내용
+function addPost() {
+  const nick = nicknameInput.value.trim();
+  const pass = passwordInput.value.trim();
+  const t = titleInput.value.trim();
+  const c = contentInput.value.trim();
+  if(!nick || !pass || !t || !c){ alert("모든 항목을 입력하세요."); return; }
+  const line = `[[${nick}]]|${pass}|${t}|${c}`;
+  posts.unshift(line);
+  nicknameInput.value=""; passwordInput.value=""; titleInput.value=""; contentInput.value="";
+  render();
+}
+function parsePost(line) {
+  const [nickPart, pass, title, content] = line.split("|");
+  const nick = nickPart.replace(/^\[\[|\]\]$/g,"");
+  return { nick, pass, title, content };
+}
+function render() {
+  list.innerHTML = "";
+  posts.forEach((line, idx)=>{
+    const p = parsePost(line);
+    const d = document.createElement("div");
+    d.className = "post";
+    d.innerHTML = `<div class="title">${p.title}</div><div class="meta">작성자: ${p.nick}</div>`;
+    d.onclick = ()=>openPost(idx);
+    list.appendChild(d);
+  });
+}
+function openPost(idx){
+  const p = parsePost(posts[idx]);
+  currentPostId = idx;
+  modal.style.display="flex";
+  modalTitle.innerText = p.title;
+  modalNickname.innerText = "작성자: "+p.nick;
+  modalContent.innerText = p.content;
+}
+function deletePost(){
+  const p = parsePost(posts[currentPostId]);
+  const input = prompt("비밀번호를 입력하세요");
+  if(input !== p.pass){ alert("비밀번호가 틀렸습니다."); return; }
+  posts.splice(currentPostId,1);
+  closeModal();
+  render();
+}
+function closeModal(){ modal.style.display="none"; currentPostId=null; }
+render();
+</script>
+</body>
+</html>
 == 대형사철 ==