Вообщем т.к. стили для фигурок перекочевали в сам доп, то я убрал их и сделал темную версию тетриса: Tetris
Просто добавьте стили ниже в ваш style.css темы или куда то еще:
#tetrisBox {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAABd0lEQVRIS+2W2YqEMBBFyx188kVBRP3/T3QfbpgbqmO6k56FeRkhREwlp5ZUlUnXdZf88pMAkiSJFEUhmPFc1/tc7PENnGcgZVnKNE2SpukDJATj+nmechyHbNsm67rKsiz2HTIGUlWVzPNsLHG1eeVJF7LvuwEAROANQldBK2gX6zpaAggPx4xhIXAXLMFDADbGgihLCA7HO8YNgg9Y4CbMMXGBDGR5MCFQ+AGCwOMDFlxQ6IZzH0Aa8BQCABY5YgDaEirJ/V5LaDKDGRN8upUK6vmWJ4wJ3QVtvgoh6B9yuwu+mPydu8ZxvOXJjwfehbC8vJPxOke87hqGwZvxrMqhasy8cpPRXmE0rL7vLYRW0F0hABXRlUJXDNNP8jyXtm0NhBrxxrASx4BYqwjgXgPJskyaprENi8KxAFYFXSipsHUX2m5d17aE0IpQ0Gkd5Xiw7q4WgraLxqU1cgExQA3T8sZdhvb5p+LzfQzgVcwsJNQ3vrP+AZU0VaBIz4WUAAAAAElFTkSuQmCC);
}
#tetris-field {
background: black;
}
#next-figure .tetris-row {
width: 100px;
margin: auto;
}
#next-figure:before {
content: "Далее";
margin-bottom: 10px;
letter-spacing: 5px;
font-size: 30px;
}
#tetrisBox .score-box {
letter-spacing: 2px;
font-size: 23px;
text-align: center;
}
#tetrisBox #next-figure,
#tetrisBox #tetris-score {
width: calc((100% - 254px) / 2);
}
#tetrisBox .score-box,
#next-figure:before,
.tetris-notice > div,
#tetrisBox > h3 {
color: #e6e6e6;
display: block;
font-weight: bold;
text-shadow: 1px 1px 1px black;
}
.tetris-notice > div {
font-size: 20px;
margin-bottom: 20px;
}
#tetrisBox .score-box span {
display:block;
}
#tetrisBox #tetris-field {
border: 1px solid #545454;
}
#tetrisBox .tetris-notice {
padding: 0px!important;
}
.tts-records .rcl-table__row:not(.rcl-table__row-header) {
background: white;
}
#tetrisBox > a.recall-button {
display: block;
max-width: 200px;
text-align: center;
margin: 30px auto;
font-size: 20px;
}
#tetrisBox > h3 {
text-align: center;
font-size: 20px;
}


крутые стили, я бы их с удовольствием добавил бы в сам доп)
Я не против) Еще заметил на скрине что можно #tetris-field width поправить на 250, а то сейчас от правого края есть расстояние 2px
спасибо, тогда забираю!
#tetris-field имеет 252, потому что внутри имеет 10 блоков по 25 и 2 идет на бордер, если уменьшать, то внутренние блоки поедут
Так там 252 + бордер - получается 254 ширина блока, у меня с #tetris-field 250 все норм)
у меня нет https://yadi.sk/i/31lk8CXHMSiLYg
если установить для #tetris-field 250, то внутренний блок.tetris-row сжимается до 248 и 10 блоков по 25 уже не влезают
добавил в игру "подъем земли" при прохождении уровня - type-ground, сделал эти блоки серыми, как оказалось цвета совпали с твоими цветами для удаляемых блоков, может будут предложения для нового типа?
Наверно так:
#tetrisBox .tetris-wrapper .tetris-cell.must-removed { opacity: .5; }Да, как вариант.
Кстати, пришло в голову может для таких блоков запустить анимацию на схлопывание на css
Вот как вариант:
https://www.youtube.com/watch?v=gimt4JnRTtA
@keyframes collapse { 50%{transform:scale(1);} 60%{transform:scale(.8);} 70%{transform:scale(.6);} 80%{transform:scale(.4);} 90%{transform:scale(.2);} 100%{transform:scale(0);} } #tetrisBox .tetris-wrapper .tetris-cell.must-removed { animation: collapse 1s 1 ease-in-out; }супер! спасибо
Может быть сделать настройки к этой игре? Например, такие:
- выбор тёмной или светлой темы (кстати, у меня один сайт - тёмный, второй - светлый);
- бегунок количества отображаемых мест (сейчас, как я понимаю, десять мест в турнирной таблице);
- включение/отключение звуковых эффектов во фронтэнде;
- включение/отключение мелодии во фронтенде;
- отображение даты результата (дополнительная колонка в таблице результатов);
- включение/отключение отображения аватара в таблице результатов?