generated from VLADIMIR/template_frontend
update css
This commit is contained in:
Vendored
+1
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Vendored
-1
File diff suppressed because one or more lines are too long
Vendored
+2
-2
@@ -5,8 +5,8 @@
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Вечерний детектив</title>
|
||||
<script type="module" crossorigin src="/assets/index-BnoMdxQu.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-pBAjzfYV.css">
|
||||
<script type="module" crossorigin src="/assets/index-DxZltc9L.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-BcRBx0o9.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
+38
-31
@@ -12,57 +12,64 @@ body {
|
||||
src: url('@/assets/fonts/a_OldTyper.ttf');
|
||||
}
|
||||
|
||||
.center-message {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/* горизонтальное центрирование */
|
||||
align-items: center;
|
||||
|
||||
/* вертикальное центрирование */
|
||||
height: calc(100dvh - 100px);
|
||||
text-align: center;
|
||||
|
||||
/* центрирование текста */
|
||||
}
|
||||
|
||||
.content-block {
|
||||
margin-top: 70px;
|
||||
padding: 20px;
|
||||
|
||||
/* background-color: #553333; */
|
||||
}
|
||||
|
||||
.height80 {
|
||||
height: 80vh;
|
||||
}
|
||||
|
||||
.center-block-custom {
|
||||
.content-block {
|
||||
margin-top: 70px;
|
||||
}
|
||||
|
||||
.center-block-custom-big {
|
||||
.center-block-custom {
|
||||
margin-top: 70px;
|
||||
overflow-y: auto;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* Firefox */
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.center-block-custom::-webkit-scrollbar {
|
||||
/* Chrome, Edge, Safari */
|
||||
display: none;
|
||||
}
|
||||
|
||||
.width700 {
|
||||
padding: 10px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.width1200 {
|
||||
padding: 10px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.display-table {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
@media (width >=1024px) {
|
||||
.center-block-custom {
|
||||
width: 700px;
|
||||
margin: 70px auto 0;
|
||||
height: calc(100dvh - 70px);
|
||||
}
|
||||
|
||||
.center-block-custom-big {
|
||||
.width700 {
|
||||
width: 700px;
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.width1200 {
|
||||
width: 1200px;
|
||||
margin: 70px auto 0;
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.center-middle-block-custom {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.content-block {
|
||||
margin-top: 70px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
}
|
||||
@@ -27,8 +27,8 @@ getScenarios()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom-big content-block">
|
||||
<div class="scenarios-container">
|
||||
<div class="center-block-custom">
|
||||
<div class="width1200 display-table">
|
||||
<div class="scenario-block" v-for="scenario in scenarios" @click="toScenarioInfo(scenario.id!)"
|
||||
v-bind:key="scenario.id">
|
||||
<div class="scenario-image-block scenario-image" :style="{ backgroundImage: `url(${scenario.image})` }">
|
||||
@@ -40,7 +40,8 @@ getScenarios()
|
||||
<p class="scenario-description">{{ scenario.description }}</p>
|
||||
|
||||
<p class="scenario-label">
|
||||
<n-tag :bordered="false" type="success" class="status-block">Автор: {{ scenario.author?.username
|
||||
<n-tag :bordered="false" type="success" class="status-block">Автор: {{
|
||||
scenario.author?.username
|
||||
}}</n-tag>
|
||||
</p>
|
||||
</div>
|
||||
@@ -52,17 +53,6 @@ getScenarios()
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.scenarios-container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: center;
|
||||
overflow-y: auto;
|
||||
padding: 0;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
.scenario-block {
|
||||
position: relative;
|
||||
margin: 10px;
|
||||
@@ -113,10 +103,6 @@ getScenarios()
|
||||
}
|
||||
|
||||
@media (width >=1024px) {
|
||||
.scenarios-container {
|
||||
height: calc(100vh - 70px);
|
||||
}
|
||||
|
||||
.scenario-block {
|
||||
width: 250px;
|
||||
height: 400px;
|
||||
|
||||
@@ -25,7 +25,7 @@ async function addClickButton() {
|
||||
<BeltBlock class="input-form">
|
||||
<MetalPlate class="controller-metal controller-metal-left"></MetalPlate>
|
||||
<MetalPlate class="controller-metal controller-metal-right"></MetalPlate>
|
||||
<div class="center-block-custom">
|
||||
<div class="center-block-700">
|
||||
<div class="controller">
|
||||
<div class="game-input">
|
||||
<input id="run" class="game-input-run" v-model="code" type="text" placeholder="Место назначения">
|
||||
@@ -94,7 +94,7 @@ async function addClickButton() {
|
||||
background-size: cover;
|
||||
border: 0;
|
||||
font-size: 18px;
|
||||
font-family: a_OldTyper;
|
||||
font-family: 'font_old_typer';
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@@ -134,4 +134,11 @@ async function addClickButton() {
|
||||
.game-button-run {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (min-width: 1025px) {
|
||||
.center-block-700 {
|
||||
width: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -39,13 +39,15 @@ async function toTeamStory(id: number, password: string) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom content-block">
|
||||
<div class="center-block-custom">
|
||||
<div class="width1200">
|
||||
<div v-for="team in game.teams" class="team-block" @click="toTeamStory(team.id!, team.password!)">
|
||||
<div class="team-title">
|
||||
{{ team.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<HeaderMenu active="games" />
|
||||
</template>
|
||||
|
||||
@@ -29,7 +29,8 @@ async function toGame(id: number) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom content-block">
|
||||
<div class="center-block-custom">
|
||||
<div class="width1200">
|
||||
<div v-for="game in games" class="game-block" @click="toGame(game.id!)">
|
||||
<div class="game-title">
|
||||
{{ game.name }}
|
||||
@@ -39,6 +40,7 @@ async function toGame(id: number) {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<HeaderMenu active="games" />
|
||||
</template>
|
||||
|
||||
@@ -3,12 +3,14 @@
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<span class="text-with-font"><slot></slot></span>
|
||||
<span class="text-with-font">
|
||||
<slot></slot>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.text-with-font {
|
||||
font-family: a_OldTyper;
|
||||
font-family: 'font_old_typer';
|
||||
color: #bfa07d;
|
||||
font-weight: 600;
|
||||
letter-spacing: 2px;
|
||||
|
||||
@@ -20,13 +20,10 @@ getPermissions()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom content-block">
|
||||
<div class="center-block-custom">
|
||||
<div class="width700">
|
||||
<p>Доброго времени суток, {{ authStore.username }}.</p>
|
||||
<!-- <p>
|
||||
{{ authStore.userRoles }}
|
||||
</p>
|
||||
|
||||
{{ permissions }} -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<HeaderMenu active="office" />
|
||||
|
||||
@@ -37,7 +37,7 @@ getScenario(Number(scenarioId))
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom">
|
||||
<div class="scenario-container">
|
||||
<div class="width700">
|
||||
<div class="scenario-title">
|
||||
{{ scenario.name }}
|
||||
</div>
|
||||
@@ -56,10 +56,6 @@ getScenario(Number(scenarioId))
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.scenario-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.scenario-title {
|
||||
font-size: 24px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
@@ -272,7 +272,8 @@ async function deletePlace(place: Place) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom-big">
|
||||
<div class="center-block-custom">
|
||||
<div class="width700">
|
||||
<div class="places-container">
|
||||
<n-alert v-if="scenario.status == 'public'" title="Сценарий опубликован" type="warning"
|
||||
style="margin-bottom: 20px;">
|
||||
@@ -307,6 +308,7 @@ async function deletePlace(place: Place) {
|
||||
</PlaceBlock>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Окно настроек сценария -->
|
||||
<n-modal v-model:show="showSettingsScenarioModal">
|
||||
@@ -414,18 +416,5 @@ async function deletePlace(place: Place) {
|
||||
.places-container {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow-y: auto;
|
||||
margin-top: 70px;
|
||||
padding: 20px;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
@media (width >=1024px) {
|
||||
.places-container {
|
||||
padding: 20px 250px;
|
||||
height: calc(100vh - 70px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -42,8 +42,8 @@ getScenarios()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom-big content-block">
|
||||
<div class="scenarios-container">
|
||||
<div class="center-block-custom">
|
||||
<div class="width1200 display-table">
|
||||
<div class="scenario-block" @click="showAddScenarioModal = true">
|
||||
<div class="scenario-image-block scenario-image-plus">+</div>
|
||||
<div class="scenario-content-block">
|
||||
@@ -88,17 +88,6 @@ getScenarios()
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.scenarios-container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: center;
|
||||
overflow-y: auto;
|
||||
padding: 0;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
|
||||
.scenario-block {
|
||||
position: relative;
|
||||
margin: 10px;
|
||||
@@ -152,10 +141,6 @@ getScenarios()
|
||||
}
|
||||
|
||||
@media (width >=1024px) {
|
||||
.scenarios-container {
|
||||
height: calc(100vh - 70px);
|
||||
}
|
||||
|
||||
.scenario-block {
|
||||
width: 250px;
|
||||
height: 400px;
|
||||
|
||||
@@ -66,8 +66,9 @@ type AdvancedPlace = {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom-big">
|
||||
<div class="places-container">
|
||||
<div class="center-block-custom bottom-margin">
|
||||
|
||||
<div class="width700">
|
||||
<GameInputForm :addAction="addAction"></GameInputForm>
|
||||
|
||||
<PlaceBlock :place="advancedPlace.place" v-model:mode="advancedPlace.mode"
|
||||
@@ -80,21 +81,13 @@ type AdvancedPlace = {
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.places-container {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow-y: auto;
|
||||
margin-top: 70px;
|
||||
padding: 20px;
|
||||
height: calc(100vh - 150px);
|
||||
|
||||
/* border: 1px solid red; */
|
||||
.bottom-margin {
|
||||
height: calc(100dvh - 70px - 76px);
|
||||
}
|
||||
|
||||
@media (width >=1024px) {
|
||||
.places-container {
|
||||
padding: 20px 250px;
|
||||
height: calc(100vh - 70px - 75px);
|
||||
.bottom-margin {
|
||||
height: calc(100dvh - 70px - 76px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -41,10 +41,8 @@ async function deleteRole(userId: number, role: string) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="center-block-custom content-block">
|
||||
|
||||
<div class="users-container">
|
||||
|
||||
<div class="center-block-custom">
|
||||
<div class="width700">
|
||||
<div v-for="user in users" v-bind:key="user.id" class="user-block">
|
||||
<div class="user-field">
|
||||
Позывной: {{ user.username }}
|
||||
@@ -71,19 +69,13 @@ async function deleteRole(userId: number, role: string) {
|
||||
|
||||
</n-flex>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<HeaderMenu active="users" />
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.users-container {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.user-block {
|
||||
border: 1px solid #444;
|
||||
border-radius: 10px;
|
||||
|
||||
Reference in New Issue
Block a user