Skip to Content
0 Votes

Changes for page Members

Last modified by Kay Joo on 2026/04/28 06:03
From version 43.1
edited by 지안 이
on 2026/04/22 06:42
Change comment: There is no comment for this version
To version 55.1
edited by Kay Joo
on 2026/04/25 15:44
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.easyone
1 +XWiki.stone
Content
... ... @@ -1,203 +2,329 @@
1 -{{velocity}}
2 2  = 멤버 소개 =
3 3  
4 -{{html clean="false"}}
3 +{{html clean="false" wiki="true"}}
5 5  <style>
6 -.member-card {
7 - border: 1px solid #ddd;
8 - border-radius: 8px;
9 - padding: 15px;
10 - margin-bottom: 20px;
11 - background-color: #f9f9f9;
12 - box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
5 +.members-wrap{
6 + margin:1.5rem 0 2.5rem;
7 + color:#2a241f;
8 + font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
13 13  }
14 -.member-name {
15 - color: #2c3e50;
16 - border-bottom: 2px solid #3498db;
17 - padding-bottom: 5px;
18 - margin-top: 0;
10 +.members-hero{
11 + padding:2.2rem 2rem;
12 + border:1px solid #e3ddd5;
13 + border-radius:24px;
14 + background:
15 + radial-gradient(circle at top right, rgba(1,105,111,.10), transparent 28%),
16 + linear-gradient(135deg,#f8f5ef 0%,#fcfbf8 100%);
17 + box-shadow:0 14px 40px rgba(39,31,23,.08);
19 19  }
20 -.member-info {
21 - list-style: none;
22 - padding-left: 0;
19 +.members-eyebrow{
20 + display:inline-block;
21 + margin-bottom:.7rem;
22 + padding:.35rem .7rem;
23 + border-radius:999px;
24 + background:#e4f1ef;
25 + color:#0d5c61;
26 + font-size:.86rem;
27 + font-weight:700;
28 + letter-spacing:.02em;
23 23  }
24 -.member-info li {
25 - margin-bottom: 5px;
30 +.members-hero h2{
31 + margin:0 0 .7rem;
32 + font-size:2rem;
33 + line-height:1.15;
34 + color:#1f2f36;
26 26  }
27 -.member-label {
28 - font-weight: bold;
29 - color: #34495e;
30 - display: inline-block;
31 - width: 80px;
36 +.members-hero p{
37 + margin:0;
38 + max-width:760px;
39 + color:#5f6b72;
40 + line-height:1.75;
41 + font-size:1rem;
32 32  }
33 -</style>
34 -{{/html}}
35 -
36 -#set($results = $xwiki.searchDocuments("where doc.fullName like 'Home.Members.MemberProfileData.%' and doc.fullName <> 'Home.Members.MemberProfileData.Webhome' order by doc.title asc", 0, 0))
37 -#foreach($docName in $results)
38 - #set($memberDoc = $xwiki.getDocument($docName))
39 - #set($memberObj = $memberDoc.getObject('Home.Members.MemberProfileData.Code.MemberProfileDataClass'))
40 - #if($memberObj && $memberObj.getProperty('name').value != 'Name')
41 -
42 - {{html clean="false"}}
43 - <div class="member-card">
44 - <h3 class="member-name">$memberDoc.title 오빠</h3>
45 - <ul class="member-info">
46 - <li><span class="member-label">이름:</span> $memberObj.getProperty('name').value</li>
47 - #set($birthday = $memberObj.getProperty('birthday').value)
48 - #if($birthday)
49 - <li><span class="member-label">출생:</span> $datetool.format('yyyy년 MM월 dd일', $birthday)</li>
50 - #end
51 - <li><span class="member-label">거주지:</span> $memberObj.getProperty('address').value</li>
52 - <li><span class="member-label">직업:</span> $memberObj.getProperty('job').value</li>
53 - <li><span class="member-label">직장:</span> $memberObj.getProperty('company').value</li>
54 - <li><span class="member-label">주요 분야:</span> $memberObj.getProperty('field').value</li>
55 - </ul>
56 - </div>
57 - {{/html}}
58 -
59 - #end
60 -#end
61 -{{/velocity}}{{velocity}}
62 -= 멤버 소개 =
63 -
64 -{{html clean="false"}}
65 -<style>
66 -.member-card {
67 - border: 1px solid #ddd;
68 - border-radius: 8px;
69 - padding: 15px;
70 - margin-bottom: 20px;
71 - background-color: #f9f9f9;
72 - box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
43 +.members-grid{
44 + display:grid;
45 + grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
46 + gap:1.2rem;
47 + margin-top:1.6rem;
73 73  }
74 -.member-name {
75 - color: #2c3e50;
76 - border-bottom: 2px solid #3498db;
77 - padding-bottom: 5px;
78 - margin-top: 0;
49 +.member-card{
50 + background:#fffdfa;
51 + border:1px solid #ebe4da;
52 + border-radius:22px;
53 + padding:1.2rem;
54 + box-shadow:0 8px 24px rgba(43,33,22,.05);
55 + transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
79 79  }
80 -.member-info {
81 - list-style: none;
82 - padding-left: 0;
57 +.member-card:hover{
58 + transform:translateY(-4px);
59 + box-shadow:0 16px 34px rgba(43,33,22,.09);
60 + border-color:#ddd2c3;
83 83  }
84 -.member-info li {
85 - margin-bottom: 5px;
62 +.member-top{
63 + display:flex;
64 + align-items:center;
65 + gap:.85rem;
66 + margin-bottom:.9rem;
86 86  }
87 -.member-label {
88 - font-weight: bold;
89 - color: #34495e;
90 - display: inline-block;
91 - width: 80px;
68 +.member-avatar{
69 + width:52px;
70 + height:52px;
71 + border-radius:50%;
72 + display:flex;
73 + align-items:center;
74 + justify-content:center;
75 + background:linear-gradient(135deg,#0f766e 0%,#0b5d56 100%);
76 + color:#fff;
77 + font-size:1.1rem;
78 + font-weight:700;
79 + box-shadow:0 8px 18px rgba(15,118,110,.22);
80 + flex:0 0 52px;
92 92  }
93 -</style>
94 -{{/html}}
95 -
96 -#set($results = $xwiki.searchDocuments("where doc.fullName like 'Home.Members.MemberProfileData.%' and doc.fullName <> 'Home.Members.MemberProfileData.Webhome' order by doc.title asc", 0, 0))
97 -#foreach($docName in $results)
98 - #set($memberDoc = $xwiki.getDocument($docName))
99 - #set($memberObj = $memberDoc.getObject('Home.Members.MemberProfileData.Code.MemberProfileDataClass'))
100 - #if($memberObj && $memberObj.getProperty('name').value != 'Name')
101 - {{html clean="false"}}
102 - <div class="member-card">
103 - <h3 class="member-name">$memberDoc.title 오빠</h3>
104 - <ul class="member-info">
105 - <li><span class="member-label">이름:</span> $memberObj.getProperty('name').value</li>
106 - #set($birthday = $memberObj.getProperty('birthday').value)
107 - #if($birthday)
108 - <li><span class="member-label">출생:</span> $datetool.format('yyyy년 MM월 dd일', $birthday)</li>
109 - #end
110 - <li><span class="member-label">거주지:</span> $memberObj.getProperty('address').value</li>
111 - <li><span class="member-label">직업:</span> $memberObj.getProperty('job').value</li>
112 - <li><span class="member-label">직장:</span> $memberObj.getProperty('company').value</li>
113 - <li><span class="member-label">주요 분야:</span> $memberObj.getProperty('field').value</li>
114 - </ul>
115 - </div>
116 - {{/html}}
117 - #end
118 -#end
119 -{{/velocity}}{{velocity}}
120 -= 멤버 소개 =
121 -
122 -{{html}}
123 -<style>
124 -.member-card {
125 - border: 1px solid #ddd;
126 - border-radius: 8px;
127 - padding: 15px;
128 - margin-bottom: 20px;
129 - background-color: #f9f9f9;
130 - box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
82 +.member-name{
83 + margin:0;
84 + font-size:1.2rem;
85 + line-height:1.2;
86 + color:#222b33;
131 131  }
132 -.member-name {
133 - color: #2c3e50;
134 - border-bottom: 2px solid #3498db;
135 - padding-bottom: 5px;
136 - margin-top: 0;
88 +.member-sub{
89 + margin:.22rem 0 0;
90 + color:#8a7b69;
91 + font-size:.9rem;
137 137  }
138 -.member-info {
139 - list-style: none;
140 - padding-left: 0;
93 +.member-list{
94 + list-style:none;
95 + margin:0;
96 + padding:0;
141 141  }
142 -.member-info li {
143 - margin-bottom: 5px;
98 +.member-list li{
99 + display:flex;
100 + gap:.5rem;
101 + padding:.46rem 0;
102 + border-top:1px dashed #eee4d8;
103 + line-height:1.55;
104 + color:#4d5963;
144 144  }
145 -.member-label {
146 - font-weight: bold;
147 - color: #34495e;
148 - display: inline-block;
149 - width: 80px;
106 +.member-list li:first-child{
107 + border-top:none;
108 + padding-top:0;
150 150  }
110 +.member-label{
111 + min-width:4.8rem;
112 + font-weight:700;
113 + color:#7a5a2d;
114 + flex:0 0 4.8rem;
115 +}
116 +.members-footer{
117 + margin-top:1.4rem;
118 + padding:1rem 1.1rem;
119 + border-left:4px solid #0f766e;
120 + border-radius:14px;
121 + background:#f6f6f2;
122 + color:#5f6972;
123 + line-height:1.7;
124 + font-size:.95rem;
125 +}
126 +@media (max-width:640px){
127 + .members-hero{padding:1.5rem 1.2rem;}
128 + .members-hero h2{font-size:1.55rem;}
129 + .member-list li{display:block;}
130 + .member-label{
131 + display:block;
132 + min-width:auto;
133 + margin-bottom:.12rem;
134 + }
135 +}
151 151  </style>
152 -{{/html}}
153 153  
154 -#set($results = $xwiki.searchDocuments("where doc.fullName like 'Home.Members.MemberProfileData.%' and doc.fullName <> 'Home.Members.MemberProfileData.Webhome' order by doc.title asc", 0, 0))
155 -#foreach($docName in $results)
156 - #set($memberDoc = $xwiki.getDocument($docName))
157 - #set($memberObj = $memberDoc.getObject('Home.Members.MemberProfileData.Code.MemberProfileDataClass'))
158 - #if($memberObj && $memberObj.getProperty('name').value != 'Name')
159 - {{html}}
160 - <div class="member-card">
161 - <h3 class="member-name">$memberDoc.title 오빠</h3>
162 - <ul class="member-info">
163 - <li><span class="member-label">이름:</span> $memberObj.getProperty('name').value</li>
164 - #set($birthday = $memberObj.getProperty('birthday').value)
165 - #if($birthday)
166 - <li><span class="member-label">출생:</span> $datetool.format('yyyy년 MM월 dd일', $birthday)</li>
167 - #end
168 - <li><span class="member-label">거주지:</span> $memberObj.getProperty('address').value</li>
169 - <li><span class="member-label">직업:</span> $memberObj.getProperty('job').value</li>
170 - <li><span class="member-label">직장:</span> $memberObj.getProperty('company').value</li>
171 - <li><span class="member-label">주요 분야:</span> $memberObj.getProperty('field').value</li>
172 - </ul>
138 +<div class="members-wrap">
139 + <section class="members-hero">
140 + <span class="members-eyebrow">Jangsu Club</span>
141 + <h2>함께한 시간이 만든, 우리의 멤버 소개</h2>
142 + <p>장수클럽 멤버들을 소개합니다. 이 페이지는 외부 공개용 안내 페이지로, 개인정보 보호를 위해 일부 정보는 축약하거나 마스킹해 표시했습니다.</p>
143 + </section>
144 +
145 + <div class="members-grid">
146 +
147 + <article class="member-card">
148 + <div class="member-top">
149 + <div class="member-avatar">김</div>
150 + <div>
151 + <h3 class="member-name">김대홍</h3>
152 + <p class="member-sub">장수클럽 멤버</p>
173 173   </div>
174 - {{/html}}
175 - #end
176 -#end
177 -{{/velocity}}{{velocity}}
178 -= 멤버 소개 =
154 + </div>
155 + <ul class="member-list">
156 + <li><span class="member-label">출생</span><span>1979년 01월</span></li>
157 + <li><span class="member-label">직업</span><span>회사원</span></li>
158 + <li><span class="member-label">직장</span><span>삼**자</span></li>
159 + <li><span class="member-label">주요 분야</span><span>반도체</span></li>
160 + </ul>
161 + </article>
179 179  
180 -#set($results = $xwiki.searchDocuments("where doc.fullName like 'Home.Members.MemberProfileData.%' and doc.fullName <> 'Home.Members.MemberProfileData.Webhome' order by doc.title asc", 0, 0))
181 -#foreach($docName in $results)
182 - #set($memberDoc = $xwiki.getDocument($docName))
183 - #set($memberObj = $memberDoc.getObject('Home.Members.MemberProfileData.Code.MemberProfileDataClass'))
184 - #if($memberObj and $memberObj.getProperty('name').value != 'Name')
185 - === $memberDoc.title ===
163 + <article class="member-card">
164 + <div class="member-top">
165 + <div class="member-avatar">김</div>
166 + <div>
167 + <h3 class="member-name">김인용</h3>
168 + <p class="member-sub">장수클럽 멤버</p>
169 + </div>
170 + </div>
171 + <ul class="member-list">
172 + <li><span class="member-label">출생</span><span>1979년 01월</span></li>
173 + <li><span class="member-label">직업</span><span>회사원</span></li>
174 + <li><span class="member-label">직장</span><span>한*****원</span></li>
175 + <li><span class="member-label">주요 분야</span><span>조달</span></li>
176 + </ul>
177 + </article>
186 186  
187 - * **이름:** $memberObj.getProperty('name').value
188 - * **출생:** $memberObj.getProperty('birthday').value
189 - * **거주지:** $memberObj.getProperty('address').value
190 - * **직업:** $memberObj.getProperty('job').value
191 - * **직장:** $memberObj.getProperty('company').value
192 - * **주요 분야:** $memberObj.getProperty('field').value
179 + <article class="member-card">
180 + <div class="member-top">
181 + <div class="member-avatar">김</div>
182 + <div>
183 + <h3 class="member-name">김재명</h3>
184 + <p class="member-sub">장수클럽 멤버</p>
185 + </div>
186 + </div>
187 + <ul class="member-list">
188 + <li><span class="member-label">출생</span><span>1980년</span></li>
189 + <li><span class="member-label">직업</span><span>교수</span></li>
190 + <li><span class="member-label">직장</span><span>국립**대학교</span></li>
191 + <li><span class="member-label">주요 분야</span><span>수학교육과</span></li>
192 + </ul>
193 + </article>
193 193  
194 - **프로필 사진**
195 - #set($photo = $memberObj.getProperty('photo').value)
196 - #if($photo && $photo != '')
197 - [[image:attach:$photo||width="200"]]
198 - #else
199 - 사진 없음
200 - #end
201 - #end
202 -#end
203 -{{/velocity}}
195 + <article class="member-card">
196 + <div class="member-top">
197 + <div class="member-avatar">박</div>
198 + <div>
199 + <h3 class="member-name">박종석</h3>
200 + <p class="member-sub">장수클럽 멤버</p>
201 + </div>
202 + </div>
203 + <ul class="member-list">
204 + <li><span class="member-label">출생</span><span>1980년</span></li>
205 + <li><span class="member-label">직업</span><span>회사원</span></li>
206 + <li><span class="member-label">직장</span><span>(전직) 이******션</span></li>
207 + <li><span class="member-label">주요 분야</span><span>전산개발</span></li>
208 + </ul>
209 + </article>
210 +
211 + <article class="member-card">
212 + <div class="member-top">
213 + <div class="member-avatar">송</div>
214 + <div>
215 + <h3 class="member-name">송창용</h3>
216 + <p class="member-sub">장수클럽 멤버</p>
217 + </div>
218 + </div>
219 + <ul class="member-list">
220 + <li><span class="member-label">출생</span><span>1980년</span></li>
221 + <li><span class="member-label">직업</span><span>회사원</span></li>
222 + <li><span class="member-label">직장</span><span>엘******션</span></li>
223 + <li><span class="member-label">주요 분야</span><span>배터리 관리 시스템</span></li>
224 + </ul>
225 + </article>
226 +
227 + <article class="member-card">
228 + <div class="member-top">
229 + <div class="member-avatar">신</div>
230 + <div>
231 + <h3 class="member-name">신동현</h3>
232 + <p class="member-sub">장수클럽 멤버</p>
233 + </div>
234 + </div>
235 + <ul class="member-list">
236 + <li><span class="member-label">출생</span><span>1979년</span></li>
237 + <li><span class="member-label">직업</span><span>교수</span></li>
238 + <li><span class="member-label">직장</span><span>미시간중부대학교</span></li>
239 + <li><span class="member-label">주요 분야</span><span>기계공학과</span></li>
240 + </ul>
241 + </article>
242 +
243 + <article class="member-card">
244 + <div class="member-top">
245 + <div class="member-avatar">이</div>
246 + <div>
247 + <h3 class="member-name">이지안</h3>
248 + <p class="member-sub">장수클럽 전속 매니저</p>
249 + </div>
250 + </div>
251 + <ul class="member-list">
252 + <li><span class="member-label">출생</span><span>1998년 04월</span></li>
253 + <li><span class="member-label">직업</span><span>장수클럽 전속 매니저</span></li>
254 + <li><span class="member-label">직장</span><span>장수클럽</span></li>
255 + <li><span class="member-label">주요 분야</span><span>데이터 아카이빙 및 오빠들 관리 ⚽️🐾</span></li>
256 + </ul>
257 + </article>
258 +
259 + <article class="member-card">
260 + <div class="member-top">
261 + <div class="member-avatar">정</div>
262 + <div>
263 + <h3 class="member-name">정현주</h3>
264 + <p class="member-sub">장수클럽 멤버</p>
265 + </div>
266 + </div>
267 + <ul class="member-list">
268 + <li><span class="member-label">출생</span><span>1979년</span></li>
269 + <li><span class="member-label">직업</span><span>의사</span></li>
270 + <li><span class="member-label">직장</span><span>****병원</span></li>
271 + <li><span class="member-label">주요 분야</span><span>감염내과/응급실</span></li>
272 + </ul>
273 + </article>
274 +
275 + <article class="member-card">
276 + <div class="member-top">
277 + <div class="member-avatar">주</div>
278 + <div>
279 + <h3 class="member-name">주광석</h3>
280 + <p class="member-sub">장수클럽 멤버</p>
281 + </div>
282 + </div>
283 + <ul class="member-list">
284 + <li><span class="member-label">출생</span><span>1979년 04월</span></li>
285 + <li><span class="member-label">직업</span><span>회사원 & 학생(연수파견)</span></li>
286 + <li><span class="member-label">직장</span><span>한국****공사 &amp; The University of Sydney</span></li>
287 + <li><span class="member-label">주요 분야</span><span>Data Science &amp; Cybersecurity</span></li>
288 + </ul>
289 + </article>
290 +
291 + <article class="member-card">
292 + <div class="member-top">
293 + <div class="member-avatar">한</div>
294 + <div>
295 + <h3 class="member-name">한인석</h3>
296 + <p class="member-sub">장수클럽 멤버</p>
297 + </div>
298 + </div>
299 + <ul class="member-list">
300 + <li><span class="member-label">출생</span><span>1982년</span></li>
301 + <li><span class="member-label">직업</span><span>회사원</span></li>
302 + <li><span class="member-label">직장</span><span>미래**생명</span></li>
303 + <li><span class="member-label">주요 분야</span><span>보험계리/전산개발</span></li>
304 + </ul>
305 + </article>
306 +
307 + <article class="member-card">
308 + <div class="member-top">
309 + <div class="member-avatar">한</div>
310 + <div>
311 + <h3 class="member-name">한종석</h3>
312 + <p class="member-sub">장수클럽 멤버</p>
313 + </div>
314 + </div>
315 + <ul class="member-list">
316 + <li><span class="member-label">출생</span><span>1979년 10월</span></li>
317 + <li><span class="member-label">직업</span><span>(전직) 공무원 (현직) 천국주민</span></li>
318 + <li><span class="member-label">직장</span><span>(전직) 대한민국국회</span></li>
319 + <li><span class="member-label">주요 분야</span><span>사무처</span></li>
320 + </ul>
321 + </article>
322 +
323 + </div>
324 +
325 + <div class="members-footer">
326 + 이 페이지는 공개용 멤버 소개 페이지입니다. 상세 프로필과 세부 개인정보는 공개 범위를 제한한 내부 영역에서 별도로 관리합니다.
327 + </div>
328 +</div>
329 +{{/html}}
✨ 실시간 통합 피드 (1인 1글 제한)