№1309. Адаптация блога под дайри.

[Ai_Yamaneko]

Установить автоматически
Для внесения корректировок нужно вручную задать Настройки.

Настройки

Блочный вверху
Заголовок #4d5b6f
Ссылки #4a5156
Записи #4d5b6f

КАРТИНКИ

{---------------------КАРТИНКИ---------------------}
 body {padding: 0!important; background: #4d5b6f url('ФОН');}
 #extratop {background: url('ЭКСТРАТОП') no-repeat; width: 775px; height: 90px; margin: 80px 0px 0px 100px !important; }
 #extrabottom { background: url('ЭКСТРАБОТТОМ') no-repeat; width: 829px; height: 41px; margin: -10px 0px 0px 76px !important;}
 #page-t { background: url('ЗАПИСИ') repeat-y; width:775px !important; margin: 0px 0px 0px 100px !important;padding-top: 20px;}
 .singlePost, .singleComment {padding-bottom: 20px !important; background: url('РАЗДЕЛИТЕЛЬ') center bottom repeat-x; width: 100%;position: relative; margin-bottom: 3%!important;text-align: justify; font: normal 14px; color: #4d5b6f ; font-family: Georgia, serif;}
 .singlePost .postDate {text-align: center; font: bold 14px Georgia; position: absolute; background:url('ДАТА') no-repeat; width: 261px; height:69px; margin: -20px 0px 0px 523px !important;padding-top: 10px;color:#fff!important}
 .postTitle {text-align: center; background: url('ПОДЛОЖКА') repeat; width: 740px; height: 69px;}
 .header span {background: url('ВРЕМЯ') no-repeat; width: 110px; height: 69px; position:absolute; left:-41px!important; color: #fff!important; font: normal 14px Georgia; padding: 12px 0 0 10px!important;}
 .opac6 { background:transparent url('КРЕСТ') 0px 0px no-repeat; height: 0; padding: 0 0 14px 14px !important; width:0;}
 .atTag SPAN {display:block; width:16px; height:16px; line-height:500px; float:left; overflow:hidden; background: url('ТЕМЫ') 0px 3px no-repeat; opacity:0.5!important;}
 .atMusic SPAN {display:block; width:16px; height:18px; line-height:500px; float:left; overflow:hidden; background: url('МУЗЫКА') 2px 2px no-repeat;opacity:0.5!important;}
 .atMood SPAN {display:block; width:16px; height:18px; line-height:500px; float:left; overflow:hidden; background: url('НАСТРОЕНИЕ') 0px 3px no-repeat;opacity:0.5!important;}
 #new_post_title {color:#3c5366;font-family:arial;font-size:14px;text-shadow: 0 1px 0 #f9fafb; background: url('ПОДЛОЖКА') repeat; width: 740px; height: 69px;}
 #JournalCalendar .calHeader {text-align: center; background: url('ПОДЛОЖКА') repeat; width: 740px; height: 32px;}
 #JournalDraft .postTitle {text-align: center; background: url('ПОДЛОЖКА') repeat; width: 740px; height: 69px;}
 #JournalQuote .postTitle {text-align: center; background: url('ПОДЛОЖКА') repeat; width: 740px; height: 69px;}
 {---------------------------------------------------------}
 {---------------------------------------------------------}
 .avatar img {-moz-opacity:.50 !important;opacity:.50 !important; filter:alpha(opacity=50);height: 80%!important; width: 80%!important;}
 .avatar img:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}
 .submit {background: #8aa0c0!important; padding: 5px; }
 .submit:hover {background: #cd9494!important; padding: 5px;}
 #message, .text {border: 1px solid #4d5b6f !important;}
 .postContent a, #epigraph a {border-bottom: 1px dotted #373737; color: #ac2121; text-decoration: none;}
 img {max-width: 720px;}
 .postContent {overflow-x: auto!important;}
 {--------------------пост----------------------------}
 #wrapper{width:980px;min-width:0; position:relative;}
 #bottomNav {position: absolute; bottom: -10px; width: 775px;}
 #postsArea, #addCommentArea, #commentsArea, #authorFav {padding: 0 20px 20px 20px;}
 .header h2 {color: #3c5366!important; font: bold 14px Arial !important; text-shadow: 0 1px 0 #f9fafb!important;width: 450px!important;white-space: pre-line!important;display: block;margin: -12px 0 0 70px;line-height:0.5!important;}
 .postLinksBackg {text-align: left; font: bold 10px Segoe UI, Georgia; color:#8a9aa8!important; text-shadow:0 2px 0 #fff; position: absolute; top: 45px;}
 .comments, .addToQuote, .delFromQuote, .subscribe, .unsubscribe, .quote_post { border-left: 1px solid #373737!important; padding: 0 5px 0 10px!important; }
 .postActionLinks {position: absolute; top: 42px; right: 0px;z-index:10; }
 {------------------------------------------ ссылки по страницам---------------------------------}
 .pages_str a {margin:0;}
 .pages_str a, #pageBar a {text-decoration: none;}
 #pageBar a { color: #4d5b6f; font: normal 14px Georgia; margin-left:7px; padding: 2px 6px 3px 6px; line-height:30px;}
 .pageBar strong, #pageBar a:hover { color: #fff!important; padding: 2px 6px 3px 6px; text-align: center; -moz-border-radius: 20px; border-radius: 20px; line-height:30px; visibility: visible; background: #4d5b6f !important; text-shadow: #e4e9ed 2px 2px 10px; }
 #pageBar {margin-top: -20px;}
 {------------------------------------------ меню---------------------------------}
 #side {color: #e4e9ed; font: normal 14px Georgia; position: absolute; top: -80px;}
 #myDiaryLinks ul, #thisDiaryOwner ul, #globalLinks ul { visibility: visible !important; display:block;}
 #side a {font: normal 16px Georgia; color: #4d5b6f; text-shadow: #e4e9ed 2px 2px 10px; }
 #authorName {color: #8a9aa8!important; font: normal 23px Georgia; position: absolute; top: 90px; left: 70px; text-shadow: #3c53661px 1px 1px!important;text-shadow: none!important;}
 #side h1 a{font: normal 23px Georgia; position: absolute; top: 125px; left: 250px; width: 300px;text-shadow: none!important;white-space: nowrap!important;}
 #side h1 a {text-shadow: #8a9aa8 2px 1px 1px!important;}
 #myDiaryLinks ul {position: relative;z-index:4;}
 #globalLinks ul {position: relative;z-index:1;}
 #addToFav, #delFromFav {position: absolute; top: 0px; left: 90px; width:190px; }
 #writeToAuthor {position: absolute; top: 30px; left: 95px; width:180px; }
 #myDiaryLink, #myCommunityLink { position: absolute; top: 0px; left: 280px; width:103px; }
 #myDiaryLink span.count_box a {position: absolute; top: 0px; right: -120px; }
 #writeThisDiary {position: absolute; top: 1px; left:420px; width:103px; }
 #myDraftLink {position: absolute; top: 0px; left: 575px; width:120px; }
 #tagslistlink {position: absolute; top: 1px; left: 730px; }
 #umailLink {width:50px; position: absolute; top: 30px; left: 300px; }
 a#menuNewUmails {position: absolute; top: 0px; right: -70px;}
 #discussionLink {position: absolute; top: 30px; left: 430px; }
 a#menuNewDescussions {position: absolute; top: 0px; right: -100px;}
 #myFavLink, #mySFavLink {position: absolute; top: 30px; left: 575px; }
 #mainpageLink {position: absolute; top: 32px; left: 700px; }
 {------------------------------------------ теглист---------------------------------}
 #TagsList ul{ width: 230px; margin: 5px 0 0 -125px; background: #4d5b6f; border: 1px dotted #cd9494; }
 #TagsList ul li {border-bottom: 1px dotted #cd9494; padding: 0 0px 3px 0!important;}
 #TagsList ul a{white-space: pre-line!important; padding: 0 5px 0px 0!important;color:#E4E9ED;text-shadow:none!important}
 {------------------------------------------ цифры---------------------------------}
 a#menuNewUmails, a#menuNewDescussions, #myDiaryLink span.count_box a, #myCommunityLink span.count_box a, #myDraftLink span.count_box, #tagslistlink span.count_box a {height: 20px; width: 20px; text-align: center; color: #4d5b6f !important; -moz-border-radius: 20px; border-radius: 20px; line-height:16px; visibility: visible; background: #4d5b6f !important;}
 #myDiaryLink span.count_box a:hover, #myCommunityLink span.count_box a:hover, #myDraftLink span.count_box:hover, a#menuNewUmails:hover, a#menuNewDescussions:hover { color: #ac2121!important;}
 #umailLink .count_box, #discussionLink .count_box, #myDiaryLink .count_box, #myCommunityLink .count_box, #tagslistlink span.count_box {position: absolute; top: 0; left: 0; visibility: hidden; height: 0 !important; }
 {------------------------------------------ дополнение ---------------------------------}
 .postContent B { color : #ee2354; }
 .quote_text {color: #4d5b6f; font-size: 14px; font-family: Arial Black, serif; background:#d2def0; border-left: 5px solid #6a7c95!important; border-right: 2px dashed #6a7c95!important; border-top: 2px dashed #6a7c95!important; border-bottom: 2px dashed #6a7c95!important; padding: 10px; display:block; margin:5px 5px -5px 45px;}
 {------------------------------------------ редактирование постов и комментов---------------------------------}
 #commentsArea_title, #addCommentArea_title {text-align: left; font: normal 16px Georgia; color: #4d5b6f; }
 .singleComment .header span {text-align: center; font: normal 16px Georgia; color: #4d5b6f!important; width:850px; position: absolute; top: -5px;}
 .singleComment .header span {background: none!important; }
 #JournalComments .postActionLinks {position: absolute; top: 40px; right: 0px; }
 #JournalComments .postLinksBackg {position: absolute; top: 40px;}
 .singleComment .quote_comment, .singleComment .profile, .singleComment .diary, .singleComment .umail {border-left: 1px solid #373737; padding: 0 5px 0 10px!important; }
 #JournalCalendar .header {text-align: left; font: normal 16px Georgia; color: #4d5b6f;}
 {------------------------------------------ редактирование календаря, избранного, черновика ---------------------------------}
 #JournalDraft .draft_publish_link, #JournalDraft .draft_prview_link { border-left: 1px solid #373737; padding: 0 5px 0 10px!important; }
 .profile, .diary, .umail { border-left: 1px solid #373737; padding: 0 5px 0 10px!important; }
 {--------------------отключить----------------------------}
 #thisDiaryPhoto, #myAccountLink, .prevnext, .order_button, #authorFav, #authorQuot, #authorLinks, #authorAlbum, #myNotepadLink, #joinThisCommunity, #writeThisCommunity, #communityDraftLink, #communityMyPosts, #communityFav, #communityQuote, #communityAlbum, #leaveThisCommunity, #subscribeEmail, #unsubscribeEmail, #upInChart, #rssLink, #albumLink, #myProfileLink, #photolibLink, #allDiaryLink, #favListLink, #pchListLink, #communityCatalogueLink, #myCommunitiesLink, #randomDiaryLink, #diarySpiritLink, #myQuotLink, #postsCalendar, #optionsLink, #iAmQuit, #thisDiaryOwner_title, #myDiaryLinks_title, #globalLinks_title, #thisDiaryLinks_title, #bottomNavLinks, #w18p, #myLinks, #YaSearch, #lastComments, #myLinksLink {display: none!important;}
 .Attention, #pchs {display: none !important;}
 #epigraph .editPostLink, #diarySupportLink, #faqLink, #Stats, #myFavLink ~ #mySFavLink {display: none!important;}
 #epigraph .urlLink {display: none!important;}
 

Шаблон дизайна взят с FenixBlog.

Comments

[Амь]

Очень клевый!

[Ai_Yamaneko]

akino_ame, спасибо =)

[whisky & soda]

Ai_Yamaneko, спасибо за работу! Очень приятно смотрится. У меня правда глупое уточнение: ширина рабочего поля корректируется (а то некоторые записи выходят за рабочее поле)?

[La mignonne]

whisky & soda, а можно скриншот? я не вижу у вас такой проблемки

[Ai_Yamaneko]

whisky & soda, что именно? Я посмотрела у вас отображается все как и должно быть

[whisky & soda]

La mignonne, быть может, это проблема с кодом таблицы и фотографиями? Потому что я специально проверила, как смотрятся клипы с ютуба и прочее.

скриншоты

[Ai_Yamaneko]

whisky & soda, если у вас в таблице задана конкретная ширина, то да, у вас будет выходить за пределы записей. Так же относится это и к видео. У картинок максимальная ширина было задана только в дневнике к комментариям это не относилось.

[whisky & soda]

Ai_Yamaneko, ясно. Спасибо за ответ. =)

[Ai_Yamaneko]

whisky & soda, исправила, переустановите и нажмите F5 )

[whisky & soda]

Ai_Yamaneko, переустановила (теперь выступающая часть "скрывается за краем" и не выползает за рабочее поле), спасибо вам за беспокойство. =) - с удовольствием похожу с этим дизайном.

[La mignonne]

whisky & soda, там по идее скролл внизу добвляется, если содержимое не влезает)

[whisky & soda]

La mignonne, да, именно так. =)

[Ai_Yamaneko]

whisky & soda,

с удовольствием похожу с этим дизайном.

рада, что приглянулся)

какая милота!! сохраню себе. автору - спасибо))

[Ai_Yamaneko]

космическое_оладье,

[Legenda]

классно, как раз под настроение! еще б разные цвета, бежево\коричневый например.
взяла поносить!!
Спасибо за работу!!!

[Ai_Yamaneko]

Legenda, о других цветах я как-то не думала =)

[Legenda]

Ai_Yamaneko, ну да, и этот хорош.
только лично мне непривычно, что комментарии к посту вверху.. х)

[Ai_Yamaneko]

Legenda, можно убрать строки с .postLinksBackg, но тогда уже будет не то)))

[пуговица-красавица]

возьму поносить, спасибо!

[Ai_Yamaneko]

голубая сталь,

[.Suzi.]

спасибо за диз, очень красивый.
но я выловила глюк - не работают кнопка "удалить" и "изменить" комментарий.

[La mignonne]

.Suzi., да, замените строчку с .postActionLinks на эту

 .postActionLinks {position: absolute; top: 42px; right: 0px;z-index:10; }

сейчас исправим в автоустановке, сможете пепеустановить

[Ai_Yamaneko]

.Suzi., спасибо, не заметила я этот глюк)

[.Suzi.]

La mignonne, Ai_Yamaneko, все работает

[.Suzi.]

это снова я
подскажите, как убрать "затемнение" аватара в дневнике? когда мышку наводишь - аватр видно нормально, стоит убрать - снова становится мутным.

[Ai_Yamaneko]

.Suzi., *сделала заметку, что некоторые части нужно будет вставить отдельно, ибо не все хотят что-то видеть в своем дневе)))*

Все дело в этих строках:

 .avatar img {-moz-opacity:.50 !important;opacity:.50 !important; filter:alpha(opacity=50);height: 50px!important; width: 50px!important;}
 .avatar img:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}

Чтоб не было эффекта пропадания/мерцания, уберите все лишнее, оставьте только размеры аватара)

[.Suzi.]

Ai_Yamaneko, эм... а лишнее это что?.. *ссыпаю моск в совочек*

[Ai_Yamaneko]

.Suzi., хаха, ну как бы все, кроме этого:

.avatar img {height: 50px!important; width: 50px!important;}

[.Suzi.]

Ai_Yamaneko, *чуть не плачет* вижу только вот это:

 .avatar img {-moz-opacity:.50 !important;opacity:.50 !important; filter:alpha(opacity=50);height: 80%!important; width: 80%!important;}
 .avatar img:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}