mirror of
https://github.com/creativetimofficial/vue-material-kit.git
synced 2025-05-24 05:24:21 +08:00
Code cleanup
This commit is contained in:
FEARmeR
parent
91cae103f1
commit
494a6a0ddb
@ -21,19 +21,9 @@ import NavbarDefault from "../..//examples/navbars/NavbarDefault.vue";
|
|||||||
import DefaultFooter from "../../examples/footers/FooterDefault.vue";
|
import DefaultFooter from "../../examples/footers/FooterDefault.vue";
|
||||||
import Header from "../../examples/Header.vue";
|
import Header from "../../examples/Header.vue";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//Vue Material Kit 2 components
|
|
||||||
import MaterialInput from "@/components/MaterialInput.vue";
|
|
||||||
|
|
||||||
// sections
|
// sections
|
||||||
import PresentationCounter from "./Sections/PresentationCounter.vue";
|
import PresentationCounter from "./Sections/PresentationCounter.vue";
|
||||||
import PresentationPages from "./Sections/PresentationPages.vue";
|
|
||||||
import PresentationExample from "./Sections/PresentationExample.vue";
|
|
||||||
import data from "./Sections/Data/designBlocksData";
|
|
||||||
import BuiltByDevelopers from "./Components/BuiltByDevelopers.vue";
|
|
||||||
import PresentationTestimonials from "./Sections/PresentationTestimonials.vue";
|
|
||||||
import PresentationInformation from "./Sections/PresentationInformation.vue";
|
|
||||||
|
|
||||||
//images
|
//images
|
||||||
import vueMkHeader from "@/assets/img/space-background.jpg";
|
import vueMkHeader from "@/assets/img/space-background.jpg";
|
||||||
@ -57,9 +47,6 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
projects: [],
|
projects: [],
|
||||||
searchQuery: '',
|
|
||||||
searchResult: [],
|
|
||||||
searchResultUsers: [],
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
async created() {
|
async created() {
|
||||||
@ -70,18 +57,6 @@ export default {
|
|||||||
console.error('There was an error fetching the projects', error);
|
console.error('There was an error fetching the projects', error);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
|
||||||
async search() {
|
|
||||||
try {
|
|
||||||
const response = await axios.get(`http://somebodyhire.me/api/search/projects/?search_query=${this.searchQuery}`);
|
|
||||||
this.searchResult = response.data;
|
|
||||||
const responseUsers = await axios.get(`http://somebodyhire.me/api/search/profiles/?search_query=${this.searchQuery}`);
|
|
||||||
this.searchResultUsers = responseUsers.data;
|
|
||||||
} catch (error) {
|
|
||||||
console.error('There was an error performing the search', error);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -120,75 +95,16 @@ export default {
|
|||||||
<!-- Тут надо будет заменить на красивую строчку -->
|
<!-- Тут надо будет заменить на красивую строчку -->
|
||||||
<input type="text" v-model="searchQuery" placeholder="Поиск по проектам и людям" />
|
<input type="text" v-model="searchQuery" placeholder="Поиск по проектам и людям" />
|
||||||
<button type="submit" @click="search">Go</button>
|
<button type="submit" @click="search">Go</button>
|
||||||
|
|
||||||
|
|
||||||
<!-- <div v-if="searchResult.length > 0">
|
|
||||||
<h2>Найдено в проектах: {{ searchResult.length }}</h2>
|
|
||||||
<div v-for="project in searchResult" :key="project.id">
|
|
||||||
<h2>{{ project.title }}</h2>
|
|
||||||
<p>{{ project.description }}</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div v-if="searchResultUsers.length > 0">
|
|
||||||
<h2>Найдено пользователей: {{ searchResultUsers.length }}</h2>
|
|
||||||
<div v-for="user in searchResultUsers" :key="user.id">
|
|
||||||
<h2>{{ user.username }}</h2>
|
|
||||||
<p>{{ user.email }}</p>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<h2>Найдено в проектах: {{ searchResult.length }}</h2>
|
|
||||||
<div v-if="searchResult.length > 0">
|
|
||||||
<div v-for="project in searchResult" :key="project.id">
|
|
||||||
<h2>{{ project.title }}</h2>
|
|
||||||
<p>{{ project.description }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<p>Не найдено проектов</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<h2>Найдено пользователей: {{ searchResultUsers.length }}</h2>
|
|
||||||
<div v-if="searchResultUsers.length > 0">
|
|
||||||
<div v-for="user in searchResultUsers" :key="user.id">
|
|
||||||
<h2>{{ user.username }}</h2>
|
|
||||||
<p>{{ user.email }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<p>Не найдено пользователей</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="row justify-space-between py-2">
|
|
||||||
<div>
|
|
||||||
<div class="col-lg-4 mx-auto">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</Header>
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</Header>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="card card-body blur shadow-blur mx-3 mx-md-4 mt-n6">
|
||||||
<div class="card card-body blur shadow-blur mx-3 mx-md-4 mt-n6">
|
|
||||||
<PresentationCounter />
|
<PresentationCounter />
|
||||||
<div class="project-container">
|
<div class="project-container">
|
||||||
<div class="project-card" v-for="project in projects" :key="project.id">
|
<div class="project-card" v-for="project in projects" :key="project.id">
|
||||||
@ -198,222 +114,6 @@ export default {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-4">
|
|
||||||
<FilledInfoCard
|
|
||||||
class="p-4"
|
|
||||||
:color="{ text: 'white', background: 'bg-gradient-success' }"
|
|
||||||
:icon="{ component: 'flag', color: 'white' }"
|
|
||||||
title="Getting Started"
|
|
||||||
description="Check the possible ways of working with our product and the necessary files for building your own project."
|
|
||||||
:action="{
|
|
||||||
route:
|
|
||||||
'https://www.creative-tim.com/learning-lab/vue/overview/material-kit/',
|
|
||||||
label: { text: 'Let\'s start', color: 'white' }
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4">
|
|
||||||
<FilledInfoCard
|
|
||||||
class="px-lg-1 mt-lg-0 mt-4 p-4"
|
|
||||||
height="h-100"
|
|
||||||
:icon="{ component: 'precision_manufacturing', color: 'success' }"
|
|
||||||
title="Plugins"
|
|
||||||
description="Get inspiration and have an overview about the plugins that we
|
|
||||||
used to create the Material Kit."
|
|
||||||
:action="{
|
|
||||||
route:
|
|
||||||
'https://www.creative-tim.com/learning-lab/vue/input/material-kit/',
|
|
||||||
label: { text: 'Read more' }
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4">
|
|
||||||
<FilledInfoCard
|
|
||||||
class="px-lg-1 mt-lg-0 mt-4 p-4"
|
|
||||||
:icon="{ component: 'receipt_long', color: 'success' }"
|
|
||||||
title="Utility Classes"
|
|
||||||
description="Material Kit is giving you a lot of pre-made elements. For those
|
|
||||||
who want flexibility, we included many utility classes."
|
|
||||||
:action="{
|
|
||||||
route:
|
|
||||||
'https://www.creative-tim.com/learning-lab/vue/utilities/material-kit/',
|
|
||||||
label: { text: 'Read more' }
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<PresentationTestimonials />
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="container-fluid mt-sm-5 border-radius-xl"
|
|
||||||
:style="{
|
|
||||||
background: 'linear-gradient(195deg, rgb(66, 66, 74), rgb(25, 25, 25))'
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="page-header py-6 py-md-5 my-sm-3 mb-3 border-radius-xl"
|
|
||||||
:style="{
|
|
||||||
backgroundImage: `url(${wavesWhite})`
|
|
||||||
}"
|
|
||||||
loading="lazy"
|
|
||||||
>
|
|
||||||
<span class="mask bg-gradient-dark"></span>
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="d-flex justify-content-center p-5">
|
|
||||||
<div class="col-lg-8 ms-lg-5 text-center">
|
|
||||||
<h3 class="text-white">
|
|
||||||
Do you love this awesome UI Kit from Vuejs & Bootstrap?
|
|
||||||
</h3>
|
|
||||||
<p class="text-white text-md">
|
|
||||||
Cause if you do, it can be yours for FREE. Hit the button
|
|
||||||
below to navigate to Creative Tim where you can <br />
|
|
||||||
find the Design System in HTML. Start a new project or give an
|
|
||||||
old Bootstrap project a new look!
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<a
|
|
||||||
href="https://www.creative-tim.com/product/vue-material-kit"
|
|
||||||
class="btn btn-sm mb-0 bg-gradient-success px-5 py-3 mt-4"
|
|
||||||
>Download Now</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="d-flex flex-column w-100 text-center p-5 mb-8">
|
|
||||||
<h3>Available on these technologies</h3>
|
|
||||||
<div class="d-flex justify-content-center mt-3 flex-wrap">
|
|
||||||
<a
|
|
||||||
href="https://www.creative-tim.com/product/material-kit"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="Bootstrap 5 - Most popular front-end component library"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoBootstrap"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a
|
|
||||||
class="opacity-5 ms-3"
|
|
||||||
href="#"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="Coming Soon"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoTailwind"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a
|
|
||||||
href="https://www.creative-tim.com/product/vue-material-kit-pro"
|
|
||||||
class="mx-3"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="Vue.js - Is a Progressive JavaScript Framework"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoVue"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a
|
|
||||||
class="opacity-5"
|
|
||||||
href="#"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="Coming Soon"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoAngular"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a
|
|
||||||
href="https://www.creative-tim.com/product/material-kit-react-pro"
|
|
||||||
class="mx-3"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="React – A JavaScript library for building user interfaces"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoReact"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a
|
|
||||||
class="opacity-5"
|
|
||||||
href="#"
|
|
||||||
data-bs-toggle="tooltip"
|
|
||||||
data-bs-placement="bottom"
|
|
||||||
title="Coming Soon"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="logoSketch"
|
|
||||||
alt="title"
|
|
||||||
loading="lazy"
|
|
||||||
:style="{ height: '90px' }"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="py-5">
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 ms-auto">
|
|
||||||
<h4 class="mb-1">Thank you for your support!</h4>
|
|
||||||
<p class="lead mb-0">We deliver the best web products</p>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-5 me-lg-auto my-lg-auto text-lg-end mt-5">
|
|
||||||
|
|
||||||
<MaterialSocialButton
|
|
||||||
route="https://twitter.com/intent/tweet?text=Check%20Material%20Design%20System%20made%20by%20%40CreativeTim%20%23webdesign%20%23designsystem%20%23bootstrap5&url=https%3A%2F%2Fwww.creative-tim.com%2Fproduct%2Fmaterial-design-system-pro"
|
|
||||||
component="twitter"
|
|
||||||
color="twitter"
|
|
||||||
label="Tweet"
|
|
||||||
/>
|
|
||||||
<MaterialSocialButton
|
|
||||||
route="https://www.facebook.com/sharer/sharer.php?u=https://www.creative-tim.com/product/material-design-system-pro"
|
|
||||||
component="facebook-square"
|
|
||||||
color="facebook"
|
|
||||||
label="Share"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<MaterialSocialButton
|
|
||||||
route=""
|
|
||||||
component="pinterest"
|
|
||||||
color="pinterest"
|
|
||||||
label="Pin it"
|
|
||||||
/>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
<DefaultFooter />
|
<DefaultFooter />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user