load animation

[alex93skr]

@k-ivan Иван привет, подскажи пожалуйста, какой стиль отвечает за анимацию при открытии вкладки? Вот это плавное секундное появление фоновой картинки. Хочу его отключить через CSS, но не смог найти как.

[k-ivan]

@alex93skr Привет! Возможно имеет смысл сделать анимацию фона опцией(надо подумать будет над этим).
В качестве быстрого решения, можно применить стили:

.bg {
  transition: none;
  opacity: 1;
}

Важно: анимацию эти стили отключат, но если картинка загружается из урл адреса, ожидание подгрузки останется.

[alex93skr]

@k-ivan и еще небольшая просьба, тут же попрошу, что бы темы не плодить. Можешь добавить кнопку "найти" к форме поиска? По UI/IX она должна быть обязательно, да и в целом это очень нужно для юзабилити. Хоте бы просто ее туда добавь с { display: none }, но что бы она была физически, а дальше я уже сам дорисую стилями.

[k-ivan]

Хорошо, правда она будет относится только к поисковым системам(при поиске по закладкам событие срабатывает при наборе текста, поэтому смысла в ней нет). По срокам пока не скажу, как будет время.

[alex93skr]

@k-ivan спасибо за быстрый ответ, возможность менять стили это просто пушка. Огромное количество перебрал аналогов твоему расширению, но все решила именно эта фича. Для среднего пользователя, вряд ли она будет иметь решающее значение, но это они просто не понимают какие возможности оно открывает.

[k-ivan]

Очень рад, что нравится, но без фанатизма ), так как эта опция синхронизируется и ее объём ограничен браузером.

[k-ivan]

@k-ivan и еще небольшая просьба, тут же попрошу, что бы темы не плодить. Можешь добавить кнопку "найти" к форме поиска? По UI/IX она должна быть обязательно, да и в целом это очень нужно для юзабилити. Хоте бы просто ее туда добавь с { display: none }, но что бы она была физически, а дальше я уже сам дорисую стилями.

Кнопка поиска появится в ближайшем обновлении.

[alex93skr]

@k-ivan Иван привет! Поздравляю с 5.6.0 - отличный релиз, все мелочи учтены. У меня она теперь выглядит вот так:

Вот на этих стилях:

`
.bg {
transition: none;
opacity: 1;
background-color: #a0a0a0;
}

header {
margin-top: 40px;
margin-bottom: 10px;
}

.bookmark__wrap:hover {
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.24);
}

.bookmark__action {
display: none;
}

.bookmark:nth-child(8),
.bookmark:nth-child(15),
.bookmark:nth-child(20),
.bookmark:nth-child(25) {
grid-column-start: 1;
}

.bookmark__title {
font-weight: 200;
}

.search-icon {
opacity: 0.5;
}

#searchSubmit {
width: 70px;
border-radius: 4px;
background-color: #ffcc00;
font-size: initial;
}

#searchSubmit:hover {
background-color: #f5c400;
}
`

Просто идеал. Никак только теперь не найду, где в магазине приложений хрома поставить шестую звезду)

[k-ivan]

@alex93skr Алекс привет! Спасибо! Выглядит отлично, мне нравится ☝️

[alex93skr]

@k-ivan Иван, ты уже придумал куда дальше развивать продукт? Потому что у меня есть еще пара идей. Например, прикрутить к поисковой строке функцию автодополнения запроса. У яндекса, насколько я понял, это можно делать через api предиктора https://yandex.ru/dev/predictor/

В инфинити https://chrome.google.com/webstore/detail/infinity-new-tab-pro/nnnkddnnlpamobajfibfdgfnbcnkgngh есть autocomplete predictions для всех поисковиков, можно дернуть алгоритм

[alex93skr]

Про какое "другое расширение" ты говоришь, у тебя есть еще один speed dial? Просто я вижу, что visual-bookmarks у тебя в репозитории самое звездное и думал, что бросаешь все силы на него.

[k-ivan]

Второе расширение, это не speed dial, это стартовая вкладка, и там тоже есть поле поиска и в нем есть автокомплит. Оно вынесено в приватный репозиторий, поэтому в паблике его не видно.

[k-ivan]

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

[alex93skr]

Посмотрел WanderTab и обзавидовался! Но честно говоря, не совсем понял сакраментальную идею расширения, как по мне очень сильный перегиб в сторону визуала при практической полном отсутствии функциональности. Вряд ли кто-то будет настраивать под себя вкладку, что бы открыть и просто смотреть на нее. По первой подумал, что это у тебя некая реинкарнация visual-bookmarks, но потом понял, что это самобытный продукт с совершенно другими целями. Хотя не ясно, зачем тратить столько сил на WanderTab для 90 человек, есть уже есть visual-bookmarks с готовой клиентской базой в 10к+, которые только и ждут, когда у них появится виджет погоды и автозаполнение в поиске 😎

[k-ivan]

Есть такое расширение, momentum, у которого тоже стартовая вкладка с прицелом в UI, и более 3 миллионов пользователей. И большая часть кастомизации этого визуала спрятана за платной подпиской в отличии от wandertab. При этом wandertab уже сейчас превосходит momentum по части кастомизации интерфейса. Конечно, часть опций отсутствует и у моего расширения(пока, но это в основном всякие тудулисты). Я это к тому, что даже если кажется, что это всего лишь красивый стартовый экран, не факт, что это не будет людям интересно. Причем в случае с momentum люди даже платить готовы, чтобы получить дополнительную кастомизацию.

Ну и кол-во пользователей обусловлено тем, что расширение очень молодое и оно нигде и не кем не рекламировалось. Закладки родились аж в 2016 году. Количество сил выделяется обоим продуктам одинаково(даже закладкам больше, в силу большей сложности самого расширения).

[alex93skr]

@k-ivan Иван привет! Подскажи пожалуйста, вот эту огромную тень вверху каким стилем убрать?

[k-ivan]

Привет, один из способов:

.has-image .bg::after  {
  display: none;
}