Dantes (обсуждение | вклад) Нет описания правки |
Dantes (обсуждение | вклад) Нет описания правки |
||
Строка 2: | Строка 2: | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | flex-wrap: wrap; | ||
gap: | gap: 20px; | ||
justify-content: center; | justify-content: center; | ||
padding: 20px; | |||
} | } | ||
.race-box { | .race-box { | ||
text-align: center; | text-align: center; | ||
cursor: pointer; | |||
width: 120px; | width: 120px; | ||
transition: transform 0.2s, box-shadow 0.2s; | |||
} | |||
box-shadow: | |||
.race-box:hover { | |||
transform: scale(1.1); | |||
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); | |||
} | |||
.race-name { | |||
margin-top: 10px; | |||
font-size: 16px; | |||
font-weight: bold; | |||
} | } | ||
.info-popup { | .info-popup { | ||
display: none; | |||
position: fixed; | position: fixed; | ||
top: 50%; | top: 50%; | ||
left: 50%; | left: 50%; | ||
transform: translate(-50%, -50%); | transform: translate(-50%, -50%); | ||
background: # | width: 400px; | ||
background: #fff; | |||
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5); | |||
padding: 20px; | padding: 20px; | ||
border-radius: | border-radius: 8px; | ||
z-index: 1000; | |||
} | } | ||
Строка 40: | Строка 47: | ||
top: 10px; | top: 10px; | ||
right: 10px; | right: 10px; | ||
font-size: 18px; | |||
cursor: pointer; | cursor: pointer; | ||
color: # | color: red; | ||
font-size: | } | ||
.race-info-title { | |||
font-size: 20px; | |||
font-weight: bold; | |||
margin-bottom: 10px; | |||
text-align: center; | |||
} | |||
#race-info-content { | |||
font-size: 14px; | |||
line-height: 1.5; | |||
} | } |
Версия от 15:08, 19 января 2025
.race-container { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; padding: 20px; } .race-box { text-align: center; cursor: pointer; width: 120px; transition: transform 0.2s, box-shadow 0.2s; } .race-box:hover { transform: scale(1.1); box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); } .race-name { margin-top: 10px; font-size: 16px; font-weight: bold; } .info-popup { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 400px; background: #fff; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.5); padding: 20px; border-radius: 8px; z-index: 1000; } .info-popup.active { display: block; } .close-btn { position: absolute; top: 10px; right: 10px; font-size: 18px; cursor: pointer; color: red; } .race-info-title { font-size: 20px; font-weight: bold; margin-bottom: 10px; text-align: center; } #race-info-content { font-size: 14px; line-height: 1.5; }