Как настроить адаптивный дизайн дневника — @дневники: асоциальная сеть

среда, 11 декабря 2019

pickaboo

На дайри все хорошие,

07:31 Как настроить адаптивный дизайн дневника

Пишет My Precious:

10.12.2019 в 15:48

Для начала нажмите у себя на вкладке с дайри ctrl+F5, если ещё не.
Дальше зайдите по этой ссылке (это "Настройки" -> "Дизайн дневника").

Попадаете сюда:
скрин

Выбираете там "Редактировать". Попадаете сюда:
скрин

Там выбираете "Дизайн: адаптивный" и жмете "Сохранить".
Если это не был ваш текущий дизайн, то на предыдущей вкладке выберите его и тоже нажмите "Сохранить".

URL комментария

upd. Если слились цвета:

читать дальше
Кто уже подключил, кидайте сюда скрины или ссылки на свой дневник (если открыто). Очень интересно, у кого что получилось.

@темы: css, Полезное, Адаптивный дизайн

все записи пользователя в сообществе URL

U-mail Дневник Профиль

Mika Dawnray

02.01.2020 в 19:53

Tenno Seremel, nemv, текст под авой, а имя рядом с ней и над датой. А у меня сейчас не над датой, а под ней прячется. Только в динамических.

URL

U-mail Дневник Профиль

Tenno Seremel

02.01.2020 в 20:26

Это потому что #Journal .commentsBox .avatar { display: flex !important; } flex был скопирован из дайревого CSS, хотя что-то мне подсказывает, что надо было поставить block вместо него.

URL

U-mail Дневник Профиль

Mika Dawnray

02.01.2020 в 20:59

хотя что-то мне подсказывает, что надо было поставить block вместо него
Tenno Seremel, поставила и всё встало по местам) Спасибо!

URL

U-mail Дневник Профиль

emercy

03.01.2020 в 01:57

nemv, классная аватарка Это фандомная? Вообще, мой CSS сейчас выглядит вот так Tenno Seremel, спасибо, что выложили, потырила кое-что)). Такой вопрос. Местами там у вас такая запись - content: "\циферка". Попробовала использовать такую пропись для возвращения прежнего вида собаки, которая ссылка на профиль, - не получилось.

.i-doggy:before, body:not(.design_2008) .TagJIco:before, .TagJIco:before { content: "/86603664" !important; }

ЧЯДНТ?

URL

U-mail Дневник Профиль

My Precious

03.01.2020 в 02:04

О, заметила что соо на адаптивный диз перебралось. Какие вы лапушки! Красиво)

URL

U-mail Дневник Профиль

ДайриЖиви

03.01.2020 в 04:29

My Precious, спасибо))

URL

U-mail Дневник Профиль

Tenno Seremel

03.01.2020 в 07:29

emercy, чтобы вернуть старую собаку надо заменить её на картинку. В веб-шрифте такой нет. Т.е. указать content: "" !important; display: inline-block !important; width: ширина !important; height: высота !important; background: transparent url("/путь/к/картинке") left top no-repeat !important;

// Возможно придётся добавить vertical-align, т.е. vertical-align: middle !important; или vertical-align: baseline !important; а может и какое-то определённое значение — смотреть по обстоятельствам.

URL

U-mail Дневник Профиль

emercy

03.01.2020 в 07:50

Tenno Seremel, а, это у вас из веб-шрифта значения! я подумала, из БИ))
Я фоном и делала, только вместо vertical-align поставила margin. Вроде норм?

URL

U-mail Дневник Профиль

Tenno Seremel

03.01.2020 в 07:53

emercy, ну как, если при масштабировании ничего не отвалится, значит да

URL

U-mail Дневник Профиль

nemv

05.01.2020 в 00:12

nemv, классная аватарка Это фандомная?
emercy, эээ... да вроде нет. Как-то наткнулся на россыпь аватарок по типологии Княжны, увидел Дракона и натырил себе.

Я так старую собаку вернул

 {-----------спрятать стилизацию собаки-------------}
 .i-doggy:before, body:not(.design_2008) .TagJIco:before {content: none !important;}
 {-----------вернуть старую собаку-иконку-----------}
 .TagJIco { background: url('/userdir/картинка') no-repeat 0%; position: relative; padding-left: 16px; display: inline-block; text-decoration: none !important; }

Вроде всё нормально сработало и при масштабировании ничего не ломается - хоть с компа, хоть с телефона всё ок.

URL

U-mail Дневник Профиль

ДайриЖиви

05.01.2020 в 03:13

nemv, ок, попробую, когда починят, пока что страница настроек дизайна висит(( У меня тоже вроде никуда не едет, но убрать margin будет не лишним. Даже если не получится, надо хотя бы подчеркивание убрать, а то я забыла))

emercy.

URL

U-mail Дневник Профиль

nemv

13.01.2020 в 13:33

Tenno Seremel, чтобы не флудить в спирите, лучше сюда принесу вопрос про кнопку вверх
Я сейчас попытался вернуть кнопку на адаптивный дизайн с тем кодом, который у меня был
Но она всё равно не появилась. В спирите изучив кучу кодов так и не понял, что именно надо добавить а что убрать.
Можно мой пример поправить?

#bottomNav {
	display: block !important;
}
#bottom_up > a { 
	background: url('/userdir/3/4/7/7/347749/85378176.png') 0px 0px no-repeat; 
	width:50px !important;
	height: 50px !important;
	position: fixed !important;
	bottom: 0px; 
	right:0px; 
	display:block!important;
	line-height: 500px !important; 
	overflow:hidden !important;
	z-index: 3;
}

URL

U-mail Дневник Профиль

Tenno Seremel

13.01.2020 в 13:54

nemv, в адаптивном дизайне нет блока #bottomNav и его содержимого… $¯\_(ツ<img src=$ _/¯" src="static.diarybackup.space/userdir/6/7/8/5/67852/..." width="34px;">

URL

U-mail Дневник Профиль

nemv

13.01.2020 в 14:04

Tenno Seremel, то есть кнопку никак не присобачить? Жаль :dsad:

URL

U-mail Дневник Профиль

Tenno Seremel

13.01.2020 в 14:13

nemv, не-а. Можно запихать в эпиграф и спозиционировать, но его контент показывается только на главной дневника…

URL

U-mail Дневник Профиль

emercy

13.01.2020 в 14:39

Tenno Seremel, а если в экстработтом? Они вроде повторяются на каждой странице.
Ну и думаю, надо внести предложение, чтобы сделали вверх-вниз хотя бы на мобильных, если не внесли.

URL

U-mail Дневник Профиль

Tenno Seremel

13.01.2020 в 14:42

emercy, из CSS нельзя сгенерировать ссылку, если самой ссылки нет в разметке.

В предложения, наверное, да.

URL

U-mail Дневник Профиль

emercy

13.01.2020 в 19:55

Не ставила себе экстраблоки ни разу, думала туда можно буквы, как в эпиграф))

URL

U-mail Дневник Профиль

Tenno Seremel

13.01.2020 в 20:45

emercy, если очень захотеть, буквы можно изобразить. Но ссылка это не буквы, это именно гиперссылка. Будут буквы, но при нажатии ничего происходить не будет

URL

U-mail Дневник Профиль

Лис Хикару

06.02.2020 в 15:54

А вот еще давно хотела спросить код - правда html, но в эпиграф. Вот я туда закинула три картинки в ряд процентным кодом

[more=<img src="" width="30%">]<img src="">[/more]

А проблема в том, что когда с мобильника/планшета - все красиво, но вот с компа они получаются аршинными.
А если таким же кодом, но через пиксели вместо процентов - хорошо с компа, но с мобильника слишком огромные.

Как код добавить max widh, ну или что можно добавить так чтобы одинаково было по размеру?
(или наоборот задать в пикселях, а макс ширину - в процентах, так можно?)

URL

U-mail Дневник Профиль

My Precious

06.02.2020 в 16:05

style="max-width:30%;"

URL

U-mail Дневник Профиль

Лис Хикару

06.02.2020 в 16:25

My Precious, нет, а общий код как выглядит, куда в него именно это вставить?

URL

U-mail Дневник Профиль

My Precious

06.02.2020 в 16:27

Лис Хикару, а общий код как выглядит, куда в него именно это вставить?
Вставляйте прямо как написано:

[more=<img src="" width="300px" style="max-width:30%;">]<img src="">[/more]

Или сколько куда вам там надо)

Но вообще рекомендую разобраться с флексами. Тогда можно будет воротить конструкции типа

<div style="display: flex; justify-content:center;"><img src="" style="max-width:30%; min-width:300;"> <img src="" style="max-width:30%; min-width:300;"> <img src="" style="max-width:30%; min-width:300;"></div>

- и они будут выстраиваться в линию на широких экранах и в колонку на узких - или как захотите.

URL

U-mail Дневник Профиль

nemv

06.02.2020 в 16:28

style="width:390px; max-width:100%; "

Лис Хикару, в пикселях задавать максимальную ширину которую хочешь видеть на компе. А проценты означают что картинка не шире поля записи/эпиграфа
Если поставить 33% то как раз будет занимать максимум треть поля

URL

U-mail Дневник Профиль

Лис Хикару

06.02.2020 в 16:57

My Precious, nemv, спасибо огромное!!! :ddlike:

И еще при случае - где-то был код CSS как вернуть старую собачку?

URL

U-mail Дневник Профиль

emercy

06.02.2020 в 17:34

Лис Хикару, да вот же, выше, или я вас неправильно понимаю:
Пишет nemv:

05.01.2020 в 00:12

Я так старую собаку вернул
{-----------спрятать стилизацию собаки-------------} .i-doggy:before, body:not(.design_2008) .TagJIco:before {content: none !important;} {-----------вернуть старую собаку-иконку-----------} .TagJIco { background: url('/userdir/картинка') no-repeat 0%; position: relative; padding-left: 16px; display: inline-block; text-decoration: none !important; }
Вроде всё нормально сработало и при масштабировании ничего не ломается - хоть с компа, хоть с телефона всё ок.

URL комментария

URL

U-mail Дневник Профиль

Лис Хикару

06.02.2020 в 19:48

emercy, да это оно! Спасибо огромное!
Действительно - вот же оно нескольским постами выше... :facepalm:

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

А на служебных она работает? Или только в своем дневнике?

URL

U-mail Дневник Профиль

nemv

06.02.2020 в 21:16

Лис Хикару, нет, конечно, это же для своего днева CSS. Ну так и иконки собаки на служебных тоже нет... я не видел, по крайней мере

URL

U-mail Дневник Профиль

Лис Хикару

06.02.2020 в 22:38

Жалко все равно)
Например в умылах дизайн как раз служебных, и там есть собака рядом с именами как раз.

URL

U-mail Дневник Профиль

emercy

06.02.2020 в 22:47

Лис Хикару, есть расширения для браузера: stylus, stylish, violentmonkey, tapemonkey. Попробуйте поменять в умылах с помощью одного из них.

URL

U-mail Дневник Профиль

← Предыдущая 1 2 3 4 5 Следующая → Последняя

Добавить комментарий

Расширенная форма

Использовать аватар

Изображения

Подписаться на новые комментарии