xclele/vue-material-kit
1
0
Fork 0
mirror of https://github.com/creativetimofficial/vue-material-kit.git synced 2025-05-23 04:04:22 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

main page auth

Browse Source
This commit is contained in:
irchen4 2023-05-22 19:46:55 +03:00
parent bb3a64fe84
commit ec9df9e2ef
4 changed files with 67 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/img/ultraviolet.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 MiB

98
src/examples/navbars/NavbarDefault.vue
View File

@ -119,7 +119,6 @@ watch(
]"
:to="{ name: 'presentation' }"
rel="tooltip"
title="Designed and Coded by Creative Tim"
data-placement="bottom"
>
LinkedMin
@ -133,7 +132,6 @@ watch(
"
to="/"
rel="tooltip"
title="Designed and Coded by Creative Tim"
data-placement="bottom"
>
LinkedMin
@ -172,13 +170,15 @@ watch(
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i
<!-- <i
class="material-icons opacity-6 me-2 text-md"
:class="getTextColor()"
>dashboard</i
>
Пользователи
<img
>-->
Пользователи
<!--<img
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-2 d-lg-block d-none"
@ -187,45 +187,32 @@ watch(
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-1 d-lg-none d-block ms-auto"
/>
/>-->
</a>
<div
class="dropdown-menu dropdown-menu-animation ms-n3 dropdown-md p-3 border-radius-xl mt-0 mt-lg-3"
aria-labelledby="dropdownMenuPages"
>
aria-labelledby="dropdownMenuPages">
<div class="row d-none d-lg-block">
<div class="col-12 px-4 py-2">
<div class="row">
<div class="position-relative">
<div
class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-1"
>
Все пользователи
</div>
<RouterLink
:to="{ name: 'profiles' }"
class="dropdown-item border-radius-md"
>
class="dropdown-item border-radius-md">
<span>Все пользователи</span>
</RouterLink>
</div>
</div>
</div>
</div>
<div class="d-lg-none">
<div
class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-0"
>
Все пользователи
</div>
<RouterLink
:to="{ name: 'profiles' }"
class="dropdown-item border-radius-md"
>
class="dropdown-item border-radius-md">
<span>Все пользователи</span>
</RouterLink>
</div>
</div>
</li>
@ -240,13 +227,13 @@ watch(
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i
<!--<i
class="material-icons opacity-6 me-2 text-md"
:class="getTextColor()"
>dashboard</i
>
>-->
Проекты
<img
<!--<img
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-2 d-lg-block d-none"
@ -255,7 +242,7 @@ watch(
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-1 d-lg-none d-block ms-auto"
/>
/>-->
</a>
<div
class="dropdown-menu dropdown-menu-animation ms-n3 dropdown-md p-3 border-radius-xl mt-0 mt-lg-3"
@ -265,11 +252,6 @@ watch(
<div class="col-12 px-4 py-2">
<div class="row">
<div class="position-relative">
<div
class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-1"
>
Все проекты
</div>
<RouterLink
:to="{ name: 'projects' }"
class="dropdown-item border-radius-md"
@ -282,15 +264,9 @@ watch(
</div>
</div>
<div class="d-lg-none">
<div
class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-0"
>
Все проекты
</div>
<RouterLink
:to="{ name: 'projects' }"
class="dropdown-item border-radius-md"
>
class="dropdown-item border-radius-md">
<span>Все проекты</span>
</RouterLink>
@ -307,15 +283,14 @@ watch(
:class="getTextColor()"
id="dropdownMenuDocs"
data-bs-toggle="dropdown"
aria-expanded="false"
>
<i
aria-expanded="false">
<!-- <i
class="material-icons opacity-6 me-2 text-md"
:class="getTextColor()"
>article</i
>
>-->
Профиль
<img
<!--<img
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-2 d-lg-block d-none"
@ -324,7 +299,7 @@ watch(
:src="getArrowColor()"
alt="down-arrow"
class="arrow ms-1 d-lg-none d-block ms-auto"
/>
/>-->
</a>
<div
class="dropdown-menu dropdown-menu-end dropdown-menu-animation dropdown-md mt-0 mt-lg-3 p-3 border-radius-lg"
@ -337,14 +312,8 @@ watch(
class="dropdown-item py-2 ps-3 border-radius-md"
href="/ViewMyProfile"
>
<h6
class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"
>
Мой Профиль
</h6>
<span class="text-sm"
>Рассказ о том, какой я классный</span
>
<h6 class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"> Мой Профиль </h6>
<span class="text-sm">Рассказ о том, какой я классный</span>
</a>
<a
class="dropdown-item py-2 ps-3 border-radius-md"
@ -360,28 +329,21 @@ watch(
>
</a>
</li>
</ul>
</div>
<div class="row d-lg-none">
<div class="col-md-12 g-0">
<a
class="dropdown-item py-2 ps-3 border-radius-md"
href="/ViewMyProfile"
>
<h6
class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"
>
<a class="dropdown-item py-2 ps-3 border-radius-md"
href="/ViewMyProfile">
<h6 class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0">
Мой профиль
</h6>
<span class="text-sm"
>Рассказ о том, какой я классный</span
>
<span class="text-sm">Рассказ о том, какой я классный</span>
</a>
</div>
</div>
</div>
</li>

30
src/views/Presentation/PresentationView.vue
View File

@ -87,35 +87,29 @@ export default {
<div class="container">
<div class="row">
<div class="col-lg-7 text-center mx-auto position-relative">
<h1
class="text-white pt-3 mt-n5 me-2"
:style="{ display: 'inline-block ', fontFamily: 'PressStart2P, sans-serif' }"
>
LinkedMin
</h1>
<p>
</p>
<div v-if="isAuthenticated">
<h2
class="text-white pt-3 mt-n5 me-2"
:style="{ display: 'inline-block ', fontFamily: 'PressStart2P, sans-serif' }"
>
Привет, {{ loggedUserName }}</h2>
Привет, {{ loggedUserName }}!</h2>
<p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500', fontFamily: 'PressStart2P, sans-serif' }">
В поисках чего-то интересного?
</p>
</div>
<div v-else>
<p>Тариф Бесплатный</p>
<h1
class="text-white pt-3 mt-n5 me-2"
:style="{ display: 'inline-block ', fontFamily: 'PressStart2P, sans-serif' }">LinkedMin</h1>
<p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500', fontFamily: 'PressStart2P, sans-serif' }">
Показывай себя и свои проекты.
Находи вдохновение, коллег и новые знания.
</p>
</div>
<p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500', fontFamily: 'PressStart2P, sans-serif' }">
Показывай себя и свои проекты.
Находи вдохновение, коллег и новые знания.
</p>
</div>
</div>
<div>

33
src/views/Presentation/Sections/PresentationSearch.vue
View File

@ -33,11 +33,11 @@ const search = async () => {
<!-- Added class searchInput for styling -->
<input class="searchInput" type="text" v-model="searchQuery" @keyup.enter="search" placeholder="Поиск по проектам и людям" />
<!-- Added class searchButton for styling -->
<button class="searchButton" type="submit" @click="search">Go</button>
<button class="searchButton" type="submit" @click="search">Погнали!</button>
</div>
<div v-if="searchResultProjects.length > 0 || searchResultUsers.length > 0">
<h2 class="result-header">Найдено проектов: {{ searchResultProjects.length}} </h2>
<!--<h2 class="result-header">Найдено проектов: {{ searchResultProjects.length}} </h2>-->
<div class="result-grid">
<div class="result-card" v-for="project in searchResultProjects" :key="project.id">
<h3>{{ project.title }} with ID {{ project.id }}</h3>
@ -45,7 +45,7 @@ const search = async () => {
<a :href="`http://somebodyhire.me/project/${project.id}`">Страница проекта</a>
</div>
</div>
<h2 class="result-header">Найдено людей: {{ searchResultUsers.length}} </h2>
<!--<h2 class="result-header">Найдено людей: {{ searchResultUsers.length}} </h2>-->
<div class="result-grid">
<div class="result-card" v-for="user in searchResultUsers" :key="user.id">
<h3>{{ user.username }} with id {{ user.id }}</h3>
@ -56,7 +56,7 @@ const search = async () => {
</div>
<div v-else>
<div v-if = "searchQuery.length > 0 && searchButtonIsPressed === true" >
<h2 class="result-header">Ничего не найдено</h2>
<h2 class="result-header">Увы и ах! Такого нет (</h2>
</div>
</div>
@ -78,30 +78,42 @@ const search = async () => {
padding: 10px;
/* Adds some margin to the right side of the input field */
margin-right: 10px;
margin-top: 20px;
/* Increased the font size a bit */
font-size: 16px;
border-radius: 1%;
border: 2px solid #66FCF1;
border-radius: 5px;
outline: none;
background: #FAFAFA;
color: #9E9C9C;
}
.searchButton {
/* Adds some padding inside the button */
padding: 10px 20px;
padding: 12px 20px;
/* Changes the font size */
font-size: 16px;
/* Changes the background color of the button */
background-color: #3d9132;
background-color: #66FCF1;
/* Changes the color of the text inside the button */
color: white;
color: rgb(90, 90, 90);
/* Makes the border corners rounded */
border-radius: 4px;
/* Removes the default button border */
border: none;
/* Changes the cursor to a hand pointer when hovering over the button */
cursor: pointer;
width: 10%;
margin-top: 20px;
}
.searchButton:hover {
/* Changes the background color of the button when hovering over it */
background-color: #25581e;
background-color: #E01EB2;
color: rgb(228, 228, 228);
}
.result-header {
color: #fff;
@ -109,6 +121,11 @@ const search = async () => {
padding: 10px;
text-align: center;
margin-top: 20px;
border: 2px solid #66FCF1;
border-radius: 5px;
outline: none;
color: #9E9C9C;
}
.result-grid {