[hideprofile]
[html]
<style type="text/css">
.infa {
background: linear-gradient(rgb(13 15 32 / 71%), rgb(0 0 0)), url(http://forumstatic.ru/files/001b/ae/59/80548.jpg);
margin: 0 auto;
padding: 20px;
color: white;
line-height: 160%;
font-size: 1.01em;
text-align: justify;
background-size: cover;
}
.wrapper{
position: relative;
display: flex;
flex-flow: row wrap;
align-content: stretch;
justify-content: space-around;
}
.modal {
position: absolute;
box-sizing: border-box;
padding: 2em;
overflow-y: scroll;
transition-property: top, bottom, left, right, opacity;
transition-duration: 1s;
transition-timing-function: ease-in-out;
line-height: 200%;
color: #c9c9c9;
text-shadow: 0 0 10px black, 0 0 2px black;
font-size: 1.1em;
}
.hint {
margin: 5px -5px -5px -5px;
padding: 5px;
text-align: right;
position: sticky;
bottom: -5px;
color: #787878;
}
.district:hover {
box-shadow: 0 0 86px black inset;
cursor: pointer;
}
.district {
width: calc(100% / 3 - 10px);
height: 230px;
box-sizing: border-box;
border: 1px solid #c3a8b130;
margin: 5px;
padding: 0.5em;
padding-top:11%;
text-transform: uppercase;
font-family: 'roboto';
font-weight: bold;
letter-spacing: 2px;
font-size: 1.9em;
text-align: center;
transition-duration: 0.5s;
transition-timing-function: ease-in-out;
text-shadow: 0 0 10px black, 0 0 2px black;
}
.sceneryh {
text-transform: uppercase;
text-align: left;
padding: 5px;
margin-bottom: 10px;
margin-top: 13px !important;
letter-spacing: 2px;
font-size: 1.2em;
color: #626161;
}
.maplink {
position: absolute;
right: 10px;
top: 10px;
color: white !important;
font-size: 9px;
letter-spacing: 1px;
text-transform: uppercase;}
.info {
text-align:justify;
width:90%;
padding: 1em 5em 1em 5em;
column-count:2;
column-gap: 20px;
text-shadow: 0 0 18px black;
letter-spacing: 0.05em;
font-size: 11px;
}
@media screen and (max-width: 767px) {
.info {
text-align: justify;
width: 100%;
padding: 0;
column-count: 1;
column-gap: 0;
text-shadow: 0 0 18px black;
letter-spacing: 0.05em;
font-size: 11px;
}
.district {
width: calc(100% / 1 - 10px);
}
}
</style>
<div class="infa">
<center><a href="http://forumstatic.ru/files/001b/ae/59/39735.webp" class="maplink"> открыть карту <img src="http://forumstatic.ru/files/001b/ae/59/29346.png" style="float: right;padding-left: 5px;"></a></center>
<p class="gp1" style="text-align:center;font-style: italic;">Найт-Сити - это город-кот. Он спит днем, просыпается ночью и любит играть со своей добычей.</p>
<p class="info">Вольный город Найт-Сити</b> - это мегаполис в Свободном штате Северная Калифорния на западном побережье НСША, основанный мультимиллиардером Ричардом Найтом в 1990-х годах. Найт задумывал построить город-утопию, чистый, безопасный и свободный от преступности. На первых порах строительство шло при участии мегакорпораций и отдельных строительных фирм, но ввиду того, что многие из них контролировались преступными группировками, принципиальный основатель быстро отстранил их от проекта и намерился закончить его своими силами, используя свои собственные ресурсы и технологии. И этим подписал себе смертный приговор.<br><br>
Сегодня <i>Город Мечты</i> - это круглосуточный кровавый рейв, утопающий в беззаконии. Организованная преступность, наркоторговля, проституция, наемничество, регулярные перестрелки, уличные и корпоративные войны - это всё Найт-Сити. Одну половину города кормит работа в штате одной из корпораций, другую - наемничество и бандитизм; глубокая нищета и неравенство бок о бок соседствуют здесь с манящим обещанием легких денег. Здесь всё покупается и всё продаётся, и если когда-то название Найт-Сити было синонимом утопии, то сейчас оно приобрело смертельно опасное значение.<br><br>
Население Найт-Сити - 5 000 000 человек, большинство из которых живет в пригородах. Как любой крупный мегаполис, Найт-Сити представляет из себя огромную культурную плавильню - помимо американцев, здесь живут японцы, китайцы, корейцы, выходцы из Советского Союза и другие народы; диаспора гаитянских беженцев полностью контролирует южный район Пасифика, а уличная банда Валентино состоит преимущественно из латиноамериканцев.<br><br>
Во главе города стоит мэр, который избирается раз в пять лет. Формально баллотироваться на должность мэра может любой горожанин старше 30 лет и проживший в Найт-Сити более 5 лет, однако тот, кто ввяжется в политическую гонку, тут же станет мишенью для заинтересованных лиц.</p>
<div class="wrapper"><div class="modal"></div></div>
</div>
<script>
const districts = [
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/41201.webp) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/76007.webp) center center;
background-size: cover;
`,
summary: `
Центр города<br>
`,
full: `
Ода капиталистическому миру. В центре района расположена Площадь Корпораций, где находятся штаб-квартиры Арасаки, Кан Тао, Милитеха, Петрохема и Биотехники, а также люксовые жилые комплексы, торговый центр и одна из городских мегабашен. К западу от Площади Корпораций расположен деловой квартал. От Площади к окраинам городского центра расползаются улицы, пестрящие ночными клубами, магазинами, ресторанами и стрип-барами, здесь - средоточие кричащих неоновых вывесок, самые чистые улицы в городе и запах денег на каждом шагу. Центр города не контролируется ни одной из банд и потому является самым безопасным районом города, отсюда космические цены на жильё. Но когда наступает ночь, даже здесь просыпается мафия.<br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">
Штаб-квартира корпорации «Найт»<br>
Корпоративный отель «Биотехники»<br>
Арасака-тауэр<br>
Мемориальный парк Арасаки<br>
Жилой комплекс «Королевские апартаменты»<br></div>
`,
},
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/48702.jpg) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/43179.webp) center center;
background-size: cover;
`,
summary: `
Уэстбрук<br>
`,
full: `
Самый богатый и комфортный район города. Делится на три квартала: Чартер-Хилл, Норт-Оук и Джапан-Таун. В Чартер-Хилл расположены комфортабельные жилые дома для горожан при деньгах, частная школа и другие прелести уютного жилого района. Норт-Оук - роскошный микрорайон на холмах, гнездо фешенебельных частных вилл для городских селебрити и миллиардеров, королевство высоких заборов и охраны с собаками по соседству с синтоистским храмом. А Джапан-Таун - это главный тусовочный квартал всего Найт-Сити, находящийся под контролем "Тигриных когтей" и чуть более чем полностью состоящий из ночных клубов, баров, рюмочно-лапшичных, казино, аркад и прочих увеселительных заведений на любой вкус и кошелек. Джапан-таун известен скандальной Чпок-стрит, где день и ночь трудятся секс-работники.<br>
В 2023 году Уэстбрук сильнее всего пострадал от взрыва ядерной бомбы в Арасака-тауэр, однако власти города сумели восстановить его и отстроить заново, так что от радиоактивного пепла не осталось и следа. Поэтому, гуляя по Уэстбруку, можно подумать, что это самый молодой район города.<br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">Клуб "Облака"<br>
Студия «Дабл-ю-эн-эс»<br>
Кинотудия «Четвёртая стена»<br>
Синтоистский храм<br>
Чпок-стрит<br>
Штаб-квартира «Кироси»<br>
Автокинотеатр «Серебряный пиксель»<br>
Городской колумбарий<br>
Резиденция семьи Арасака</div>
`,
},
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/99627.jpg) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/91585.webp) center center;
background-size: cover;
`,
summary: `
Хейвуд<br>
`,
full: `
Самая большая спальня Найт-Сити и район для среднего класса, которого нет. Расположен по соседству с городским центром и Пасификой, от того на севере района жить вполне себе неплохо, а на юге - не очень. Жители Хейвуда считают себя везунчиками, ведь малой кровью судьба уберегла их от трущоб Кабуки или разрухи Пасифики, и потому они любят свой район особенной любовью.
В Глене, самом безопасном квартале Хейвуда, расположена городская мэрия, окруженная парком, а также две мегабашни и здание суда. Виста-дель-Рей, напротив, является беднейшим кварталом района, где частенько гремят перестрелки. Самая шумная часть Хэйвуда - Уэллспрингс, где среди прочего расположен порт, рынок под открытым небом и одна мегабашня.<br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">Мэрия Найт-Сити<br>
Заброшенная "Атлантида"<br>
Баскетбольная площадка банды «Валентино»<br>
Дом ритуальных услуг «Ла Катрина»<br>
Офис «Деламейн»<br>
Торговый центр «Бастион»<br>
Рынок под открытым небом</div>
`,
},
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/32144.png) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/73432.webp) center center;
background-size: cover;
`,
summary: `
Санто-Доминго
`,
full: `
Старейший район города. Корпорации используют его в качестве испытательного полигона для промышленных проектов, разрушая старые фабрики только для строительства новых, в то время как местные жители влачат жалкое существование в переполненных мегабашнях, мечтая о чем-то лучшем. Санто-Доминго похож на грязный задний двор с догнивающими пикапами и врастающими в землю садовыми гномами. Тут нет ничего постоянного. Земля стоит дёшево, поэтому корпорации ежегодно ставят здесь архитектурные эксперименты и затем сносят всё подчистую, чтобы попробовать что-нибудь ещё.<br>
Кварталы Санто-Доминго - промышленный Арройо, похожий на Нортсайд в Уотсоне, и спальник Ранчо Коронадо. В Арройо, помимо вечных строек и заброшек, можно найти электростанцию "Петрохема" и тюрьму, а Ранчо Коронадо - это нищая и недостроенная карикатура на американский пригород середины XX века.<br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">Смотровая площадка дамбы<br>
Центр психического здоровья Найт-Сити<br>
Государственная средняя школа Ранчо Коронадо<br>
База банды «Шестая улица»<br>
Тюрьма Найт-Сити<br>
Промышленный парк «Арасаки»<br>
Фабрики "Сайтеха" и "Кэндати"</div>
`,
},
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/33663.jpg) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/54784.webp) center center;
background-size: cover;
`,
summary: `
Уотсон
`,
full: `
Район на севере города, один из самых безрадостных. После ядерного взрыва в 2023 году в этот район, относительно нетронутый, хлынули беженцы, и место начало обживаться: сюда потекли инвестиции, один за другим вырастали новые небоскребы и открывались ночные клубы, пока сюда не пришла Арасака и не вытравила инвесторов. Теперь почти половину района занимает огороженная набережная Арасаки, промышленный квартал Нортсайд пришел в запустение, здесь царит безработица и безысходность. Из-за высокого уровня криминальной активности Уотсон то и дело оцепляет полиция, временно отрезая район от остального города.<br>
В Уотсоне располагается этническое гетто китайских иммигрантов - Маленький Китай, а также сердце городского черного рынка, район Кабуки. И тот и другой кварталы похожи на соседний Джапан-таун, тут цветет и процветает полулегальный малый бизнес от закусочных до казино. В Кабуки работает брейнданс-клуб "Лиззис", он же штаб Шельм. Но самый легендарный адрес в Уотсоне - это клуб "Посмертие", расположенный в Маленьком Китае, объект поклонения начинающих наемников и любимое место ведения сделок для опытных соло.<br><br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">Клуб "Посмертие"<br>
Клуб "Лиззис"<br>
Мотель "Ноу Телл"<br>
Небоскрёб корпорации «Яйба»<br>
Порт Кабуки<br>
Ломбард «Эль дорадо»<br>
Отель «Компэки плаза»<br>
Комплекс «Арасаки» по производству киберимплантов</div>
`,
},
{
style: `
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(http://forumstatic.ru/files/001b/ae/59/20088.jpg) center center;
background-size: 700px;
`,
modalStyle: `
background: url(http://forumstatic.ru/files/001b/ae/59/71327.webp) center center;
background-size: cover;
`,
summary: `
Пасифика
`,
full: `
Пасифика - это Найт-Сити в миниатюре. Как и Уотсон, когда-то этот район был магнитом для инвестиций, когда корпораты задумывали превратить это место в туристический рай на окраине Найт-Сити. В планы входили роскошные отели с видом на море, парк развлечений, пляж с причалом, но с приходом Объединяющей войны все эти проекты были заброшены, тысячи людей остались без работы, и Пасифика так и стоит одной большой заброшенной стройкой. Этот район полностью контролируется бандой Вудуистов, которые наводят здесь свои порядки. Уровень преступности в районе настолько высок, что полиция уже даже не притворяется, что пытается что-то сделать с Пасификой. Это самая настоящая военная зона. Здесь можно перестреливаться сколько угодно без риска зацепить гражданских или нарваться на полицию. Здесь весёлые вывески изрешечены пулями, а роскошные бассейны наполнены ядовитой жижей. В центре района располагается огороженная бетонной стеной боевая зона - апогей беззакония и насилия - Пёсий город.<br>
Север Пасифики известен как Побережье, а юг - Владение Уэст-Энд.<br>
<p class="sceneryh">Достопримечательности</p>
<div style="column-count:2;column-gap: 20px;">Стадион Найт-Сити<br>
Библейская церковь Чистоты в Пасифике<br>
Парк развлечений<br>
Недостроенная станция метро<br>
Жилой комплекс Уэст-Уинд<br>
Отель «Пистис София»</div>
`,
},
];
(()=>{
const wrapper = document.querySelector('.wrapper');
const modal = wrapper.querySelector('.modal');
const modalHide = () => {
modal.style.opacity=0;
modal.style.top = modal.style.bottom = modal.style.left = modal.style.right = '50%';
modal.innerHTML = '';
};
modalHide();
districts.forEach(el => {
const block = document.createElement('div');
block.classList.add('district');
block.innerHTML = el.summary;
block.style.cssText = el.style;
wrapper.append(block);
block.addEventListener('click', () => {
modal.style.cssText = el.modalStyle;
modal.style.opacity=1;
modal.style.top = modal.style.bottom = modal.style.left = modal.style.right = '5px';
modal.innerHTML = el.full;
modal.insertAdjacentHTML('beforeend', `<div class="hint">Для закрытия кликните за пределами карточки</div>`);
document.addEventListener('click', (event) => {
const classes = event.target.classList;
if(!classes.contains('modal') && !classes.contains('district')){
modalHide();
}
});
});
});
})();
</script>
[/html][hideprofile]