레이블이 jugug인 게시물을 표시합니다. 모든 게시물 표시
레이블이 jugug인 게시물을 표시합니다. 모든 게시물 표시

2010년 8월 23일 월요일

트위터 MonkeyFly용 스킨 결정!

egoing 님께서 개발하신 Monkeyfly는 웹기반 트위터의 기능을 극대화시키는 확장이다.
Monkeyfly에서는 css를 활용한 스킨 기능을 지원하는데, 많은 능력자분들께서 css를 공개해주셨다.

그 중 내가 주력으로 사용해온 것은 희주(@jugug) 님의 CSS였다.

한동안 사용하면서 느낀 단점은 지정된 배경색이 원래의 배경을 다 덮어버린다는 거.
(물론, 개발자가 의도한 것임. 내가 느끼기에 단점이라는 것 뿐임)

그래서, 글꼴은 그대로 두고, 배경 및 색깔 부분만 제거해서 쓰기로 했다.
아래는 그렇게 수정된 CSS다.

body #header #logo img
{
    padding-left: 0 !important;
}
#content,.wrapper
{
    border-radius: 5px !important;
}
ul.top-navigation
{
    padding: 0.5em 0;
}
ul.top-navigation a
{
    border-left: 1px solid #cde;
    font: bold 11px tahoma !important;
    margin-right: 1px;
    padding: 0 0 0 5px;
}
ul.top-navigation li:first-child a
{
    border-left: 0;
}
ul.top-navigation a:hover
{
    text-decoration: none;
}
#update_notifications
{
    height: 46px !important;
}
#globalTab
{
    margin-top: 17px;
}
.status-content,.entry-content
{
    font: 13px 나눔고딕 !important;
}
.status-body strong a
{
    font: bold 11px Meiryo !important;
}
td.tdnest:nth-child(even)
{
    background-color: #f5f5f8;
}
#side_base
{
    border-left: 0;
}
#side
{
    width: 198px !important;
}
#side a
{
    font-family: tahoma !important;
    font-size: 11px;
    font-weight: bold;
}
.list-header,.list-header-inner
{
    border-radius: 5px 5px 0 0;
}
#footer-container
{
    min-height: 0 !important;
}
.read-mark
{
    border-bottom: 0 !important;
}
#expand_sidebar
{
    position: fixed;
    top: 82px !important;
}
#pb-side-box
{
    left: 0;
    top: 150px !important;
}
#pb-side-content li
{
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
#pb-side-content li a
{
    font: 11px tahoma !important;
    padding: 1px !important;
}
#pb-side-content #primary_nav
{
    float: left;
    padding-right: 5px;
}
#pb-side-content #side_lists
{
    border-left: 1px solid #ddd;
    float: left;
    padding-left: 5px;
}
#pb-side-content .lock-icon
{
    width: 8px !important;
}
#pb-side
{
    border-style: solid;
    border-width: 1px 0 1px 1px !important;
}
#pb-side-top,#pb-side-bottom
{
    left: 0;
}

이렇게 수정된 CSS가 좀 길어보여서 압축해서 사용하기로 했다.
(사실, 이 CSS는 로컬에 저장되기 때문에 전혀 빨라지는 일은 없음 ㅎㅎ)

body #header #logo img{padding-left:0 !important;}#content,.wrapper{border-radius:5px !important;}ul.top-navigation{padding:0.5em 0;}ul.top-navigation a{font:bold 11px tahoma !important;margin-right:1px;padding:0 0 0 5px;border-left:1px solid #cde;}ul.top-navigation li:first-child a{border-left:0;}ul.top-navigation a:hover{text-decoration:none;}#update_notifications{height:46px !important;}#globalTab{margin-top:17px;}.status-content,.entry-content{font:13px 나눔고딕 !important; }.status-body strong a{font:bold 11px Meiryo !important;}td.tdnest:nth-child(even){background-color:#f5f5f8;}#side_base{border-left:0;}#side{width:198px !important;}#side a{font-weight:bold;font-family:tahoma !important;font-size:11px;}.list-header,.list-header-inner{border-radius:5px 5px 0 0;}#footer-container{min-height:0 !important;}.read-mark{border-bottom:0 !important;}#expand_sidebar{top:82px !important;position:fixed;}#pb-side-box{top:150px !important;left:0;}#pb-side-content li{padding:0 !important;border:0 !important;margin:0 !important;}#pb-side-content li a{padding:1px !important;font:11px tahoma !important;}#pb-side-content #primary_nav{padding-right:5px; float:left;}#pb-side-content #side_lists{border-left:1px solid #ddd;padding-left:5px; float:left;}#pb-side-content .lock-icon{width:8px !important;}#pb-side{border-width:1px 0 1px 1px !important;border-style:solid;}#pb-side-top,#pb-side-bottom{left:0;}

수정 및 배포를 허락해주신 희주(@jugug) 님께 다시 한번 고맙다는 말씀을 드립니다.