웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
XE 알림센터 스킨을 iOS 알림창 비슷하게 만들기
2013.08.21 09:12
XE 알림센터 Lite: http://www.xpressengine.com/index.php?mid=download&package_srl=21374711
알림센터 스킨 배경색을 애플 iOS 패턴 이미지로 바꾸는 팁입니다.
간단한 CSS 수정이라서 보잘 것 없는 내용이지만, 그래도 누군가에겐 도움이 되리라 생각해서 글 올립니다.
modules/ncenterlite/skins/default 기본스킨의 '검은색' 컬러셋을 수정합니다.
파일 수정 전에 반드시 백업해두세요.
default/css/ncenterlite.black.css의 강조한 줄을 수정하시면 됩니다.
#nc_container { border-bottom-color:#555; background:url('http://cdn.osxdaily.com/wp-content/uploads/2011/10/NSTexturedFullScreenBackgroundColor.png'); color:#B0B0B0; opacity:0.95; } #nc_container a { color:#B0B0B0; } #nc_container a:hover { color:#B0B0B0; } #nc_container strong { color:#F3F3F3; } #nc_container .list { background:url('http://cdn.osxdaily.com/wp-content/uploads/2011/10/NSTexturedFullScreenBackgroundColor.png'); filter:alpha(opacity=95); opacity:0.95; -moz-opacity:0.95; } #nc_container .list li { border-color:#555; } #nc_container .list li a:hover {filter:alpha(opacity=75); opacity:0.75; -moz-opacity:0.75; } #nc_container .list span.ago { color:#D4AF37; } #nc_container .list .more { background: #555; } #nc_container a.readall { display:none; color:#555; color:#D83722;} #nc_container a.notify { color:white; } #nc_container a.notify .num { background-color:#D83722; color:white; } #nc_container ul.nc_memu li { padding-right:5px; }
백그라운드 이미지(http://cdn.osxdaily.com/wp-content/uploads/2011/10/NSTexturedFullScreenBackgroundColor.png)는 아래 주소에서 배포하고 있습니다.
http://osxdaily.com/2011/10/15/os-x-lion-ios-5-grey-linen-tile-wallpaper/
두둠칫~!