Алексей Надёжин (ammo1) wrote,
Алексей Надёжин
ammo1

Новый дизайн блога

Я довольно долго не мог решиться на смену дизайна блога, но после Нового года я всё-таки сделал это.




С помощью Юли yoksel я немного разобрался с CSS и теперь более-менее понимаю, как можно сделать с дизайном ЖЖ почти всё, что угодно.

Причин смены дизайна было довольно много:

1. В старом дизайне под комментариями не было видно их количество.
2. Кнопка оставить комментарий была только под постом, но не под комментариями, поэтому многие по ошибке оставляли комментарии не под самим постом, а под чужими комментариями.
3. Мне давно хотелось сделать боковую панель (сайдбар), чтобы поместить там поиск по блогу, ссылки, и прочие полезные вещи.
4. Новый дизайн "резиновый". Он уменьшает картинки на маленьких мониторах и растягивает ленту на больших.

В память о старом дизайне оставлен цвет фона. :)

Надеюсь, что и мне и вам так будет удобней.

Технические детали нового дизайна под спойлером.

[Посмотреть много непонятных слов]
Дизайн сделан на базе стиля Chameleon Unstyled 02.

В CSS прописано следующее:
.j-l-page-inner { /*All*/
padding: 0 20px;
}
.j-l-container { /*All*/
padding: 15px 0;
}

.j-l-header { /*Shapka*/
margin-bottom: 20px;
border-radius: 5px; /*Skruglenie kraev*/
background: #ffffff;
background: url(http://nadezhin.ru/lj/bgo1.jpg) no-repeat left top;
padding: 10px; /*Smeshenie ot kraev*/
box-shadow: 15px 15px 5px -5px rgba(0,0,0,.2); /*prozrachaya ten` s kruglymi krayami*/
}

.j-header-user { /*Nazvanie v shapke*/
margin-left: 20px; /*Sdvig vpravo*/
/*display: none;*/
}

/*.j-header-user-name {
display: none;
}
.j-user-journal-title {
display: none;
}
.j-user-journal-subtitle {
display: none;
}*/

.j-header-user-pic { /*Userpic*/
border-top: 0px solid red;
}

.j-p-layout-wt .j-l-alpha-header,
.j-p-layout-wt .j-l-alpha-content,
.j-p-layout-wt .j-l-alpha-footer { /*Polozhenie sidebar'a*/
margin-right: 270px;
}

.j-l-beta-inner { /*Sidebar*/
padding: 15px;
border-radius: 5px;
background: #ffffff;
box-shadow: 15px 15px 5px -5px rgba(0,0,0,.2);
}

.j-e-buttons { /*Knopki nad postom*/
margin-top: 0px;
}

.j-e { /*Post*/
margin-bottom: 30px;
padding: 10px;
border-top: 8px solid #CCC; /*Seraya poloska sverhu*/
border-radius: 5px;
box-shadow: 15px 15px 5px -5px rgba(0,0,0,.2);
background: #ffffff;
}

.j-e:last-child { /*Nizhniy post*/
margin-bottom: 20px;
}

.j-page-nav { /*Knopki nazad-vpered*/
border-radius: 5px;
background: #ffffff;
padding: 10px;
box-shadow: 15px 15px 5px -5px rgba(0,0,0,.2);
}

.j-l-comments { /*Blok kommentariev*/
border-radius: 5px;
background: #ffffff;
padding: 10px;
box-shadow: 15px 15px 5px -5px rgba(0,0,0,.2);
}
.j-c { /*Kazhdyj kommentariy*/
background: #f0f0f0;
padding: 10px;
}

Если бы мне кто сказал неделю назад, что у меня в кастом цсс будет ТАКОЕ, я бы никогда не поверил. :)



Как вам новый дизайн моего блога?

Стало лучше
112(50.5%)
Стало хуже
22(9.9%)
Мне всё равно
88(39.6%)


Так как я теперь могу делать с этим дизайном почти всё, что угодно, с радостью принимаю любые пожелания.
Tags: Блог
Subscribe
Buy for 200 tokens
Перед Технопарком в Сколково установлены две скульптуры. Справа - заяц, слева - неведома зверушка. Автор скульптур - Ольга Муравина. Кролик, носорожик и малыш, помните? Вот, та самая. Скульптуры вроде бы в одном стиле, но табличка с именем автора установлена только около розового зайца.…
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic
  • 89 comments
Previous
← Ctrl ← Alt
Next
Ctrl → Alt →
Previous
← Ctrl ← Alt
Next
Ctrl → Alt →