yaparoff

Есть конструктор шкафа. Как реализовать такой? https://tylko.com/wardrobe/242/?cv=1&board=cat_8__type_all__id_4276 Это какой-то плагин? Или лучше написать на чистом js?

сборка на gulp много js-файлов которые в итоге компилируются в один js файл Но проблема в том, что в этом компилируемом js файле ставиться табуляция вместо пробела. А на всем проекте 4 пробела вместо табов. И когда я отдаю этот файл бэкэнду начинаются проблемы. Можно как то изменить табы на пробелы в компилируемом файле? Можно это сделать как то автоматически (желательно)? Или только в ручную?

Если в кратце, проблема возникает из за того что когда заходим на страницу изначально текущий урл страницы http://localhost:3004/tablets/tablet_1 Если мы покликаем по табам (у которых тоже реализован роутинг и к урлу добавляется еще значение) То урл будет менять свое значение например на http://localhost:3004/tablets/tablet_1/characteristics И вот, допустим у нас сейчас этот урл и если страница перезагрзиться, то реакт будет считать что текущий урл уже http://localhost:3004/tablets/tablet_1/characteristics а не http://localhost:3004/tablets/tablet_1 как предполагается И из за этого возникают проблемы Могут быть вот такие страницы localhost:3004/tablets/tablet_1/characteristics/characteristics А так быть не должно. Подскажите как решить такую проблему Если подробнее: Делаю Интернет-магазин на Реакте (в рамках учебного проекта) На данный момент сделал роуты для нескольких страниц [JS] <Route path="/" ... /> // главная страница <Route path="/tablets" ... /> // страница категорий <Route path="/tablets/:id" ... /> // детальная страница товара [/JS] И это все работает хорошо Проблема с роутингом началась когда я начал делать табы на детальной странице товара. Их я тоже хотел сделать через роутинг. [JS] <Route path="/tablets/:id/characteristics" ... /> <Route path="/tablets/:id/opinion" ... /> <Route path="/tablets/:id" ... /> // по дефолту [/JS] Пути у табов: [JS] to=`${ текущий урл страницы }/characteristics` // Таб "Характеристки" to=`${ текущий урл страницы }/opinion` // Таб Отзывы to=`${ текущий урл страницы }` // Таб "Описание" (по дефолту) [/JS] http://skrinshoter.ru/s/221019/1f36Q0Gw И это работает исправно, до тех пор пока страница не перезагрузиться. Прикол в том, что если мы кликали по табам, урл менялся и допустим стал таким : http://localhost:3004/tablets/tablet_1/characteristics И потом вдруг страницу перезагрузили А при перезагрузке страницы текущий адрес получается уже http://localhost:3004/tablets/tablet_1/characteristics а не http://localhost:3004/tablets/tablet_1 как задумывалось. Из-за этого возникают проблемы когда кликаешь по табам: адрес получается уже http://localhost:3004/tablets/tablet_1/characteristics/characteristics http://skrinshoter.ru/s/221019/eTe8ZW5F Вот в этом и проблема. Как такое решить? Дело в том что location.pathname я передаю через props дочернему компоненту, он принимает его и в state я добавляю ему [JS]`${ this.props.pathName }/characteristics`[/JS]Вот код, как это выглядит: class App extends Component { render() { <Switch> <Route path="/" exact={true} component={ CategoriesList }/> <Route path="/tablets/:id/characteristics" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="characteristics" pathName={ location.pathname } /> }}/> <Route path="/tablets/:id/opinion" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="opinion" pathName={ location.pathname } /> }}/> <Route path="/tablets/:id" render={ ({ match, location }) => { const { id } = match.params; return <DetailPage itemId={ id } currentTab="description" pathName={ location.pathname } /> }}/> <Route path="/tablets" render={({ location }) => <CategoryPage goodList={goodsList.tablets} title="Tablets" location={ location } exact={true} />} /> </Switch> } } class DetailPage extends Component { state = { tabs: { opinion: { tabId: 'opinionTab', tabTitle: 'Отзывы', tabPathTo: `${ this.props.pathName }/opinion`, tabContent: 'Контент отзывов' }, characteristics: { tabId: 'characteristicsTab', tabTitle: 'Характеристики', tabPathTo: `${ this.props.pathName }/characteristics`, tabContent: 'Контент Характеристик' }, description: { tabId: 'descriptionTab', tabTitle: 'Описание', tabPathTo: `${ this.props.pathName }`, tabContent: 'Контент описания' } } }; findCurrentGood(goodsList, itemId) { for (let key in goodsList) { goodsList[key].forEach(category => { if (category.id === itemId) { this.currentGood = category } }) } } findCurrentTab() { for (let key in this.state.tabs) { if (key === this.props.currentTab) { this.activeTab = this.state.tabs[key]; } } } render() { const { goodsList, itemId, currentTab, pathName } = this.props; const { tabs } = this.state; this.findCurrentGood(goodsList, itemId); this.findCurrentTab(); return() { <div className="tabs"> <div className="tabs__menu"> { Object.keys(tabs).map(tab => { const tabClass = classNames('tabs__link', { 'tabs__link--active' : tab === currentTab }); return ( <Link key={ tabs[tab].tabId } to={ tabs[tab].tabPathTo } className={ tabClass } > { tabs[tab].tabTitle } </Link> ) }) } </div> <div className="tabs__content"> <h3 className="info__title">{ this.activeTab.tabTitle }</h3> <div className="info__text"> { this.activeTab.tabContent } </div> </div> </div> } } }

В проекте над которым работаю, изображения загружаются на некий удаленный сервер 248000.selcdn.ru/cdn/2018/bg_promo-banner.jpg cdn-srv01.miretno.ru/udm-sprite4.png Вопрос как их туда загрузить? Ну или можете просто посоветовать какой-нибудь стабильный удаленный сервер

ну я имею ввиду, то что при ширине экрана от 580 пикс и более

тогда на десктопе будет тоже центроваться, на десктопе нужно по левому краю выравнивать

Верстаю адаптивное email-письмо Эти две картинки должны быть по центру на адаптиве. Но у меня не получается их отцентровать прописываю стили инлайново http://skrinshoter.ru/s/190919/C7ZqQEyh?a Подскажите как это сделать https://codepen.io/yaparoff/pen/GRKwgRX?editors=1000

и правда! вот спасибо!

да, конечно https://codepen.io/yaparoff/pen/vYBzdPm?editors=1000 да http://skrinshoter.ru/s/170919/ZzwPd46V?a

все верно.Но почему то первая ячейка всегда больше чем вторая http://skrinshoter.ru/s/170919/6qCN4vrS Пробовал разные вещи - не помогает

Верстаю email-письмо. Использую Foundation. Не получается сверстать таблицей такой блок http://skrinshoter.ru/s/170919/5k7rvQdR Как его сверстать табличной версткой? https://codepen.io/yaparoff/pen/vYBzdPm?editors=1000

Дизайнер нарисовал макет вот с такими интересными линиями, которые идут по всей высоте сайта http://skrinshoter.ru/s/300819/pJvpKBvC А я теперь вот ломаю голову как такое сверстать. С одной стороны это можно сверстать колонками с рамкой, но ведь есть такие блоки, которые выходят за пределы этих колонок Как тогда быть в таком случае? Такие линии реально идут по всей высоте сайта.

Есть яндекс карта, на десктопе она отображается как надо и мы видим нужный нам объект (адрес) http://skrinshoter.ru/s/230819/RfSZ8pOG а вот если ширина экрана будет меньше, то этот объект уже будет не видно http://skrinshoter.ru/s/230819/74r975D5 Как то можно сделать чтобы было видно этот объект и на мобилках? https://codepen.io/yaparoff/pen/WNeRMNW?editors=1010

решил вопрос

Сейчас пришлось обернуть svg в label. И снова не все корректно работает: когда наводишь на серые звезды, они не должны подсвечиваться (в режиме readonly) https://codepen.io/anon/pen/PrmgPj

Точно! Оно! спасибо!

спасибо помогло. Еще такой момент. Этот компонент может быть readonly в таком случае радиокнопки становятся disabled. И при наведении на них ховер эффект должен исчезать. Мне удалось перебить ховер-эффект на checked кнопку и на не-checked. Но есть баг. И он заключается в том что некоторые disabled кнопки подсвечиваются. И подсвечиваются не тем цветом которым надо Коллеги, подскажите как это исправить? https://codepen.io/anon/pen/zVNVRV?editors=1100 &__radio ..... &[disabled] cursor: default &:hover & + .testimonials__icon color: transparent stroke: #BDBDBD &:checked &:hover & ~ .testimonials__icon color: $yellow stroke: $yellow

делаю звездный рейтинг на svg на чистом css проблема в том что checked, svg почему то не закрашивается в нужный цвет Как решить эту проблему? https://codepen.io/anon/pen/zVNVRV?editors=1010

Спасибо помогло. Кароче я разобрался как делать, чтобы при наведении и при добавлении класса svg менял цвет (причем svg из спрайта). Это реально реализовать. Все круто! Вот пример https://codepen.io/anon/pen/MdWLjN?editors=1100

Скажите, как закрасить svg при добавлении класса? По логике должно быть так .like-icon--filled .like-icon__inside { fill: #499DDE; } Но это не работает https://codepen.io/anon/pen/QPoRwg

Библиотека для тултипов Tooltipster. Если делаем триггер 'hover' - то тултип нормально появляется $('.icon').tooltipster({ trigger: 'hover' }); Если делаем кастомный триггер - то это не срабатывает $('.icon2').tooltipster({ theme: 'tooltipster-shadow', trigger: 'custom', triggerOpen: { mouseenter: true, tap: false } }); Почему такое происходит? Прикладываю архив. В песочнице почему то не удалось подключить плагин tooltipster.rar

Спасибо. Помогло. В этом же топике нашел ссылку на пример без закрашивания фона http://jsfiddle.net/L2ya3buj/1/

спасибо, но у вас там текст не скрывает черточки. Вы меня натолкнули на одну идею - подкрасить фон текста, но проблема в том что полупрозрачный фон rgba(11, 100, 168, 0.08) на таком же полупрозрачном фоне будет выделяться Получилось так https://codepen.io/anon/pen/XQXowd не знаю как это назвать ( Так бы давно нагуглил

На дизайне у этих черточек разная длина и зависит от контента. Кто нибудь знает как сделать такое в верстке? https://codepen.io/anon/pen/WWraar

То же самое происходит В html вставляю иконку - эффект с hover работает Из спрайта вызываешь ту же иконку - эффект с hover уже не работает