№625 ЖЖ

[Lina~Hitagi]

Итак, моя попытка частично реализовать вот такой вот простой дизайн ЖЖ на дайри. Честно скажу, маялась с кодом очень и очень долго, но моё природное упрямство не дало всё забросить, итого вот что вышло.

Настройки:

Экстратоп - static.diary.ru/userdir/8/8/6/4/886437/55283237...
Дизайн табличный, навигационная панель слева.
Заголовок - Обычный - 16
Текст - обычный - 10
Шрифт - Veranda
Цвета:
Заголовка - #b5b5b5, ссылки - #727272, записи - #ccc, оффтопика - #999.
Все границы - #.

Код:

body {background:#fff; padding: 0px !important;}
 a {text-decoration:none}
 a:hover {cursor:help; text-decoration:none}
 #wrapper{width:700px; min-width:0; margin: 0 auto !important;padding:0px !important;}
 #extratop {background: url('ЭКСТРАТОП') no-repeat; height:200px; width:700px; background-position: center !important;margin-top:40px; }
 #page-c{ width:694px !important;margin:0 !important;padding-top:10px; border-left:3px double #ccc; border-right:3px double #ccc; background: #fff !important;}
 #page-t { width:440px !important;margin:0 !important; margin-left:250px !important;}
 #JournalComments #page-t, #JournalFavorite #page-t { width:694px !important;margin-left:0px !important;}
 .postDate {text-align:center;}
 .postTitle {color:#ссс !important; border-bottom:8px solid #ccc;text-transform: lowercase; font-size:13pt !important}
 .postLinksBackg a {text-transform: lowercase;font-size:10pt !important; color:#000}
 .comments_count_link {position: relative; left:-120px;color:#fff; border-right:1px solid #000;}
 .comments{ border-right:1px solid #000;}
 .diary { left:2px;float:left;}
 #side {display:block !important; position:fixed !important; position: absolute; top: 0px; left:2px;background:#484545; border-bottom:4px solid #f40a2b;margin-top:0px !important; margin-left:0px;border-bottom:1px solid #878080; width:100% !important;height: 47px; font-family:Times New Roman,sans-serif;}
 #myDiaryLink a {position:fixed !important;position: absolute; top: 25px;left:55px !important;font-size:9pt !important;color:#fff !important;}
 #myDiaryLink .count_box a {margin-left:74px !important;}
 #writeThisDiary a {position:fixed !important; position: absolute; top: 25px;left:140px !important;font-size:9pt !important;color:#fff !important;}
 #myFavLink a {position:fixed !important; position: absolute; top: 25px;left:215px !important;font-size:9pt !important;color:#fff !important;}
 #umailLink a {position:fixed !important; position: absolute; top: 25px;left:280px !important; font-size:9pt !important;color:#fff !important; }
 #umailLink .count_box a {margin-left:42px !important;}
 #iAmQuit a {position:fixed !important; position: absolute; top: 5px;left:280px !important; font-size:9pt !important;color:#fff !important;; }
 #addToFav a, #delFromFav a {position:fixed !important; position: absolute; top: 25px;left:400px !important;font-size:9pt !important;color:#fff !important;}
 #writeToAuthor a {position:fixed !important; position: absolute; top: 25px;left:520px !important;font-size:9pt !important;color:#fff !important;}
 #YaSearch { visibility:visible !important; position: absolute !important; left: 650px; top: 5px; width:350px !important; }
 #YaSearchForm {display:block !important;visibility:visible !important; height:15px !important; font-size:8pt !important;}
 #side h1 a{position: absolute; top: 3px;left:400px !important;font-size:11pt !important; font-weight:lighter !important; color:#fff !important; text-transform:none;}
 #authorName {position: absolute; top: 2px;left:55px !important; font-size:12pt !important; font-weight:lighter !important; color:#fff !important; }
 #thisDiaryPhoto {display:block !important; position:fixed !important; position: absolute; top: 5px; left:10px;}
 #thisDiaryPhoto img {display:block !important; position:absolute; width:35px !important; height:35px !important; }
 .avatar img {width:100px !important; min-width:100px !important; max-width:80px!important;border: 5px solid #ccc}
 span.quote_text {display: block; margin-left:30px;padding-left:10px; padding-right:10px !important;color: #7F7F7F !important; border-left:3px solid #ccc; font-style:italic !important}
 #message, #htmlbox , #msgTitle, #postTitle, #atMusic, #atMood, #tags { border:1px solid #ccc !important;left:25px !important; color:#ccc}
 #msg_form a {color:#ccc }
 #epigraph {position:absolute; margin-top:45px !important; margin-left: -250px !important; background: none; width:220px; border:0px solid #AA9F99; }
 hr {background:#CCCCCC;border-top:6px solid #CCCCCC;color:#CCCCCC;height:1px}
 h1 {text-transform: lowercase;font-size:11pt !important; color:#000}
 .atTag {border-left:14px solid #CCCCCC;}
 .atTag a {font-style: normal !important; font-size:7pt !important;}
 #thisDiaryLinks, #more_login, #myLinks, #albumLink, #allDiaryLink, #photolibLink, #bottomNav, #sortFromBegin, #sortFromEnd, #sortFromLastComment, .order_button, .urlLink, #lastComments, #pchs, .order_button, #topNav, #subscribeEmail, #unsubscribeEmail, #postsCalendar, #rssLink, #upInChart, #headlineList, #myDraftLink, #myNotepadLink, #myQuotLink, #discussionLink, #myLinksLink, #myProfileLink, #albumLink, #optionsLink, #photolibLink, #allDiaryLink, #mainpageLink, #favListLink, #pchListLink, #communityCatalogueLink, #myCommunitiesLink, #myCommunityLink, #randomDiaryLink, #diarySpiritLink, #diarySupportLink, #faqLink, #YaSearchForm_title, #Stats, .postTitle span, .addToQuote, .quote_post, #tagslistlink, .profile, .umail, .atTag span {display:none !important;}

Эпиграф - это и есть та боковая строчка с Вашим аватором, правилами и т д. url аватара и прочего в эпиграфе прописывается отдельно. Его крайне не рекомендуется убирать, однако если Вы не хотите, чтобы на главной был эпиграф, замените:

 #page-t { width:440px !important;margin:0 !important; margin-left:250px !important;}

на

 #page-t { width:694px !important;margin:0 !important;}

Пример эпиграфа (в HTML редакторе!!!)

<div align="center"><div style="text-align: center"><img src="ВАШ АВАТАР" class="simg" width="100px;" height="100px;"></div>
<hr></div>
   <h1> Introduction</h1>

Welcome to [J]My Diary[/J]! 
 
»» Если вы хотите добавить меня в ПЧ, прочитайте сначала <a href="http://это" target=_blank>это</a>. 
»» Если вам нравится моё творчество, не стесняйтесь, скажите об этом <a href="http://здесь" target=_blank>здесь</a>.

<hr>
   <h1> rules</h1>
»» Не ругаться\материться.
»» Не критиковать мои работы.
»» Запрещены холивары.

ВНИМАНИЕ! В данном дизайне разрешено менять ТОЛЬКО экстратоп.
Любой на ваше усмотрение, размером 700*200.


При использовании дизайна просьба ставить баннер сообщества.

Comments

[dear_penis]

Lina~Izumi, а разрешите взять экстатоп и поставить на эпиграф в бесплатном дневнике?

[Lina~Hitagi]

V_kusnoe pechenk_O
Конечно =)

[Sei Densetsu]

Взяла поносить :3

спасибо, порадовало очень, хотелось простоты

[Алисскин]

Очень красиво! Возьму поносить!

[русая лисица]

Lina~Izumi
Я бы взяла, но цвет текста для меня слишком бледен.

[Lina~Hitagi]

Inien
Измените цвет записи в настройках, какие проблемы?)

[русая лисица]

Lina~Izumi
Никаких)
Можно пожаловаться?
Если кол-во комментариев больше 2 страниц, то текст наплывает друг на друга.
Вот так:

Можно как-нибудь сделать, чтобы этого не было?

[Lina~Hitagi]

Inien
Вот это у вас комментов...
Я расчитывала только максимум на двузначное число

Попробуйте лиюбо убрать эту строчку либо отрицательное значение лефт сделать побольше:

.comments_count_link {position: relative; left:-120px;color:#fff; border-right:1px solid #000;}

[русая лисица]

Lina~Izumi
Спасибо)
Я строчку просто уберу, иначе хуже смотрится)

[Umineko]

спасибо, взял)

[Lina~Hitagi]

Umineko
Не за что)
Отпозиционируйте тогда ссылки:
#communityFav — избранное сообщества
#communityQuote — цитатник сообщества
#communityAlbum — альбом сообщества

Или добавье их через запятую в последнюю строчку, где свойство {display:none !important;}

[Umineko]

Ой, спасибо огромное!)

[IzabellaFox]

Если вы не против я возьму в коллекцию=)

[zebadiah]

возьму поносить, благодарю, он потрясающий)

[Мммммм]

Взял

Lina~Izumi , дизайн изумителен! Как раз то, что я искала^^ Можно поменять экстратоп и забрать себе?

[.Rivarez]

Очень красивый дизайн )
Утащил, спасибо большое.
Цвет текста Вы вроде разрешили сделать темнее?