Skip to content

Commit

Permalink
images non selectable and draggable now, closes #16
Browse files Browse the repository at this point in the history
  • Loading branch information
Yash-Ray committed Oct 13, 2021
1 parent 9441ed8 commit e13ae1c
Show file tree
Hide file tree
Showing 14 changed files with 22,094 additions and 301 deletions.
21,762 changes: 21,718 additions & 44 deletions package-lock.json

Large diffs are not rendered by default.

15 changes: 11 additions & 4 deletions src/components/Caroussel/Carousel.style.scss
@@ -1,5 +1,11 @@
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500&display=swap");

* {
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
.speaker-list {
display: flex;
flex-direction: row;
Expand All @@ -8,7 +14,9 @@
width: 100%;
}

.speaker1, .speaker2, .speaker3 {
.speaker1,
.speaker2,
.speaker3 {
padding: 7.5px;
margin: 7.5px;
display: flex;
Expand Down Expand Up @@ -46,7 +54,6 @@
);
}


@media all and(max-width:1130px) {
.speaker-img {
height: 20vw;
Expand All @@ -62,4 +69,4 @@
height: 30vw;
width: 30vw;
}
}
}
8 changes: 5 additions & 3 deletions src/components/CoverSpeaker/CoverSpeaker.js
Expand Up @@ -6,10 +6,12 @@ import mobImg from "../../images/Heading_Speakers_550.png";
export const CoverSpeaker = (props) => {
return (
<div className="heading md:h-56 min-h-64 min-w-full flex flex-row justify-center items-center border-0 p-0 m-0">
<img className="img1" src={logo} alt="frustration" />
<img draggable="false" className="img1" src={logo} alt="frustration" />
<div className="heading-content">{props.title}</div>
<div className='mobile-heading'><img src={mobImg} alt='mob-head' /></div>
<img className="img2" src={logo} alt="whyyyyyyyy" />
<div className="mobile-heading">
<img draggable="false" src={mobImg} alt="mob-head" />
</div>
<img draggable="false" className="img2" src={logo} alt="whyyyyyyyy" />
</div>
);
};
1 change: 1 addition & 0 deletions src/components/Events/eventscarousel.js
Expand Up @@ -134,6 +134,7 @@ class Item extends React.Component {
{this.state.title}
</h1>
<img
draggable="false"
className="eventimg"
src={require(`../../images/${this.state.img}.png`).default}
alt="noo"
Expand Down
7 changes: 6 additions & 1 deletion src/components/landingCard.js
Expand Up @@ -5,7 +5,12 @@ const landingCard = () => {
<div className="grad w-60 h-40 my-4 mx-2 card-style flex flex-none md:my-2 lg:my-0.5">
<div className="inner">
<div className="flex flex-none items-center ">
<img src={comp} className="w-24 h-24 pr-3" alt="comp" />
<img
draggable="false"
src={comp}
className="w-24 h-24 pr-3"
alt="comp"
/>
<div className="text-justify">
<p className="mb-2 mr-auto ml-auto text-lg pb-1 text-black">
Hackbattle
Expand Down
3 changes: 2 additions & 1 deletion src/components/navbar.js
Expand Up @@ -18,11 +18,12 @@ const Navbar = (props) => {
className=" top-0 w-full px-3 py-9 fixed z-50 duration-200 flex items-center justify-between flex-wrap"
style={{
boxShadow: visible ? "0px 2px 2px #aaa" : "",
backgroundColor: visible ? "#FFF":"",
backgroundColor: visible ? "#FFF" : "",
// position: visible ? "fixed" : "fixed",
}}
>
<img
draggable="false"
src={arcs}
className="fixed w-auto h-11 flex items-center"
alt="arcs"
Expand Down
8 changes: 4 additions & 4 deletions src/components/rectangle.js
Expand Up @@ -3,10 +3,10 @@ import React from "react";
const Rectangle = () => {
return (
<div>
<div className="fixed top-20 lg:top-36 w-10 h-10 bg-pink"></div>
<div className="fixed right-0 top-24 lg:top-36 w-10 h-10 bg-pink"></div>
<div className="fixed right-5 bottom-0 w-8 h-14 bg-pink"></div>
<div className="fixed left-5 bottom-0 w-8 h-14 bg-pink"></div>
<div className="select-none fixed top-20 lg:top-36 w-10 h-10 bg-pink"></div>
<div className="fixed select-none right-0 top-24 lg:top-36 w-10 h-10 bg-pink"></div>
<div className="select-none fixed right-5 bottom-0 w-8 h-14 bg-pink"></div>
<div className="select-none fixed left-5 bottom-0 w-8 h-14 bg-pink"></div>
</div>
);
};
Expand Down
181 changes: 113 additions & 68 deletions src/pages/contact.js
@@ -1,74 +1,119 @@

import * as React from "react"
import * as React from "react";
import { useState } from "react";
import {FaEnvelope} from "react-icons/fa"
import
{ImLocation,
ImPhoneHangUp
}
from "react-icons/im"
import { FaEnvelope } from "react-icons/fa";
import { ImLocation, ImPhoneHangUp } from "react-icons/im";
import Navbar from "./../components/navbar";
import Rectangles from "./../components/rectangle";
import "../Events.scss"
import border from '../images/border.png'
import "../Events.scss";
import border from "../images/border.png";
const ContactPage = () => {
const [isExpanded, toggleExpansion] = useState(false);

return (
<div>
<Navbar isExpanded={isExpanded} toggleExpansion={toggleExpansion} />
<Rectangles />

<div className="container lg:mt-14 mt-5 mx-auto">
<center>
<div className="w-full flex justify-center">
<div className="flex">
<img className="object-scale-down w-44 sm:w-52 md:w-64 lg:w-80 xl:w-96 h-24" src={border} alt="lines"/>
<p style={{fontFamily:"Poppins"}} className="text-center text-2xl absolute sm:text-5xl md:text-2xl lg:text-3xl ml-8 mt-4 md:ml-16 mb-0 lg:ml-24 xl:ml-32 ">
Contact Us
</p>
</div>
</div>


</center>
<br></br>

<div className="grid grid-cols-1 md:grid-cols-2 md:mb-4 lg:px-40 md:px-10 lg:mt-14" >
<div className="xl:px-20 md:px-2 md:order-first order-last pr-0 pl-20 md:pl-10 lg:mb-8 -ml-4 contactbox">

<p className="text-sm lg:text-xl "><span className="env "><ImLocation style={{display:"inline",fontSize:"1.5rem",fill:"white"}}/></span> &nbsp; VIT Vellore</p>
<br></br><br></br>
<p className="text-sm lg:text-xl "><span className="env "><FaEnvelope style={{display:"inline",fontSize:"1.5rem",fill:"white"}}/></span> &nbsp; arcs.register@gmail.com</p>
<br></br><br></br>
<p className="text-sm lg:text-xl"><span className="env"><ImPhoneHangUp style={{display:"inline",fontSize:"1.5rem",fill:"white"}}/></span>&nbsp; 8160XXXXXX</p>

</div>

<div className="place-self-center ">
<form>
<input className=" flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm" type="name" placeholder="NAME"></input>
<br>
</br>

<input className="flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm" type="email" placeholder="EMAIL"></input>
<br></br>

<textarea className=" flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm" placeholder="MESSAGE" rows="4"></textarea>
const [isExpanded, toggleExpansion] = useState(false);

return (
<div>
<Navbar isExpanded={isExpanded} toggleExpansion={toggleExpansion} />
<Rectangles />

<div className="container lg:mt-14 mt-5 mx-auto">
<center>
<div className="w-full flex justify-center">
<div className="flex">
<img
draggable="false"
className="object-scale-down w-44 sm:w-52 md:w-64 lg:w-80 xl:w-96 h-24"
src={border}
alt="lines"
/>
<p
style={{ fontFamily: "Poppins" }}
className="text-center text-2xl absolute sm:text-5xl md:text-2xl lg:text-3xl ml-8 mt-4 md:ml-16 mb-0 lg:ml-24 xl:ml-32 "
>
Contact Us
</p>
</div>
</div>
</center>
<br></br>

<button type="button" className="submitButton relative leading-3 mx-0 my-0 h-8 md:w-96 rounded-3xl text-center w-72" >SUBMIT</button>
</form>
</div>

</div>


</div>

<div className="grid grid-cols-1 md:grid-cols-2 md:mb-4 lg:px-40 md:px-10 lg:mt-14">
<div className="xl:px-20 md:px-2 md:order-first order-last pr-0 pl-20 md:pl-10 lg:mb-8 -ml-4 contactbox">
<p className="text-sm lg:text-xl ">
<span className="env ">
<ImLocation
style={{
display: "inline",
fontSize: "1.5rem",
fill: "white",
}}
/>
</span>{" "}
&nbsp; VIT Vellore
</p>
<br></br>
<br></br>
<p className="text-sm lg:text-xl ">
<span className="env ">
<FaEnvelope
style={{
display: "inline",
fontSize: "1.5rem",
fill: "white",
}}
/>
</span>{" "}
&nbsp; arcs.register@gmail.com
</p>
<br></br>
<br></br>
<p className="text-sm lg:text-xl">
<span className="env">
<ImPhoneHangUp
style={{
display: "inline",
fontSize: "1.5rem",
fill: "white",
}}
/>
</span>
&nbsp; 8160XXXXXX
</p>
</div>

<div className="place-self-center ">
<form>
<input
className=" flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm"
type="name"
placeholder="NAME"
></input>
<br></br>

<input
className="flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm"
type="email"
placeholder="EMAIL"
></input>
<br></br>

<textarea
className=" flex justify-center bginput bg-gray-100 rounded p-3 md:p-4 md:w-96 md:mx-auto lg:leading-4 text-gray-400 w-72 leading-3 lg:text-l text-sm"
placeholder="MESSAGE"
rows="4"
></textarea>
<br></br>

<button
type="button"
className="submitButton relative leading-3 mx-0 my-0 h-8 md:w-96 rounded-3xl text-center w-72"
>
SUBMIT
</button>
</form>
</div>
</div>

)
}
export default ContactPage
</div>
</div>
);
};

export default ContactPage;

0 comments on commit e13ae1c

Please sign in to comment.