Design: Irresistible

[;mars]

Design: Irresistible
Исходники для дизайна взяты вот с этого сайта: http://demo.woothemes.com/?name=irresistible

НАСТРОЙКИ

#wrapper{ min-width:800px!important; width:600px; margin: 0 auto !important; padding:0 !important; overflow:hidden !important;}
 #side { width:800px !important; margin:0 !important;}
 #page-c { width:800px !important; margin:0 !important;}
 #page-t { margin:0 !important;padding: 20px;}
 img { max-width:750px;}
 {---------------------------------------}
 html, body { background: url('КАРТИНКА1') repeat-x, url('КАРТИНКА2') 0% 100% repeat-x, #18191d;}
 a, #epigraph a, a:hover { text-decoration:none; cursor:crosshair!important;}
 #epigraph a { color:#fff}
 #epigraph a:hover { border-bottom:1px dashed #fff}
 #page-c { position:relative; top:200px; border-radius: 20px; background:rgba(0, 0, 0, 0.4); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#000,endColorstr=#000);}
 #side { margin-top:5px;}
 #side a { color: #fff;}
 #side a:hover { color: #A3D5EA;}
 #side ul{ background:rgba(255, 255, 255, 0.3); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFF,endColorstr=#FFF); border-radius:7px; font-size:10px;}
 #side ul li { padding: 5px; text-transform:uppercase; min-width:155px; display:block; padding-right:20px;}
 #side ul li:hover { background:rgba(255, 255, 255, 0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFF,endColorstr=#FFF); margin-left:-7px; margin-right:-7px; padding-left:12px; display:block; padding-right:27px;}
 #side ul a { color:#333;}
 #side ul a:hover { color:#000;}
 .menuSection_title { text-transform:uppercase; font-size:14px; color: #fff!important; padding-bottom: 10px;}
 #iAmQuit a{text-transform:uppercase; font-size:14px; color: #fff; cursor:crosshair!important;}
 .menuSection_title b, #iAmQuit a { font-weight: 400;}
 .top #YaSearch{ width:178px; height:32px; background: url('КАРТИНКА3') no-repeat; margin-top: -23px;}
 #YaSearchForm #yaquery { border-color: transparent; color:#fff;}
 #YaSearchForm .submit{ background: url('КАРТИНКА4') 20px no-repeat; border-color: transparent; color: transparent; height:21px; position:relative; top:-5px;}
 #TagsList ul { margin-left:172px; margin-top: -48px; width:auto;}
 #TagsList ul li:hover { color:#444;}
 #pchs, #lastComments, #myLinks { display: none;}
 #bottomNav { margin-top:240px;}
 #bottomNav a { color:#444; font-size:20px; font-family:"Book Antiqua"; font-style:italic;}
 #bottomNav a:hover { color:#ccc;}
 #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink { display: none!important;}
 #Stats a { position:absolute; margin-top:10px; left:0%; color:#444; text-transform:uppercase; font-size:10px; font-family:"Arial"; font-style:normal;}
 #side h1 { color:#fff; position: absolute; top:100px; font-size:40px; font-family:"Book Antiqua"; font-style:italic;}
 #side h1 span { color:#fff;}
 #side h1 span:hover { color:#A3D5EA}
 .top #authorName { font-size: 100%; font-weight: 400; font-size:17px!important; font-style:italic;}
 .top #authorName { text-align: left; float: left;}
 .top #thisDiaryInfo { left: 70px; position: absolute; text-align: left; top: 130px; width: 100%;}
 .top #thisDiaryPhoto { display:none!important;}
 .header, .header h2, .postDate, .countSecond .postDate { color:#A3D5EA; font-size:20px; font-family:"Book Antiqua"; font-style:italic;}
 .communityName a, .sign, .authorName a {color:#A3D5EA}
 .header, .singlePost.countSecond .header { background:rgba(0, 0, 0, 0.2); margin: 0px -20px; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#000,endColorstr=#000); padding: 5px 20px;}
 .paragraph { padding-top:10px;}
 .postLinksBackg a { text-transform:uppercase; font-size:9px; padding-top: 30px;}
 .atTag a:hover { color:#6099FF;}
 .postLinksBackg a:hover { color:#fff;}
 .atTag { padding-top:5px; padding-left:25px; height:25px; background:url('КАРТИНКА5') no-repeat;}
 .atMusic { padding-top:5px; padding-left:25px; height:25px; background:url('КАРТИНКА6') no-repeat;}
 .atMood {padding-top:5px; padding-left:25px; height:25px; background:url('КАРТИНКА7') no-repeat;}
 p.atTag em span, .atMusic em span, .atMood em span { display:none !important; color: trancparent;}
 .atTag em, .atMusic em, .atMood em, .paragraph a { color:#aaa; text-decoration:none;}
 #epigraph .header { background:transparent;}
 .order_button{ display: none!important;position:absolute;}
 span.quote_text { display:block; background:rgba(0, 0, 0, 0.4); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#000,endColorstr=#000); border-bottom: 15px solid #000000; color: #FFFFFF; font: 1em "Georgia", "Times New Roman", "Times", serif; padding: 10px;}
 .avatar img { width:80px; height:80px; padding:5px; border: dashed 1px #ccc;}

Если хотите дневник во всю ширину экрана, просто уберите строчки до пунктирной линии.
Минимальный удобный размер - 800px. Если убрать секции меню, например, "Дневник" или поиск, тогда ширину враппера можно сделать меньше 800px.

КАРТИНКА1 www.10pix.ru/img1/782605/7120826.jpg
КАРТИНКА2 www.10pix.ru/img1/794128/7120831.gif
КАРТИНКА3 www.10pix.ru/img1/814285/7120834.png
КАРТИНКА4 www.10pix.ru/img1/1799/7120837.png
КАРТИНКА5 www.10pix.ru/img1/1734/7120821.png
КАРТИНКА6 www.10pix.ru/img1/718558/7120814.png
КАРТИНКА7 www.10pix.ru/img1/1702/7120817.png

Дизайн: табличный
Навигационная панель: вверху

Шрифт:
заголовка обычный 12
текста обычный 12
гарнитура Arial

Цвет текста:
записи #ccc
ссылки #A3D5EA

ваш дневник/?design=4687792 - ссылка на примерку дизайна

изменять разрешаю

@темы: css, design

Comments

[vertu_dragon]

Хм, я как всегда - все вроде работает, но фон не отображается.. Хм, может, опять дело в браузере? В предпросмотрщике все вроде нормально...

[;mars]

х) прости, опять я перепутала картинки в боди. первую и вторую местами поменяй)

[vertu_dragon]

;mars,
Эпик )

[Scabior.]

Замечательный дизайн, можно?
И ещё у меня вопрос, а нельзя ли сделать так, что бы фон не прокручивался? Как, например, у меня сейчас на дневнике?
А то я в кодах слаб х)

[;mars]

Izzya Nobody, даааааа
хмм. можно. но тогда нужно зафиксировать меню, а значит разделить фон на вон ту дурацкую полосочку и все остальное х)
ну а если на все это покласть, то просто в body вставить background-attachment:fixed

вам первый или второй вариант?

[Scabior.]

;mars, думаю, можно на весь тот мудрый вариант покласть
Хотя, говорю,в кодах полный нуб и как и чо не представляю)

[;mars]

а второй вариант-то понятен? х)
по сути не так плохо выглядит, я посмотрела
только, нижняя полоска-фон исчезает в неведомые дали, но наверное это не страшно

[;mars]

Izzya Nobody, а почему так обязательно фиксированный фон?
если хотите можно придумать что-нибудь другое Оо

[Scabior.]

;mars, понятно, попробуем)
просто в голову взбрело0
а Вы делаете дизы на заказ?

Izzya Nobody, делаю. совершенно бесплатно х)

[Scabior.]

сердце пирата, хо-хо, можно я буду вас любить? хД

Izzya Nobody, чего уж, запрещать не могу х)

да и вообще мне просто нравится этим заниматься)

[Scabior.]

сердце пирата, тогды, если что, мне можно обращаться к Вам7
и да, у меня, отчего то, в вашем дневнике не видно текста записи Оо

ну так это же хорошо)

Izzya Nobody, аааа, это новый диз который я сейчас делаю, поэтому там еще все весьма косячно, не обращайте внимания х)

ну ко мне или в соо. без разницы

[HARIZMA]

Очень красиво. Я поставила себе, но хотела поменять фон. Вношу изменения, в настройках они отображаются, сохраняются, а на деле - всё остается таким же как и до - синим. почему ничего не хочет меняться. (

[;mars]

синий, то есть тот же фон или просто цвет?
можете написать код, который, прописывали?

[Смотритель_хаоса]

Ощущаю себя полным идиотом....как все эти дизайны применяются..(

[;mars]

Смотритель_хаоса, ээм, при подключении платных услуг(css), в настойках оформления появляется дополнительное поле, куда собственно и нужно сунуть код, написанный выше, ну и картинки добавить
а так можете только "примерить", но у вас все немножко съедет из-за блоков рекламы
вот так

[Смотритель_хаоса]

;mars, Уф, спасибо)

[;mars]

Смотритель_хаоса, не за что

[lacrimossa]

хмм. можно. но тогда нужно зафиксировать меню, а значит разделить фон на вон ту дурацкую полосочку и все остальное х)

Знаю, много времени прошло, но можно поподробней?)) Понятно, что вначале нужно разрезать на 2 части, а вот затем: как одну часть с заборчиком закрепить сверху, а оставшуюся сделать непрокручивающейся в качестве фона? Просто очень понравился дизайн, но у меня записи длинные и в самом конце страницы фон полностью черный, а хочется чтобы так же как и сверху))
Если не трудно, подскажите пожалуйста. Заранее спасибо)))

[Смотритель_хаоса]

lacrimossa, Хых, да уж - немало. Странное чувство оставлять комментарии к записям, которые до меня месяцами, а то и годами не комментировались