Dhaverd/ New-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'mini neon redesign' (#8) from neon-mini-redesign into master 

Reviewed-on: http://gitea.dhaverd.ru/Dhaverd/New-site/pulls/8
This commit is contained in:
Dhaverd 2024-06-13 12:48:22 +03:00
parent d5f2690b54 48c5937b6e
commit 5f210dfd7c
5 changed files with 54 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
resources/css/app.css
View File

@ -8,3 +8,32 @@ .box-gradient {
#F6D242) border-box; #F6D242) border-box;
border-radius: 14px; border-radius: 14px;
} }
.neon-text {
color: #fff!important;
text-shadow:
0 0 3px #fff,
0 0 5px #fff,
0 0 11px #fff,
0 0 16px #bc13fe,
0 0 20px #bc13fe,
0 0 26px #bc13fe,
0 0 30px #bc13fe,
0 0 34px #bc13fe !important;
}
.neon-border {
border: 0.2rem solid #fff !important;
border-radius: 2rem !important;
box-shadow: 0 0 .2rem #fff,
0 0 .2rem #fff,
0 0 2rem #bc13fe,
0 0 0.8rem #bc13fe,
0 0 2.8rem #bc13fe,
inset 0 0 1.3rem #bc13fe !important;
animation: pulsate 1.5s infinite alternate !important;
}
.white-text {
color: white!important;
}

10
resources/views/Schedule.vue
View File

@ -1,10 +1,10 @@
<template> <template>
<v-sheet class="mt-5 mb-5 rounded-lg w-75"> <v-sheet class="bg-grey-darken-3 mt-5 mb-5 rounded-lg w-75 pl-3">
<p class="text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5 ma-5">Расписание стримов</p> <p class="neon-text text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5 ma-5">Расписание стримов</p>
<v-skeleton-loader v-if="fetching" type="text" /> <v-skeleton-loader v-if="fetching" type="text" class="bg-grey-darken-3"/>
<p v-else class="ma-5 text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5"> {{ parseDate(dates[0].current_date) }} - {{ parseDate(dates[1].current_date) }}</p> <p v-else class="neon-text ma-5 text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5"> {{ parseDate(dates[0].current_date) }} - {{ parseDate(dates[1].current_date) }}</p>
<ScheduleTable :is-wide="isWide"/> <ScheduleTable :is-wide="isWide"/>
<p class="text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5 ma-5">Ссылочки</p> <p class="neon-text text-xl-h3 text-lg-h3 text-md-h4 text-sm-h4 text-h5 ma-5">Ссылочки</p>
<Links :is-wide="isWide"/> <Links :is-wide="isWide"/>
<AdditionalButtons :is-wide="isWide"/> <AdditionalButtons :is-wide="isWide"/>
</v-sheet> </v-sheet>

26
resources/views/Schedule/AdditionalButtons.vue
View File

@ -52,39 +52,39 @@ export default {
<template> <template>
<div class="w-100 d-flex justify-space-evenly" :class="isWide ? '' : 'flex-column'"> <div class="w-100 d-flex justify-space-evenly" :class="isWide ? '' : 'flex-column'">
<v-btn <v-btn
class="box-gradient pt-2 pb-2 ma-5 h-auto" class="bg-grey-darken-3 neon-border pt-3 pb-3 pl-3 pr-3 mt-7 mb-7 mr-5 ml-5 h-auto"
text="Кинуть копеечку" text="Кинуть копеечку"
href="https://www.donationalerts.com/r/dhaverd" href="https://www.donationalerts.com/r/dhaverd"
target="_blank" target="_blank"
/> />
<v-btn <v-btn
class="box-gradient pt-2 pb-2 ma-5 h-auto" class="bg-grey-darken-3 neon-border pt-3 pb-3 pl-3 pr-3 mt-7 mb-7 mr-5 ml-5 h-auto"
text="Оставить отзыв" text="Оставить отзыв"
@click="onShowModal" @click="onShowModal"
/> />
</div> </div>
<v-dialog v-model="showModal" class="align-center" :class="isWide ? 'w-50' : 'w-100 h-100'"> <v-dialog v-model="showModal" class="align-center" :class="isWide ? 'w-50' : 'w-100 h-100'">
<v-sheet class="mt-5 mb-5 pa-5 h-auto rounded-lg d-flex flex-column"> <v-sheet class="mt-5 mb-5 pa-5 h-auto rounded-lg bg-grey-darken-3 neon-border d-flex flex-column">
<div class="w-100 d-flex justify-end"> <div class="w-100 d-flex justify-end bg-grey-darken-3">
<v-btn icon="mdi-window-close" elevation="0" @click="onShowModal"/> <v-btn class="bg-grey-darken-3" icon="mdi-window-close" elevation="0" @click="onShowModal"/>
</div> </div>
<v-label class="text-xl-h6">Оцените канал:</v-label> <v-label class="text-xl-h6 white-text ">Оцените канал:</v-label>
<v-rating v-model="rating" active-color="orange-lighten-1"> <v-rating v-model="rating" active-color="purple-darken-1">
sss sss
</v-rating> </v-rating>
<v-label class="text-xl-h6 mb-2">Оставьте отзыв:</v-label> <v-label class="text-xl-h6 mb-2 white-text ">Оставьте отзыв:</v-label>
<v-textarea v-model="comment" clearable variant="outlined" label="Что можно улучшить?"/> <v-textarea v-model="comment" clearable variant="outlined" label="Что можно улучшить?"/>
<div class="d-flex justify-center"> <div class="d-flex justify-center">
<v-btn class="box-gradient pt-2 pb-2 w-auto h-auto" @click="sendRating">Отправить</v-btn> <v-btn class="bg-grey-darken-3 neon-border pt-3 pb-3 pl-3 pr-3 w-auto h-auto" @click="sendRating">Отправить</v-btn>
</div> </div>
</v-sheet> </v-sheet>
</v-dialog> </v-dialog>
<v-dialog v-model="afterModal" class="align-center" :class="isWide ? 'w-50' : 'w-100 h-100'"> <v-dialog v-model="afterModal" class="align-center" :class="isWide ? 'w-50' : 'w-100 h-100'">
<v-sheet class="mt-5 mb-5 pa-5 h-auto rounded-lg d-flex flex-column"> <v-sheet class="mt-5 mb-5 pa-5 h-auto rounded-lg bg-grey-darken-3 neon-border d-flex flex-column">
<div class="w-100 d-flex justify-end"> <div class="w-100 d-flex justify-end bg-grey-darken-3">
<v-btn icon="mdi-window-close" elevation="0" @click="onShowAfterModal"/> <v-btn class="bg-grey-darken-3" icon="mdi-window-close" elevation="0" @click="onShowAfterModal"/>
</div> </div>
<v-label class="text-xl-h6">{{afterModalText}}</v-label> <v-label class="text-xl-h6 white-text justify-center">{{afterModalText}}</v-label>
</v-sheet> </v-sheet>
</v-dialog> </v-dialog>
</template> </template>

8
resources/views/Schedule/Links.vue
View File

@ -23,11 +23,11 @@
<template> <template>
<div class="w-100 d-flex justify-center"> <div class="w-100 d-flex justify-center">
<v-list :class="isWide ? 'w-66' : 'w-100'"> <v-list class="bg-grey-darken-3" :class="isWide ? 'w-66' : 'w-100'">
<v-skeleton-loader v-if="fetching" type="list-item"/> <v-skeleton-loader v-if="fetching" type="list-item" class="bg-grey-darken-3"/>
<v-list-item v-else class="ma-5 box-gradient" elevation="6" v-for="link in links" :href="link.link"> <!-- style="background-color: #E57373; color: #FFFFFF" --> <v-list-item v-else class="bg-grey-darken-3 neon-border mt-6 mb-7 ml-7 mr-7" elevation="0" v-for="link in links" :href="link.link"> <!-- style="background-color: #E57373; color: #FFFFFF" -->
<template v-slot:prepend> <template v-slot:prepend>
<v-avatar :image="link.image" rounded="0"></v-avatar> <v-avatar class="mt-1 mb-1 ml-5" :image="link.image" rounded="0"></v-avatar>
</template> </template>
<v-list-item-title>{{ link.link_name }}</v-list-item-title> <v-list-item-title>{{ link.link_name }}</v-list-item-title>
</v-list-item> </v-list-item>

6
resources/views/Schedule/ScheduleTable.vue
View File

@ -28,9 +28,9 @@
</script> </script>
<template> <template>
<div class="w-100 d-flex justify-center"> <div class="w-100 d-flex justify-center mt-6 mb-6">
<v-skeleton-loader v-if="fetching" type="table"/> <v-skeleton-loader v-if="fetching" type="table" class="bg-grey-darken-3"/>
<v-table v-else class="text-xl-h5 text-lg-h5 text-md-h5 text-sm-h5 text-body-2" :class="isWide ? 'w-66' : 'w-100'"> <v-table v-else class="bg-grey-darken-3 neon-border pa-3 text-xl-h5 text-lg-h5 text-md-h5 text-sm-h5 text-body-2" :class="isWide ? 'w-66' : 'w-100'">
<tbody> <tbody>
<tr v-for="schedule in schedules"> <tr v-for="schedule in schedules">
<td>{{ parseDate(schedule.current_date) }} {{ schedule.weekday_name }} {{ schedule.stream_time }}</td> <td>{{ parseDate(schedule.current_date) }} {{ schedule.weekday_name }} {{ schedule.stream_time }}</td>