Merge pull request #1 from VikingEngineers/YuryTest

Yury test

package.json

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "@popperjs/core": "2.11.5",
+    "axios": "^1.4.0",
     "bootstrap": "5.1.3",
     "pinia": "2.0.14",
     "prismjs": "1.28.0",

src/assets/css/linkedmin.css

@@ -0,0 +1,4 @@
+@font-face {
+    font-family: 'PressStart2P' ;
+    src: url('../fonts/PressStart2P-Regular.ttf') format('truetype') ;
+}

src/examples/cards/ProjectCard.vue

@@ -0,0 +1,50 @@
+<template>
+    <div class="project-card">
+      <h2>{{ project.title }}</h2>
+      <img :src="project.featured_image" alt="Project Image">
+      <p>{{ project.description }}</p>
+      <p>Vote Total: {{ project.vote_total }}</p>
+      <p>Vote Ratio: {{ project.vote_ratio }}</p>
+      <p>Created: {{ project.created }}</p>
+      <p>Owner: {{ project.owner }}</p>
+      <p>Tags: {{ project.tags.join(', ') }}</p>
+    </div>
+  </template>
+  
+  <script>
+  import { ref } from 'vue'
+  
+  export default    {
+    name: 'ProjectCard',
+    setup() {
+      const project = ref({
+        id: 1,
+        title: "kateschka's project updated",
+        description: "КРУТОЙ ВЕБ-САЙТ",
+        featured_image: "http://somebodyhire.me/default.jpg",
+        demo_link: null,
+        source_link: null,
+        vote_total: 0,
+        vote_ratio: 0,
+        created: "2023-05-10T19:58:30.084115",
+        owner: 3,
+        tags: []
+      })
+  
+      return { project }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .project-card {
+    width: 300px;
+    padding: 20px;
+    border: 1px solid #ddd;
+    border-radius: 10px;
+  }
+  .project-card img {
+    width: 100%;
+    height: auto;
+  }
+  </style>

src/examples/navbars/NavbarDefault.vue

@@ -15,9 +15,9 @@ const props = defineProps({
     color: String,
     label: String,
     default: () => ({
-      route: "https://www.creative-tim.com/product/vue-material-kit",
+      route: "/pages/landing-pages/basic",
       color: "bg-gradient-success",
-      label: "Free Download"
+      label: "Вход/Регистрация"
     })
   },
   transparent: {
@@ -117,10 +117,10 @@ watch(
         ]"
         :to="{ name: 'presentation' }"
         rel="tooltip"
-        title="Designed and Coded by Creative Tim"
+        title="Цифровое портфолио и деловые контакты"
         data-placement="bottom"
       >
-        Material Kit 2
+        LinkedMin
       </RouterLink>
       <RouterLink
         class="navbar-brand d-block d-md-none"
@@ -131,7 +131,7 @@ watch(
         "
         to="/"
         rel="tooltip"
-        title="Designed and Coded by Creative Tim"
+        title="Цифровое портфолио и деловые контакты"
         data-placement="bottom"
       >
         Material Design
@@ -175,7 +175,117 @@ watch(
                 :class="getTextColor()"
                 >dashboard</i
               >
-              Pages
+              Люди
+              <img
+                :src="getArrowColor()"
+                alt="down-arrow"
+                class="arrow ms-2 d-lg-block d-none"
+              />
+              <img
+                :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"
+            >
+              <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"
+                      >
+                        Landing Pages
+                      </div>
+                      <RouterLink
+                        :to="{ name: 'about' }"
+                        class="dropdown-item border-radius-md"
+                      >
+                        <span>About Us</span>
+                      </RouterLink>
+                      <RouterLink
+                        :to="{ name: 'contactus' }"
+                        class="dropdown-item border-radius-md"
+                      >
+                        <span>Contact Us</span>
+                      </RouterLink>
+                      <RouterLink
+                        :to="{ name: 'author' }"
+                        class="dropdown-item border-radius-md"
+                      >
+                        <span>Author</span>
+                      </RouterLink>
+                      <div
+                        class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-0 mt-3"
+                      >
+                        Account
+                      </div>
+                      <RouterLink
+                        :to="{ name: 'signin-basic' }"
+                        class="dropdown-item border-radius-md"
+                      >
+                        <span>Sign In</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"
+                >
+                  Landing Pages
+                </div>
+                <RouterLink
+                  :to="{ name: 'about' }"
+                  class="dropdown-item border-radius-md"
+                >
+                  <span>About Us</span>
+                </RouterLink>
+                <RouterLink
+                  :to="{ name: 'contactus' }"
+                  class="dropdown-item border-radius-md"
+                >
+                  <span>Contact Us</span>
+                </RouterLink>
+                <RouterLink
+                  :to="{ name: 'author' }"
+                  class="dropdown-item border-radius-md"
+                >
+                  <span>Author</span>
+                </RouterLink>
+                <div
+                  class="dropdown-header text-dark font-weight-bolder d-flex align-items-center px-0 mt-3"
+                >
+                  Account
+                </div>
+                <RouterLink
+                  :to="{ name: 'signin-basic' }"
+                  class="dropdown-item border-radius-md"
+                >
+                  <span>Sign In</span>
+                </RouterLink>
+              </div>
+            </div>
+          </li>
+          <li class="nav-item dropdown dropdown-hover mx-2">
+            <a
+              role="button"
+              class="nav-link ps-2 d-flex cursor-pointer align-items-center"
+              :class="getTextColor()"
+              id="dropdownMenuPages"
+              data-bs-toggle="dropdown"
+              aria-expanded="false"
+            >
+              <i
+                class="material-icons opacity-6 me-2 text-md"
+                :class="getTextColor()"
+                >dashboard</i
+              >
+              Проекты
               <img
                 :src="getArrowColor()"
                 alt="down-arrow"
@@ -768,7 +878,7 @@ watch(
                 :class="getTextColor()"
                 >article</i
               >
-              Docs
+              Мой профиль
               <img
                 :src="getArrowColor()"
                 alt="down-arrow"
@@ -794,11 +904,10 @@ watch(
                       <h6
                         class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"
                       >
-                        Getting Started
+                        Мой профиль
                       </h6>
                       <span class="text-sm"
-                        >All about overview, quick start, license and
+                        >Просмотр и редактирование профиля</span
-                        contents</span
                       >
                     </a>
                   </li>
@@ -810,10 +919,10 @@ watch(
                       <h6
                         class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"
                       >
-                        Foundation
+                        Мои проекты
                       </h6>
                       <span class="text-sm"
-                        >See our colors, icons and typography</span
+                        >Просмотр и редактирование проектов, в которых я принимаю участие</span
                       >
                     </a>
                   </li>
@@ -825,11 +934,10 @@ watch(
                       <h6
                         class="dropdown-header text-dark font-weight-bolder d-flex justify-content-cente align-items-center p-0"
                       >
-                        Components
+                        Мои сообщения
                       </h6>
                       <span class="text-sm"
-                        >Explore our collection of fully designed
+                        >Просмотр и отправка личных сообщений</span
-                        components</span
                       >
                     </a>
                   </li>
@@ -908,9 +1016,9 @@ watch(
               </div>
             </div>
           </li>
-          <li class="nav-item dropdown dropdown-hover mx-2">
+          <!-- <li class="nav-item dropdown dropdown-hover mx-2">
             <a
-              href="https://www.github.com/creativetimofficial/vue-material-kit"
+              href="hhttps://github.com/VikingEngineers"
               class="nav-link d-flex cursor-pointer align-items-center"
             >
               <svg
@@ -928,7 +1036,7 @@ watch(
               </svg>
               Github
             </a>
-          </li>
+          </li> -->
         </ul>
         <ul class="navbar-nav d-lg-block d-none">
           <li class="nav-item">

src/main.js

@@ -6,9 +6,12 @@ import router from "./router";
 // Nucleo Icons
 import "./assets/css/nucleo-icons.css";
 import "./assets/css/nucleo-svg.css";
+import "./assets/css/linkedmin.css";
 
 import materialKit from "./material-kit";
 
+
+
 const app = createApp(App);
 
 app.use(createPinia());

src/views/LandingPages/AboutUs/AboutView.vue

@@ -60,7 +60,7 @@ onUnmounted(() => {
         <div class="row justify-content-center">
           <div class="col-lg-8 text-center mx-auto my-auto">
             <h1 class="text-white">
-              Work with an amazing <span class="text-white" id="typed"></span>
+             We have no <span class="text-white" id="typed"></span>
             </h1>
             <div id="typed-strings">
               <h1>team</h1>

src/views/Presentation/PresentationView.vue

@@ -1,3 +1,18 @@
+<style scoped>
+.project-container {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+.project-card {
+  flex-basis: calc(33.33% - 1em); /* 1em is for margin */
+  margin: 0.5em;
+  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
+  padding: 1em;
+  box-sizing: border-box;
+}
+</style>
+
 <script setup>
 import { onMounted, onUnmounted } from "vue";
 
@@ -5,10 +20,11 @@ import { onMounted, onUnmounted } from "vue";
 import NavbarDefault from "../..//examples/navbars/NavbarDefault.vue";
 import DefaultFooter from "../../examples/footers/FooterDefault.vue";
 import Header from "../../examples/Header.vue";
-import FilledInfoCard from "../../examples/cards/infoCards/FilledInfoCard.vue";
+
+
 
 //Vue Material Kit 2 components
-import MaterialSocialButton from "@/components/MaterialSocialButton.vue";
+import MaterialInput from "@/components/MaterialInput.vue";
 
 // sections
 import PresentationCounter from "./Sections/PresentationCounter.vue";
@@ -20,14 +36,7 @@ import PresentationTestimonials from "./Sections/PresentationTestimonials.vue";
 import PresentationInformation from "./Sections/PresentationInformation.vue";
 
 //images
-import vueMkHeader from "@/assets/img/vue-mk-header.jpg";
+import vueMkHeader from "@/assets/img/space-background.jpg";
-import wavesWhite from "@/assets/img/waves-white.svg";
-import logoBootstrap from "@/assets/img/logos/bootstrap5.jpg";
-import logoTailwind from "@/assets/img/logos/icon-tailwind.jpg";
-import logoVue from "@/assets/img/logos/vue.jpg";
-import logoAngular from "@/assets/img/logos/angular.jpg";
-import logoReact from "@/assets/img/logos/react.jpg";
-import logoSketch from "@/assets/img/logos/sketch.jpg";
 
 //hooks
 const body = document.getElementsByTagName("body")[0];
@@ -41,6 +50,28 @@ onUnmounted(() => {
 });
 </script>
 
+<script>
+import axios from 'axios';
+
+export default {
+  data() {
+    return {
+      projects: [],
+    };
+  },
+  async created() {
+    try {
+      const response = await axios.get('http://somebodyhire.me/api/projects/');
+      this.projects = response.data;
+    } catch (error) {
+      console.error('There was an error fetching the projects', error);
+    }
+  },
+};
+</script>
+
+
+
 <template>
   <div class="container position-sticky z-index-sticky top-0">
     <div class="row">
@@ -55,32 +86,53 @@ onUnmounted(() => {
       :style="`background-image: url(${vueMkHeader})`"
       loading="lazy"
     >
-      <div class="container">
+    <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 ' }"
             >
-              Material Kit 2
+              LinkedMin
             </h1>
-            <p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500' }">
+            <p class="lead text-white px-5 mt-3" :style="{ fontWeight: '500',  fontFamily: 'PressStart2P, sans-serif' }">
-              Start the Development With Bootstrap 5 Design System inspired by
+            Показывай себя и свои проекты.  
-              Material Design.
+             Находи вдохновение, коллег и новые знания.
             </p>
           </div>
         </div>
+
+        <div class="container">
+      <div class="row justify-space-between py-2">
+        <div class="col-lg-4 mx-auto">
+          <MaterialInput
+            class="input-group-dynamic mb-4"
+            icon="search"
+            type="text"
+            placeholder="Поиск по проектам или людям"
+          />
+        </div>
       </div>
+    </div>
+      </div>
+        
     </div>
   </Header>
 
+
+
+
   <div class="card card-body blur shadow-blur mx-3 mx-md-4 mt-n6">
     <PresentationCounter />
-    <PresentationInformation />
+    <div class="project-container">
-    <PresentationExample :data="data" />
+    <div class="project-card" v-for="project in projects" :key="project.id">
-    <PresentationPages />
+      <h3>{{ project.title }}</h3>
-    <BuiltByDevelopers />
+      <p>{{ project.description }}</p>
+    </div>
+  </div>
 
+  </div>
+<!-- 
     <div class="container">
       <div class="row">
         <div class="col-lg-4">
@@ -270,6 +322,7 @@ onUnmounted(() => {
             <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"
@@ -282,16 +335,21 @@ onUnmounted(() => {
               color="facebook"
               label="Share"
             />
+            
             <MaterialSocialButton
               route=""
               component="pinterest"
               color="pinterest"
               label="Pin it"
             />
+           
           </div>
         </div>
       </div>
     </div>
-  </div>
+  </div> -->
   <DefaultFooter />
 </template>
+
+
+

src/views/Presentation/Sections/Data/Untitled-1.js

@@ -0,0 +1,21 @@
+const axios = require('axios');
+
+async function testAPI() {
+    try {
+        const response = await axios.get('http://somebodyhire.me/api/projects/');
+        
+        const items = response.data.map((project) => ({
+            image: project.featured_image,
+            title: project.title,
+            subtitle: project.description,
+            route: project.id,
+            pro: false // replace with actual condition for 'pro'
+        }));
+        
+        console.log(items[0]);
+    } catch (error) {
+        console.error('Error connecting to API:', error);
+    }
+}
+
+testAPI();

src/views/Presentation/Sections/Data/designBlocksData.js

@@ -28,8 +28,60 @@ import imgAlert from "@/assets/img/alerts.jpg";
 import imgPopover from "@/assets/img/popovers.jpg";
 import imgModal from "@/assets/img/modals.jpg";
 import imgDropdowns from "@/assets/img/dropdowns.jpg";
+import axios from "axios";
 
+
+// async function getProjects() {
+//   try {
+//       const response = await axios.get('http://somebodyhire.me/api/projects/');
+
+//       // Map the response to your desired structure
+//       const items = response.data.map((project) => ({
+//           image: project.featured_image,
+//           title: project.title,
+//           subtitle: project.description,
+//           route: project.id,
+//           pro: false
+//       }));
+
+//       return items;
+//   } catch (error) {
+//       console.error(error);
+//   }
+// }
+
+// export default async function getProjectData() {
+//   const items = await getProjects();
+
+//   return [
+//       {
+//           heading: "Проекты",
+//           description: "Проекты наших пользователей",
+//           items: items,
+//       },
+//   ];
+// }
+
+
+// }
 export default [
+  {
+    heading: "Проекты",
+    description:
+      "Проекты наших пользователей",
+    items: [
+        {
+          image: `${imagesPrefix}/headers.jpg`,
+          title: "Проект",
+          subtitle: "Nope",
+          route: "page-headers",
+          pro: false
+        },
+
+    ],
+    
+    
+  },
   {
     heading: "Design Blocks",
     description:

src/views/Presentation/Sections/PresentationCounter.vue

@@ -2,6 +2,36 @@
 import DefaultCounterCard from "../../../examples/cards/counterCards/DefaultCounterCard.vue";
 </script>
 
+<script>
+import axios from 'axios';
+
+export default {
+  data() {
+    return {
+      projectsCount: 0,  // This data property will hold the count of projects
+      usersCount: 0,     // This data property will hold the count of users
+    };
+  },
+  async created() {
+    try {
+      // Fetch the projects data from the server
+      const projectsResponse = await axios.get('http://somebodyhire.me/api/projects/');
+      // Set the projectsCount to the number of projects received from the server
+      this.projectsCount = projectsResponse.data.length;
+
+      // Fetch the users data from the server
+      const usersResponse = await axios.get('http://somebodyhire.me/api/profiles/');
+      // Set the usersCount to the number of users received from the server
+      this.usersCount = usersResponse.data.length;
+
+    } catch (error) {
+      // Log any errors that occur during the fetch to the console
+      console.error(error);
+    }
+  },
+};
+</script>
+
 <template>
   <section class="pt-3 pb-4" id="count-stats">
     <div class="container">
@@ -11,11 +41,9 @@ import DefaultCounterCard from "../../../examples/cards/counterCards/DefaultCoun
             <div class="col-md-4 position-relative">
               <DefaultCounterCard
                 color="success"
-                title="Coded Elements"
+                title="Проектов"
-                description="From buttons, to inputs, navbars, alerts or cards, you are
+                description="Представлено на нашем сайте"
-                  covered"
+                :count="projectsCount"
-                :count="70"
-                suffix="+"
                 :duration="3000"
                 divider="vertical"
               />
@@ -23,11 +51,9 @@ import DefaultCounterCard from "../../../examples/cards/counterCards/DefaultCoun
             <div class="col-md-4 position-relative">
               <DefaultCounterCard
                 color="success"
-                title="Design Blocks"
+                title="Пользователей"
-                description="Mix the sections, change the colors and unleash your
+                description="Зарегистрированно с момента запуска проекта"
-                  creativity"
+                :count="usersCount"
-                :count="15"
-                suffix="+"
                 :duration="3000"
                 divider="vertical"
               />
@@ -35,10 +61,10 @@ import DefaultCounterCard from "../../../examples/cards/counterCards/DefaultCoun
             <div class="col-md-4">
               <DefaultCounterCard
                 color="success"
-                title="Pages"
+                title="Раз"
-                description="Save 3-4 weeks of work when you use our pre-made pages for
+                description="Мы прокляли день, когда сели за баранку этого пылесоса"
-                  your website"
+                :count="9000"
-                :count="4"
+                suffix="+"
                 :duration="3000"
               />
             </div>