V 0.3
@ -0,0 +1,44 @@
|
|||||||
|
import React, { useState } from 'react'
|
||||||
|
|
||||||
|
import { useStaticQuery, graphql } from "gatsby"
|
||||||
|
import Image from './Image'
|
||||||
|
|
||||||
|
const Example = () => {
|
||||||
|
|
||||||
|
const images = useStaticQuery(graphql`
|
||||||
|
query {
|
||||||
|
img1: file(relativePath: {eq: "legosp/1.jpg"}) {
|
||||||
|
childImageSharp {
|
||||||
|
gatsbyImageData(formats: WEBP, quality: 90, width: 800)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
img2: file(relativePath: {eq: "legosp/3.jpg"}) {
|
||||||
|
childImageSharp {
|
||||||
|
gatsbyImageData(formats: WEBP, quality: 90, width: 800)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
img3: file(relativePath: {eq: "legosp/4.jpg"}) {
|
||||||
|
childImageSharp {
|
||||||
|
gatsbyImageData(formats: WEBP, quality: 90, width: 800)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}`);
|
||||||
|
|
||||||
|
const [examples] = useState([
|
||||||
|
{id: 1, img: images.img1},
|
||||||
|
{id: 2, img: images.img2},
|
||||||
|
{id: 3, img: images.img3},
|
||||||
|
]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className='pt-16 max-md:pt-16'>
|
||||||
|
<div className="flex flex-wrap">
|
||||||
|
{examples.map((example, index) =>
|
||||||
|
<Image initial={{ x: 0, opacity: 0 }} whileInView={{ x: 0, opacity: 1 }} transition={{ delay:index*0.1, duration: 0.5 }} viewport={{ once: true }} key={example.id} title={example.title} image={example.img}></Image>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Example
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import React, { forwardRef } from 'react'
|
||||||
|
import { getImage } from 'gatsby-plugin-image';
|
||||||
|
import { motion } from "framer-motion";
|
||||||
|
|
||||||
|
const Image = motion(
|
||||||
|
forwardRef(({image}, ref) => {
|
||||||
|
return (
|
||||||
|
<div ref={ref} className="flex basis-1/3 max-lg:basis-1/2 h-96 flex-grow max-md:h-44 max-2xl:h-60 overflow-hidden border-2 border-white">
|
||||||
|
<div style={{'--image-url': `url(${getImage(image).images.fallback.src})`}} className="[&>h3]:hover:-translate-y-7 w-full bg-cover bg-center hover:scale-105 duration-[2s] ease-[cubic-bezier(0, 1, 0.35, 1)] transition-all flex items-center justify-center relative bg-no-repeat bg-[linear-gradient(to_bottom,rgba(0,0,0,0.5),rgba(0,0,0,0.5)),var(--image-url)] "></div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
)
|
||||||
|
|
||||||
|
export default Image
|
||||||
|
After Width: | Height: | Size: 406 KiB |
|
After Width: | Height: | Size: 144 KiB |
|
After Width: | Height: | Size: 483 KiB |
|
After Width: | Height: | Size: 344 KiB |
|
After Width: | Height: | Size: 503 KiB |
|
After Width: | Height: | Size: 397 KiB |
|
After Width: | Height: | Size: 472 KiB |
|
After Width: | Height: | Size: 75 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 166 KiB |
|
After Width: | Height: | Size: 125 KiB |
|
After Width: | Height: | Size: 306 KiB |
|
After Width: | Height: | Size: 212 KiB |
|
After Width: | Height: | Size: 130 KiB |
|
Before Width: | Height: | Size: 172 KiB |
|
After Width: | Height: | Size: 54 KiB |
|
After Width: | Height: | Size: 282 KiB |
|
After Width: | Height: | Size: 404 KiB |
|
Before Width: | Height: | Size: 268 KiB After Width: | Height: | Size: 970 KiB |
@ -0,0 +1,57 @@
|
|||||||
|
import React, { useState } from "react"
|
||||||
|
import Layout from "../../components/layout"
|
||||||
|
import Seo from "../../components/seo"
|
||||||
|
import Hero from "../../components/Games/GamePage/Hero";
|
||||||
|
import Contact from "../../components/Contact"
|
||||||
|
import { useStaticQuery, graphql } from "gatsby"
|
||||||
|
|
||||||
|
const BlackGoldPage = () => {
|
||||||
|
|
||||||
|
const [menu] = useState([
|
||||||
|
{id: 0, title: 'Цели', to: 'purposes'},
|
||||||
|
{id: 1, title: 'Навыки', to: 'direction'},
|
||||||
|
{id: 2, title: 'Контакты', to: 'contact'},
|
||||||
|
])
|
||||||
|
const image = useStaticQuery(graphql`
|
||||||
|
query {
|
||||||
|
img: file(relativePath: {eq: "games/black-gold.jpg"}) {
|
||||||
|
childImageSharp {
|
||||||
|
gatsbyImageData(formats: WEBP)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}`);
|
||||||
|
return(
|
||||||
|
<Layout menu={menu}>
|
||||||
|
<Hero title="Черное золото" time='4-4.5 часа' formats='оффлайн' members='до 15 человек' img={image.img}></Hero>
|
||||||
|
<section className="py-28 max-md:py-16 max-md:px-3" id="purposes">
|
||||||
|
<div className="container mx-auto text-slate-900 text-base max-w-6xl">
|
||||||
|
<h2 className='text-3xl max-md:text-2xl mb-10 max-md:mb-8 font-semibold text-slate-800 text-center uppercase'>Цель игры</h2>
|
||||||
|
<p className='mb-8'>Наработать навык по сплочению и командообразованию руководителей развить навыки управленческих компетенций. Создать командный проект по модернизации системы бизнес процессов и стратегии развития нефтяногопредприятия. Проанализировать и подготовить предложения по оптимизации бизнес процессов и улучшению производительности труда</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section className="py-28 max-md:py-16 max-md:px-3 bg-[#0E0808]" id="direction">
|
||||||
|
<div className="container mx-auto text-white text-base max-w-6xl">
|
||||||
|
<h2 className='text-3xl max-md:text-2xl mb-16 max-md:mb-8 font-semibold text-white text-center uppercase'>Навыки вырабатываемые в ходе игры</h2>
|
||||||
|
<div className="flex justify-between items-center max-md:flex-col">
|
||||||
|
<ul className='mb-8 list-disc list-inside leading-normal mr-5'>
|
||||||
|
<li className="mb-1">Выявить «узкие» места в процессе командообразования руководителей</li>
|
||||||
|
<li className="mb-1">Дать обратную связь руководителям по зонам их развития в области выстраивания команд и управления персоналом</li>
|
||||||
|
<li className="mb-1">Научится принять экономически выгодные, командные решения в условиях изменений</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<Contact id="contact" white={true}></Contact>
|
||||||
|
</Layout>
|
||||||
|
)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Head export to define metadata for the page
|
||||||
|
*
|
||||||
|
* See: https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-head/
|
||||||
|
*/
|
||||||
|
export const Head = () => <Seo title="Черное золото" description='Цель игры - наработать навык по сплочению и командообразованию руководителей развить навыки управленческих компетенций. Создать командный проект по модернизации системы бизнес процессов и стратегии развития нефтяногопредприятия. Проанализировать и подготовить предложения по оптимизации бизнес процессов и улучшению производительности труда' />
|
||||||
|
|
||||||
|
export default BlackGoldPage
|
||||||
@ -0,0 +1,57 @@
|
|||||||
|
import React, { useState } from "react"
|
||||||
|
import Layout from "../../components/layout"
|
||||||
|
import Seo from "../../components/seo"
|
||||||
|
import Hero from "../../components/Games/GamePage/Hero";
|
||||||
|
import Contact from "../../components/Contact"
|
||||||
|
import { useStaticQuery, graphql } from "gatsby"
|
||||||
|
|
||||||
|
const FutureCityPage = () => {
|
||||||
|
|
||||||
|
const [menu] = useState([
|
||||||
|
{id: 0, title: 'Описание', to: 'purposes'},
|
||||||
|
{id: 1, title: 'Навыки', to: 'direction'},
|
||||||
|
{id: 2, title: 'Контакты', to: 'contact'},
|
||||||
|
])
|
||||||
|
const image = useStaticQuery(graphql`
|
||||||
|
query {
|
||||||
|
img: file(relativePath: {eq: "games/future-city.jpg"}) {
|
||||||
|
childImageSharp {
|
||||||
|
gatsbyImageData(formats: WEBP)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}`);
|
||||||
|
return(
|
||||||
|
<Layout menu={menu}>
|
||||||
|
<Hero title="Город будущего" time='3.5-4 часа' formats='оффлайн' members='от 15 человек' img={image.img}></Hero>
|
||||||
|
<section className="py-28 max-md:py-16 max-md:px-3" id="purposes">
|
||||||
|
<div className="container mx-auto text-slate-900 text-base max-w-6xl">
|
||||||
|
<h2 className='text-3xl max-md:text-2xl mb-10 max-md:mb-8 font-semibold text-slate-800 text-center uppercase'>Описание игры</h2>
|
||||||
|
<p className='mb-8'>Участники обретают ощущение сплоченности от работы в теплой команде единомышленников. Также развивается чувство доверия - участники чувствуют доверие в ситуации достижения результатов на пути к общей цели.<br/><br/>Игроки приобретают ясное видение возможностей совместной работы в команде и мотивацию к интенсивной деятельности для достижения общей командной цели синергии.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section className="py-28 max-md:py-16 max-md:px-3 bg-[#0E0808]" id="direction">
|
||||||
|
<div className="container mx-auto text-white text-base max-w-6xl">
|
||||||
|
<h2 className='text-3xl max-md:text-2xl mb-16 max-md:mb-8 font-semibold text-white text-center uppercase'>Навыки вырабатываемые в ходе игры</h2>
|
||||||
|
<div className="flex justify-between items-center max-md:flex-col">
|
||||||
|
<ul className='mb-8 list-disc list-inside leading-normal mr-5'>
|
||||||
|
<li className="mb-1">Сплочение - участники обретают ощущение сплоченности от работы в теплой команде единомышленников</li>
|
||||||
|
<li className="mb-1">Доверие-участники чувствуют доверие в ситуации достижения результатов на пути к общей цели</li>
|
||||||
|
<li className="mb-1">Мотивация-участники приобретают ясное видение возможностей совместной работы в команде и мотивацию к интенсивной деятельности для достижения общей командной цели синергии</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<Contact id="contact" white={true}></Contact>
|
||||||
|
</Layout>
|
||||||
|
)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Head export to define metadata for the page
|
||||||
|
*
|
||||||
|
* See: https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-head/
|
||||||
|
*/
|
||||||
|
export const Head = () => <Seo title="Город будущего" description='Участники обретают ощущение сплоченности от работы в теплой команде единомышленников. Также развивается чувство доверия - участники чувствуют доверие в ситуации достижения результатов на пути к общей цели.' />
|
||||||
|
|
||||||
|
export default FutureCityPage
|
||||||