+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..2425c0f
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,5 @@
+import { createApp } from 'vue'
+import './style.css'
+import App from './App.vue'
+
+createApp(App).mount('#app')
diff --git a/src/module.d.ts b/src/module.d.ts
new file mode 100644
index 0000000..6129ecb
--- /dev/null
+++ b/src/module.d.ts
@@ -0,0 +1 @@
+declare module 'vue-awesome-swiper2'
\ No newline at end of file
diff --git a/src/pages/index/Index.css b/src/pages/index/Index.css
new file mode 100644
index 0000000..2a99221
--- /dev/null
+++ b/src/pages/index/Index.css
@@ -0,0 +1,734 @@
+.read-the-docs {
+ color: #888;
+}
+
+* {
+ margin: 0;
+ padding: 0;
+}
+
+html,
+body {
+ width: 100%;
+ height: 100%;
+}
+
+.max-abs {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.max-bg {
+ width: 100vw;
+ height: 100vh;
+ overflow: hidden;
+}
+
+.index-bg-img {
+ width: 100%;
+ height: 100%;
+ min-height: 100vh;
+ object-fit: cover;
+ position: relative;
+}
+
+.bg-mask {
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #00000018;
+}
+
+.inline-top-text {
+ margin-left: 3rem;
+ margin-top: 15%;
+ display: inline-block;
+ user-select: none;
+}
+
+.bg-mask-2 {
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #28283E;
+}
+
+.bg-mask-3 {
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #00000060;
+}
+
+/* .item-img-mask {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background: #0000003c;
+} */
+
+@media screen and (orientation: portrait) {
+ .top-nav {
+ display: none;
+ }
+
+ .title-float-left {
+ float: left;
+ }
+
+ .contact-text-block-top {
+ margin-top: 5rem;
+ }
+
+ .title-contact-us {
+ margin-top: 3rem !important;
+ }
+
+ .max-bg {
+ width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+ overflow-y: auto;
+ }
+
+ /*竖屏 css*/
+ .logo {
+ position: absolute;
+ left: 50%;
+ top: 52%;
+ transform: translate(-50%, -50%);
+ width: 15rem;
+ }
+
+ .project-container {
+ /* background-color: yellow; */
+ /* padding: 5rem; */
+ /* width: 100%; */
+ width: fit-content;
+ margin: auto;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ padding: 3rem;
+ }
+
+ .project-container-outer {
+ /* background-color: green; */
+ margin: 0 auto;
+ }
+
+ .project-title {
+ margin-top: 0.2rem;
+ margin-bottom: 1rem;
+ text-align: left;
+ }
+
+ .project-container-inner {
+ /* background-color: red; */
+ width: 100%;
+ height: 100%;
+ }
+
+ .project-items {
+ display: grid;
+ grid-template-columns: 1fr;
+ width: fit-content;
+ height: 100%;
+ }
+
+ .project-item {
+ margin: 0 2rem 0.5rem 0;
+ width: 100%;
+ height: 100%;
+ /* background: #0000003c; */
+ }
+
+ .project-item-mask {
+ position: relative;
+ left: 0;
+ top: calc(-100% + 0.5rem);
+ width: 100%;
+ height: calc(100% - 0.85rem);
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #0000005c;
+ /* #0000005c; */
+ }
+
+ .project-item-mask-3 {
+ position: relative;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: calc(100% - 0.85rem);
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #0000005c;
+ /* #0000005c; */
+ }
+
+ .project-item-2 {
+ width: 100%;
+ height: fit-content;
+ position: inherit;
+ display: block;
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ /* #0000005c; */
+ }
+
+ .mask-color {
+ background-color: #0000005c;
+ }
+
+ .project-item-img-2 {
+ object-fit: cover;
+ position: relative;
+ left: 0;
+ top: 0;
+ width: 100%;
+ }
+
+ .item-text-size {
+ font-size: 36px;
+ user-select: none;
+ }
+
+ .contact-container {
+ width: 100%;
+ padding-bottom: 0;
+ }
+
+ .desc-height {
+ height: auto;
+ }
+
+ .desc-fix {
+ top: -45%;
+ }
+
+ .contact-text-block {
+ position: relative;
+ height: fit-content;
+ }
+
+ .about-us-inner {
+ position: relative;
+ top: 0;
+ padding-top: 1rem;
+ display: block;
+ overflow: hidden;
+ width: 100%;
+ height: 100%;
+ }
+
+ .desc-item-mask {
+ margin-top: 0;
+ width: 100%;
+ height: 100%;
+ display: flex;
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ /* #0000005c; */
+ }
+
+ .project-item-about-us {
+ margin-top: 0;
+ }
+
+ .item-text-2 {
+ margin: 5.5rem 2rem 0 2rem;
+ }
+
+ .content-height {
+ height: fit-content;
+ }
+
+ .out-customers {
+ text-align: left;
+ }
+
+ .center-offset {
+ position: absolute;
+ left: 0;
+ top: 50%;
+ right: 0;
+ height: 10rem;
+ text-align: center;
+ transform: translateY(-90%);
+ }
+
+ .page-projects {
+ height: fit-content !important;
+ }
+
+ .customers {
+ width: 70%;
+ height: 100%;
+ text-align: left;
+ margin: 6rem 6rem 6rem 0;
+ }
+
+ .show-portrait {
+ display: block;
+ }
+
+ .show-landspace {
+ display: none;
+ }
+
+ .contact-us {
+ margin-top: 0;
+ }
+
+
+ /* .contact-no-padding-top {
+ padding-top: 0;
+ } */
+
+ .contact-no-margin-top {
+ margin-top: 0 !important;
+ }
+
+ .desc {
+ padding: 0;
+ margin: 0;
+ text-align: left;
+ font-size: 22px;
+ color: #000000;
+ }
+
+ .page {
+ width: 100%;
+ }
+
+ .page-max {
+ width: 100%;
+ height: 100vh;
+ }
+
+ .fullPageContainer {
+ width: 100%;
+ }
+
+ .detail-portrait {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ }
+}
+
+@media screen and (orientation: landscape) {
+
+ .show-portrait {
+ display: none;
+ }
+
+ .contact-text-block-top {
+ margin-top: 2rem;
+ }
+
+ .show-landspace {
+ display: block;
+ }
+
+ /*横屏 css*/
+ .logo {
+ position: absolute;
+ left: 50%;
+ top: 52%;
+ transform: translate(-50%, -50%);
+ width: 22rem;
+ }
+
+ .options {
+ display: none;
+ }
+
+ .top-nav {
+ width: fit-content;
+ float: right;
+ margin-right: 10%;
+ cursor: pointer;
+ }
+
+ .project-container {
+ /* background-color: yellow; */
+ padding: 0;
+ width: 70%;
+ height: 80%;
+ margin: auto;
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ }
+
+ .project-container-outer {
+ /* background-color: green; */
+ width: 100%;
+ margin: 0 auto;
+ /* 20/1.2==16.6 */
+ /* transform: scale(1.2) translateX(16.6%) translateY(16.6%) */
+ }
+
+ .project-title {
+ margin-bottom: 3.5rem;
+ text-align: left;
+ }
+
+ .project-container-inner {
+ /* background-color: red; */
+ width: 100%;
+ height: 100%;
+ }
+
+ .project-items {
+ margin-top: 2rem;
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ width: 100%;
+ height: 100%;
+ }
+
+ .project-item {
+ /* height: fit-content; */
+ margin: 0 2rem 0 0;
+ /* width: fit-content; */
+ height: 100%;
+ /* width: 88%; */
+ /* background: #0000003c; */
+ }
+
+ .project-item-mask {
+ position: relative;
+ left: 0;
+ top: -100%;
+ width: 100%;
+ height: calc(100% - 0.4rem);
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #0000005c;
+ /* #0000005c; */
+ }
+
+ .item-text-size {
+ font-size: 64px;
+ user-select: none;
+ }
+
+ .our-customers {
+ text-align: right;
+ position: relative;
+ }
+
+ .customers {
+ position: relative;
+ top: 5rem;
+ width: 50%;
+ text-align: right;
+ margin: 6rem 0 6rem -1.5rem;
+ }
+
+ .desc {
+ padding: 1rem;
+ text-align: left;
+ font-size: 22px;
+ color: #000000;
+ }
+
+ .contact-text-block {
+ position: absolute;
+ top: 40%;
+ transform: translateY(-50%);
+ height: fit-content;
+ }
+
+ .page {
+ width: 100%;
+ height: 100%;
+ }
+
+ .relative {
+ position: relative;
+ }
+
+ .fullPageContainer {
+ width: 100%;
+ height: 100vh;
+ transition: all linear 0.5s;
+ }
+
+ /* .contact-container {} */
+}
+
+
+.bg-alpha {
+ background-color: transparent;
+}
+
+.no-padding {
+ padding: 0 !important;
+}
+
+.item-text {
+ color: white;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.logo-w {
+ position: absolute;
+ left: 8%;
+ top: 6%;
+ width: 1.5rem;
+ height: 2.25rem;
+ user-select: none;
+}
+
+.options {
+ position: absolute;
+ right: 8%;
+ top: 6%;
+ width: 1.5rem;
+ height: 2.25rem;
+ user-select: none;
+}
+
+.white-bg {
+ background-color: white;
+}
+
+.index-max-rel {
+ padding: 0;
+ left: 0;
+ top: calc(-100% - 2rem);
+ width: 100%;
+ height: calc(100% + 1.6rem);
+}
+
+.index-rel-top2 {
+ top: -202.5%;
+}
+
+
+.project-item-img {
+ object-fit: cover;
+ position: relative;
+ left: 0;
+ top: 0;
+ width: 100%;
+}
+
+.center {
+ position: absolute;
+ left: 0;
+ top: 50%;
+ right: 0;
+ text-align: center;
+ transform: translateY(-90%);
+}
+
+.options-div {
+ height: 6rem;
+}
+
+.options-text {
+ color: white;
+ font-size: 20px;
+}
+
+.options-close {
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 8rem;
+ margin: 0 auto;
+}
+
+.logo-center {
+ width: 40%;
+ user-select: none;
+ -webkit-user-drag: none;
+}
+
+.title-center {
+ margin-top: 4.2rem;
+ text-align: center;
+ width: 100%;
+ user-select: none;
+ -webkit-user-drag: none;
+}
+
+.up-arraw {
+ position: absolute;
+ left: 50%;
+ top: 2rem;
+ transform: rotateZ(180deg) translate(-50%, -50%);
+ width: 21px;
+ height: 21px;
+}
+
+.down-arraw {
+ position: absolute;
+ left: 50%;
+ bottom: 2rem;
+ transform: translate(-50%, -50%);
+ width: 21px;
+ height: 21px;
+}
+
+.about-us-text {
+ position: relative;
+ margin-bottom: 1rem;
+ color: #000000;
+ text-align: justify;
+}
+
+.section {
+ width: 100%;
+ height: 100vh;
+ background-position: center center;
+ background-repeat: no-repeat;
+}
+
+.title-text {
+ color: #000000;
+ font-size: 30px;
+}
+
+.title-text-white {
+ color: #FFFFFF;
+ font-size: 30px;
+}
+
+.flex-center {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.detail-scroll {
+ overflow-x: hidden;
+ overflow-y: auto;
+ padding-top: 3rem;
+ width: 80%;
+ height: 65%;
+ position: absolute;
+ left: 0;
+ right: 0;
+}
+
+.options-close-2 {
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 3rem;
+ margin: 0 auto;
+}
+
+.bg-mask-4 {
+ /* background: url(@/assets/imgs/ImageMask.svg); */
+ background-color: #ffffff;
+}
+
+.desc-item {
+ top: 0;
+ right: inherit;
+ bottom: inherit;
+ display: block;
+}
+
+.desc-height {
+ height: 100%;
+}
+
+.desc-alpha {
+ opacity: 0;
+}
+
+.no-events {
+ /* pointer-events: none; */
+}
+
+.has-events {
+ /* pointer-events: all; */
+}
+
+
+.contact-person {
+ font-size: 22px;
+}
+
+.contact-email {
+ font-size: 20px;
+}
+
+.contact-code {
+ font-size: 20px;
+}
+
+.contact-company {
+ font-size: 20px;
+}
+
+.contact-address {
+ font-size: 20px;
+}
+
+.contact-text {
+ text-align: left;
+ margin-top: 1rem;
+ color: black;
+}
+
+.global-font {
+ font-family: 'DIN';
+ /* font-weight: normal; */
+}
+
+.global-font-bold {
+ font-weight: bold;
+}
+
+@font-face {
+ font-family: "DIN";
+ src: url('@/assets/fonts/DINCond-Bold.otf');
+ font-weight: normal;
+ font-style: normal;
+}
+
+.swiper-container {
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ background: rgba(108, 108, 108, 0.5);
+}
+
+.swiper-win {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 100%;
+ height: 100%;
+}
+
+.options-close-3 {
+ position: absolute;
+ right: 14.2%;
+ top: 4rem;
+ width: 2.5rem;
+ z-index: 99;
+}
+
+.customers-img {
+ width: 100%;
+ object-fit: cover;
+}
\ No newline at end of file
diff --git a/src/pages/index/Index.ts b/src/pages/index/Index.ts
new file mode 100644
index 0000000..be58c32
--- /dev/null
+++ b/src/pages/index/Index.ts
@@ -0,0 +1,294 @@
+import { defineComponent, onMounted, onBeforeUnmount, ref } from 'vue'
+import SwiperWin from '../../components/swiper/SwiperWin.vue'
+import utils from '../../util/utils'
+
+export default defineComponent({
+ name: 'Index',
+ components: {
+ SwiperWin
+ },
+ data() {
+ return {
+ }
+ },
+ // setup(props, context) {
+ setup() {
+
+ const fullPageEl = ref
+ ![]()
+
+
+
+
+
+ 
+
+
+
+
+
diff --git a/src/style.css b/src/style.css
new file mode 100644
index 0000000..9cea08f
--- /dev/null
+++ b/src/style.css
@@ -0,0 +1,87 @@
+:root {
+ font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+ line-height: 1.5;
+ font-weight: 400;
+
+ color-scheme: light dark;
+ color: rgba(255, 255, 255, 0.87);
+ background-color: #242424;
+
+ font-synthesis: none;
+ text-rendering: optimizeLegibility;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+ font-weight: 500;
+ color: #646cff;
+ text-decoration: inherit;
+}
+
+a:hover {
+ color: #535bf2;
+}
+
+body {
+ margin: 0;
+ display: flex;
+ place-items: center;
+ min-width: 320px;
+ min-height: 100vh;
+ overflow: hidden;
+}
+
+h1 {
+ font-size: 3.2em;
+ line-height: 1.1;
+}
+
+button {
+ border-radius: 8px;
+ border: 1px solid transparent;
+ padding: 0.6em 1.2em;
+ font-size: 1em;
+ font-weight: 500;
+ font-family: inherit;
+ background-color: #1a1a1a;
+ cursor: pointer;
+ transition: border-color 0.25s;
+}
+
+button:hover {
+ border-color: #646cff;
+}
+
+button:focus,
+button:focus-visible {
+ outline: 4px auto -webkit-focus-ring-color;
+}
+
+.card {
+ padding: 2em;
+}
+
+#app {
+ /* max-width: 1280px; */
+ margin: 0 auto;
+ padding: 0;
+ text-align: center;
+ width: 100%;
+ height: 100%;
+}
+
+@media (prefers-color-scheme: light) {
+ :root {
+ color: #213547;
+ background-color: #ffffff;
+ }
+
+ a:hover {
+ color: #747bff;
+ }
+
+ button {
+ background-color: #f9f9f9;
+ }
+}
\ No newline at end of file
diff --git a/src/util/utils.ts b/src/util/utils.ts
new file mode 100644
index 0000000..bb8e4ff
--- /dev/null
+++ b/src/util/utils.ts
@@ -0,0 +1,7 @@
+// 获取assets静态资源
+const getAssetsFile = (url: string) => {
+ return new URL(`../assets/${url}`, import.meta.url).href;
+};
+export default {
+ getAssetsFile,
+};
\ No newline at end of file
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
new file mode 100644
index 0000000..11f02fe
--- /dev/null
+++ b/src/vite-env.d.ts
@@ -0,0 +1 @@
+///
+
+
+
+ 
+
+
+
+
+
+ 
+ 
+
+
+
+
+
+
+ PROJECTS
+
+
+ ABOUT US
+
+
+ CONTACT US
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+ PROJECTS
+
+
+
+
+
+
+ 
+
+
+
+
+
+ Hotel
+
+
+ 
+
+
+
+
+
+ Restaurant
+
+
+
+
+
+
+ 
+
+
+
+
+
+ School
+
+
+ 
+
+
+
+
+
+ Franchise
+
+
+
+
+
+
+
+
+
+
+
+ ABOUT US
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+ At Engintel Consulting, we specialize in providing
+ engineering consulting services for the food service
+ equipment manufacturing industry, helping businesses
+ manage the rising costs of in-house staffing, training,
+ and employee turnover.
+
+
+
+ By offering a seamless, permanent workforce solution, we
+ enable our clients to focus on their core operations
+ without the burden of maintaining and training
+ additional staff.
+
+
+ From developing 3D models to drafting precise drawings
+ and preparing CAM documents, we deliver comprehensive
+ support for day-to-day operations.
+
+
+ As we expand, we’re also extending our services to other
+ industries, ensuring high-quality engineering solutions
+ that are cost-effective and reliable.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ At Engintel Consulting, we specialize in providing
+ engineering consulting services for the food service
+ equipment manufacturing industry, helping businesses
+ manage the rising costs of in-house staffing, training,
+ and employee turnover.
+
+
+
+ By offering a seamless, permanent workforce solution, we
+ enable our clients to focus on their core operations
+ without the burden of maintaining and training additional
+ staff.
+
+
+ From developing 3D models to drafting precise drawings and
+ preparing CAM documents, we deliver comprehensive support
+ for day-to-day operations.
+
+
+ As we expand, we’re also extending our services to other
+ industries, ensuring high-quality engineering solutions
+ that are cost-effective and reliable.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ CONTACT US
+
+
+
+
+
+
+ Jason Yuan
+
+
+ engintelconsulting@gmail.com
+
+
+ 404.277.9693
+
+
+
+ Engintel Consulting, LLC
+
+
+ 375 Satterwhite Dr. Alpharetta, GA 30022
+
+
+
+
+
+
+ OUR CUSTOMERS
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ OUR CUSTOMERS
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+ 
+
+
+