Update
This commit is contained in:
George
parent
b1e475c97e
commit
709f56a7e9
@ -3,7 +3,7 @@ import NavMenu from "./Components/NavMenu";
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div className="bg-black h-[450vh] text-white font-main">
|
||||
<div className="bg-black text-white font-main">
|
||||
<NavMenu />
|
||||
<AboutSection />
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { useRef, useState } from 'react';
|
||||
import {motion, useScroll, useMotionValueEvent, useAnimationControls, useTransform} from "framer-motion"
|
||||
import yachtImg from "../Images/yacht.jpg"
|
||||
import stock_man_img from "../Images/stock_about_placeholder.jpg"
|
||||
@ -7,139 +7,179 @@ import telegram_icon from "../Images/telegram_icon.png"
|
||||
const AboutSection = () => {
|
||||
|
||||
const { scrollYProgress } = useScroll();
|
||||
const serviceBlockRef = useRef(null);
|
||||
const {serviceScrollYProgress} = useScroll(
|
||||
{
|
||||
target: serviceBlockRef,
|
||||
offset: ["end end", "start start"],
|
||||
}
|
||||
);
|
||||
const menu_offset = useTransform(scrollYProgress, [0,1], ["-100%", "0%"]);
|
||||
const service_offset = useTransform(scrollYProgress, [0.6,0.8], ["0%", "-20%"]);
|
||||
const private_offset = useTransform(scrollYProgress, [0.6,0.8], ["0%", "30%"]);
|
||||
// const menu_offset2 = useTransform(scrollYProgress, [0,1], ["-50%", "0%"]);
|
||||
return (
|
||||
<>
|
||||
<div className='absolute inset-0'>
|
||||
<img src={yachtImg} alt="yacht" className='w-full h-full object-cover brightness-[0.2] contrast-[1.1]' />
|
||||
</div>
|
||||
<div className='absolute inset-0 flex justify-center'>
|
||||
<div className='flex flex-col justify-end w-full h-full max-w-[1920px] gap-8 p-4 pb-[40%] md:gap-16 md:p-12 lg:gap-16 lg:p-12 2xl:gap-28 2xl:p-20'>
|
||||
<div className='flex items-center md:h-[230px] lg:h-[280px]'>
|
||||
<h1 className='text-4xl md:text-6xl lg:text-7xl xl:text-8xl 2xl:text-9xl font-bold'>
|
||||
Консьерж-сервис для <span className=''>VIP</span> клиентов
|
||||
</h1>
|
||||
<div className='w-full flex justify-center'>
|
||||
<div className='w-full max-w-[1920px] flex flex-col'>
|
||||
<div className='flex justify-center w-full h-screen relative'>
|
||||
<div className='flex flex-col justify-end w-full h-full max-w-[1920px] gap-8 p-4 pb-[40%] md:gap-16 md:p-12 lg:gap-16 lg:p-12 2xl:gap-28 2xl:p-20'>
|
||||
<div className='flex items-center md:h-[230px] lg:h-[280px]'>
|
||||
<h1 className='text-4xl md:text-6xl lg:text-7xl xl:text-8xl 2xl:text-9xl font-bold'>
|
||||
Консьерж-сервис для <span className=''>VIP</span> клиентов
|
||||
</h1>
|
||||
</div>
|
||||
<div className='flex text-right self-end justify-end items-center max-w-[300px] lg:max-w-[400px]'>
|
||||
<p className='text-xl md:text-2xl lg:text-3xl'>
|
||||
Добро пожаловать в мир непревзойденной роскоши и удобства.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex text-right self-end justify-end items-center max-w-[300px] lg:max-w-[400px]'>
|
||||
<p className='text-xl md:text-2xl lg:text-3xl'>
|
||||
Добро пожаловать в мир непревзойденной роскоши и удобства.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='absolute top-[100vh] left-0 right-0 w-full flex flex-col'>
|
||||
<div className='flex w-full justify-center items-center overflow-hidden gap-20 border-b-[1px] border-gray-700'>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
</div>
|
||||
<div className='flex w-full h-[100vh] p-16'>
|
||||
<div className='w-[49%] flex h-full items-center justify-center text-center text-2xl px-[6%]'>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Placeat tempore aperiam perspiciatis et rerum perferendis harum,
|
||||
repudiandae recusandae minus, quia optio! Voluptatem animi voluptate quia! Sed rem perferendis nesciunt et?
|
||||
</div>
|
||||
<div className='h-full w-[1px] flex justify-center'>
|
||||
<div className='h-full w-full bg-gray-700 '>
|
||||
<div className='w-full flex flex-col'>
|
||||
<div className='flex w-full justify-center items-center overflow-hidden gap-20 border-b-[1px] border-gray-700'>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
<motion.h1 className='text-[11rem] whitespace-nowrap font-semibold'
|
||||
style={{translateX: menu_offset}}
|
||||
>
|
||||
Lorem ipsum
|
||||
</motion.h1>
|
||||
</div>
|
||||
<div className='flex w-full h-[100vh] p-16'>
|
||||
<div className='w-[49%] flex h-full items-center justify-center text-center text-2xl px-[6%]'>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Placeat tempore aperiam perspiciatis et rerum perferendis harum,
|
||||
repudiandae recusandae minus, quia optio! Voluptatem animi voluptate quia! Sed rem perferendis nesciunt et?
|
||||
</div>
|
||||
<div className='h-full w-[1px] flex justify-center'>
|
||||
<div className='h-full w-full bg-gray-700 '>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-[49%] px-[7%] flex flex-col gap-16'>
|
||||
<img src={stock_man_img} alt="man" className='object-cover rounded-[20%] w-full h-full' />
|
||||
<div className='w-full h-[1px] bg-gray-700 flex-shrink-0'></div>
|
||||
<div className='w-full h-[20%] flex justify-center items-start text-left'>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Placeat tempore aperiam perspiciatis et rerum perferendis harum,
|
||||
repudiandae recusandae minus, quia optio! Voluptatem animi voluptate quia! Sed rem perferendis nesciunt et?
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex h-screen w-full flex-col px-20 gap-4'>
|
||||
<div className='w-full h-[50%] flex gap-4'>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>LUXURY CARS</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-[49%] px-[7%] flex flex-col gap-16'>
|
||||
<img src={stock_man_img} alt="man" className='object-cover rounded-[20%] w-full h-[80%]' />
|
||||
<div className='w-full h-[1px] bg-gray-700 flex-shrink-0'></div>
|
||||
<div className='w-full h-[20%] flex-shrink-0 flex justify-center items-start text-left'>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Placeat tempore aperiam perspiciatis et rerum perferendis harum,
|
||||
repudiandae recusandae minus, quia optio! Voluptatem animi voluptate quia! Sed rem perferendis nesciunt et?
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>FLIGHTS</p>
|
||||
<div className='flex h-screen w-full flex-col px-20 gap-4'>
|
||||
<div className='w-full h-[50%] flex gap-4'>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>LUXURY CARS</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>FLIGHTS</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>YACHTS</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full h-[50%] flex'>
|
||||
<div className='relative w-full h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='relative w-[33%] h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
<p className='text-3xl'>YACHTS</p>
|
||||
<div className='h-[400px] w-full flex justify-between items-center px-20'>
|
||||
<p className='text-2xl w-[40%]'>
|
||||
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
|
||||
Quos fugiat aspernatur neque illo molestias reiciendis quia,
|
||||
rem tempora repellat consequuntur repellendus provident numquam ipsam dicta laudantium ab, omnis veritatis minima!
|
||||
</p>
|
||||
<div className='flex w-[300px] h-full items-center justify-center'>
|
||||
<div className='w-[100px] cursor-pointer group h-[100px] border-[2px] hover:border-gray-300 transition-all duration-300 rounded-full border-gray-500 bg-transparent flex justify-center items-center'>
|
||||
<img src={telegram_icon} alt="telegram" className='object-cover w-[40%] h-[40%] group-hover:scale-110 transition-all duration-300' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full h-[50%] flex'>
|
||||
<div className='relative w-full h-full flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
<div ref={serviceBlockRef} className='h-[90vh] w-full px-20 flex gap-12'>
|
||||
<div className='h-full w-[50%] flex flex-col justify-end items-end gap-8'>
|
||||
<motion.h2 className='text-9xl self-start' style={{translateX: private_offset}}>
|
||||
PRIVATE
|
||||
</motion.h2>
|
||||
<div className='relative w-[70%] h-[70%] flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-full w-[50%] flex flex-col justify-start gap-8'>
|
||||
<motion.h2 className='text-9xl text-right' style={{translateX: service_offset}}>
|
||||
SERVICE
|
||||
</motion.h2>
|
||||
<div className='relative w-[70%] h-[70%] flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[400px] w-full flex justify-between items-center px-20'>
|
||||
<p className='text-2xl w-[40%]'>
|
||||
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
|
||||
Quos fugiat aspernatur neque illo molestias reiciendis quia,
|
||||
rem tempora repellat consequuntur repellendus provident numquam ipsam dicta laudantium ab, omnis veritatis minima!
|
||||
</p>
|
||||
<div className='flex w-[300px] h-full items-center justify-center'>
|
||||
<div className='w-[100px] cursor-pointer group h-[100px] border-[2px] hover:border-gray-300 transition-all duration-300 rounded-full border-gray-500 bg-transparent flex justify-center items-center'>
|
||||
<img src={telegram_icon} alt="telegram" className='object-cover w-[40%] h-[40%] group-hover:scale-110 transition-all duration-300' />
|
||||
<div className='h-[400px] w-full flex justify-center items-center px-20'>
|
||||
<p className='text-2xl w-[800px] text-center'>
|
||||
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
|
||||
Quos fugiat aspernatur neque illo molestias reiciendis quia,
|
||||
rem tempora repellat consequuntur repellendus provident numquam ipsam dicta laudantium ab, omnis veritatis minima!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[100vh] w-full px-20 flex gap-12'>
|
||||
<div className='h-full w-[50%] flex flex-col justify-end items-end gap-8'>
|
||||
<h2 className='text-9xl self-start'>
|
||||
PRIVATE
|
||||
</h2>
|
||||
<div className='relative w-[70%] h-[70%] flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
<div className='w-full flex flex-col gap-8 h-[50vh] px-20 py-16'>
|
||||
<h2 className='text-8xl'>Если заинтересовались</h2>
|
||||
<div className='border-b-[1px] border-gray-700 w-[50%] h-[1px]'></div>
|
||||
<div className='w-full h-full flex'>
|
||||
<div className='flex w-[40%] h-full text-2xl'>
|
||||
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Magni maiores reiciendis asperiores dolore,
|
||||
illum doloremque placeat atque libero? Incidunt, itaque esse ea non velit exercitationem autem totam aspernatur ad. Nesciunt.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<button className='w-[250px] h-[60px] text-xl flex-shrink-0 rounded-xl border-[1px] border-gray-700 transition-all duration-300 hover:border-gray-400'>
|
||||
Давайте поговорим
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-full w-[50%] flex flex-col justify-start gap-8'>
|
||||
<h2 className='text-9xl text-right'>
|
||||
SERVICE
|
||||
</h2>
|
||||
<div className='relative w-[70%] h-[70%] flex bg-white rounded-2xl overflow-hidden group'>
|
||||
<img src={yachtImg} alt="tile" className='brightness-[0.5] group-hover:scale-110 transition-all duration-300 contrast-[1.1] absolute inset-0 w-full h-full object-cover' />
|
||||
<div className='absolute inset-0 w-full h-full flex justify-center items-center'>
|
||||
{/* <p className='text-3xl'>YACHTS</p> */}
|
||||
<footer className='w-full h-[50vh] flex p-20'>
|
||||
<div className='flex w-full h-full flex-col relative px-8'>
|
||||
<p className='text-2xl'>+9 999 999-99-99</p>
|
||||
<p className='text-2xl opacity-50 max-w-[50%]'>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis quas accusamus quis commodi</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-[1px] h-full flex-shrink-0 bg-gray-700'/>
|
||||
<div className='flex w-full h-full flex-col relative px-8'>
|
||||
<p className='text-2xl opacity-50 max-w-[65%]'>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis quas accusamus quis commodi</p>
|
||||
<button className='absolute left-8 bottom-0 w-[250px] h-[60px] text-xl flex-shrink-0 rounded-xl border-[1px] border-gray-700 transition-all duration-300 hover:border-gray-400'>
|
||||
Свяжитесь с нами
|
||||
</button>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
<div className='h-[400px] w-full flex justify-center items-center px-20 border-b-[1px] border-gray-700'>
|
||||
<p className='text-2xl w-[800px] text-center'>
|
||||
Lorem ipsum dolor sit, amet consectetur adipisicing elit.
|
||||
Quos fugiat aspernatur neque illo molestias reiciendis quia,
|
||||
rem tempora repellat consequuntur repellendus provident numquam ipsam dicta laudantium ab, omnis veritatis minima!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
||||
@ -47,7 +47,7 @@ const NavMenu = () => {
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<motion.div className={'hidden lg:flex sticky top-0 left-0 right-0 w-full px-12 h-24 transition-all duration-100 bg-transparent z-10 items-center text-xl select-none '
|
||||
<motion.div className={'hidden lg:flex fixed top-0 left-0 right-0 w-full px-12 h-24 transition-all duration-100 bg-transparent z-10 items-center text-xl select-none '
|
||||
+ (scrollPosition > 0.0 ? "justify-end":"justify-center")}
|
||||
// initial={{y:100, opacity: 0.1}}
|
||||
// animate={{y: 0, opacity:1.0}}
|
||||
@ -64,16 +64,16 @@ const NavMenu = () => {
|
||||
initial={{left: "50%", translateX: "-50%", top: "50%", translateY: "-50%"}}
|
||||
animate={animControls}
|
||||
>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100 w-[55px]'>О нас</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Сервисы</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Шаги</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Контакты</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100 flex-shrink-0'>О нас</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100 flex-shrink-0'>Сервисы</a>
|
||||
{/* <a href="##" className='hover:opacity-50 transition-all duration-100 flex-shrink-0'>Шаги</a> */}
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100 flex-shrink-0'>Контакты</a>
|
||||
</motion.nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
<motion.div className={'flex lg:hidden bg-black bg-opacity-30 justify-between sticky top-0 left-0 right-0 w-full px-12 h-16 transition-all duration-100 z-10 items-center text-xl select-none'}>
|
||||
<motion.div className={'flex lg:hidden bg-black bg-opacity-30 justify-between fixed top-0 left-0 right-0 w-full px-12 h-16 transition-all duration-100 z-10 items-center text-xl select-none'}>
|
||||
<p className='text-3xl font-bold '>SanxPay</p>
|
||||
<div id='menu-icon'>
|
||||
<button onClick={onClick}>
|
||||
@ -98,7 +98,7 @@ const NavMenu = () => {
|
||||
transition={{type: "tween", duration: 0.3}}>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100 w-[55px]'>О нас</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Сервисы</a>
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Шаги</a>
|
||||
{/* <a href="##" className='hover:opacity-50 transition-all duration-100'>Шаги</a> */}
|
||||
<a href="##" className='hover:opacity-50 transition-all duration-100'>Контакты</a>
|
||||
|
||||
</motion.nav>
|
||||
|
||||
57
src/path2.svg
Normal file
57
src/path2.svg
Normal file
@ -0,0 +1,57 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="57.947277"
|
||||
height="36.046539"
|
||||
viewBox="0 0 57.947277 36.046539"
|
||||
version="1.1"
|
||||
id="svg1"
|
||||
xml:space="preserve"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
|
||||
id="namedview1"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:document-units="px"
|
||||
inkscape:export-bgcolor="#00000000" /><defs
|
||||
id="defs1" /><g
|
||||
inkscape:groupmode="layer"
|
||||
id="layer2"
|
||||
inkscape:label="ink"
|
||||
style="fill:#000000"
|
||||
transform="translate(-60.657421,-58.177437)"><path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
d="m 71.814703,73.179754 h 32.895167 c 4.90125,0 4.5398,16.212298 -3.19499,16.212298 H 74.21133 c -1.011821,0 -1.985125,1.182328 -1.985125,2.202646 0,0.900267 0.538459,2.129278 1.384352,2.129278 h 27.616123 c 10.71535,0 11.90814,-15.082291 10.19451,-19.151164 -0.61709,-1.499533 -1.58687,-1.451243 -0.3914,-1.441237 l 5.27843,0.04418 c 0.95375,0.008 1.76747,-1.274377 1.79566,-2.227737 0.0256,-0.864389 -0.64111,-2.112514 -1.50588,-2.112514 H 72.004125 c -0.898309,0 -1.752902,1.09784 -1.812727,1.994155 -0.06341,0.949964 0.671227,2.350096 1.623305,2.350095 z"
|
||||
id="path2"
|
||||
sodipodi:nodetypes="ssssssscsssssss"
|
||||
inkscape:export-filename="path2.svg"
|
||||
inkscape:export-xdpi="96"
|
||||
inkscape:export-ydpi="96" /><path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
d="m 67.460565,79.27788 c 7.92891,0 17.365457,0 25.631998,0 0.88346,0 1.747256,1.086524 1.773472,1.969595 0.02853,0.960897 -0.837916,2.253881 -1.799236,2.253881 -7.961942,0 -17.309502,0 -25.600714,0 -0.868285,0 -1.664289,-1.113335 -1.691184,-1.981203 -0.02896,-0.934624 0.750591,-2.242273 1.685664,-2.242273 z"
|
||||
id="path3"
|
||||
sodipodi:nodetypes="sssssss" /><path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
d="m 78.350083,66.320667 c 5.088697,-3.158869 14.711284,-6.44496 23.459117,0 h 5.00077 C 101.63161,60.336258 96.977023,59.002455 92.556677,58.688232 89.517894,58.649 81.875133,58.501976 76.359506,63.382385 c -0.486453,0.596486 -0.620177,1.667923 -0.183536,2.301781 0.428374,0.621858 1.273033,0.83391 2.174113,0.636501 z"
|
||||
id="path4"
|
||||
sodipodi:nodetypes="ccccccc" /><ellipse
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path5"
|
||||
cx="62.932747"
|
||||
cy="70.910309"
|
||||
rx="1.7753251"
|
||||
ry="1.6776105" /><ellipse
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
|
||||
id="path5-6"
|
||||
cx="62.979584"
|
||||
cy="91.659416"
|
||||
rx="1.7753251"
|
||||
ry="1.6776105" /></g></svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
Loading…
x
Reference in New Issue
Block a user