diff --git a/.gitignore b/.gitignore index 6d7856a..3d9db84 100644 --- a/.gitignore +++ b/.gitignore @@ -34,3 +34,4 @@ __pycache__ .idea .coverage .netlify +-idea/ diff --git a/CITATION.md b/CITATION.md new file mode 100644 index 0000000..0112160 --- /dev/null +++ b/CITATION.md @@ -0,0 +1 @@ +[![DOI](https://zenodo.org/badge/432041373.svg)](https://zenodo.org/badge/latestdoi/432041373) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 5580bbe..6070b88 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -27,6 +27,8 @@ Explain the problem and include additional details to help maintainers reproduce * Provide specific examples to demonstrate the steps. Include links to files or GitHub projects, or copy/pasteable snippets, which you use in those examples. * If you encounter a bug in a specific branch, please note the branch name. +Use the [Bug_Report Template](https://github.com/Ashnayak/feature-hunt/blob/main/issue_templates/Bug_Report.md) while creating the new bug request. + **Do NOT report a bug on a specific file, line of code, or test case if the file, code, or test case in question is not present anywhere in the repository.** ## Suggesting Enhancements @@ -44,7 +46,7 @@ Enhancement suggestions are tracked as Github issues. After you have determined * Explain why this enhancement would be useful to most users and is not something that can or should be implemented as a community package. * List some other text editors or applications where this enhancement exists. * Specify the name and version of the OS you're using. - +Use the [Feature Request Template](https://github.com/Ashnayak/feature-hunt/blob/main/issue_templates/Feature_Request.md) while creating the new feature request. Alternatively, you can open a new discussion here: https://github.com/CSC510-Group-25/feature-hunt/discussions/categories/ideas diff --git a/README.md b/README.md index 79b8779..801a1a5 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@

[![Codacy Badge](https://api.codacy.com/project/badge/Grade/bb78c7431a71487595f3031af06dac4c)](https://app.codacy.com/gh/CSC510-Group-25/feature-hunt?utm_source=github.com&utm_medium=referral&utm_content=CSC510-Group-25/feature-hunt&utm_campaign=Badge_Grade_Settings) -[![DOI](https://zenodo.org/badge/413987683.svg)](https://zenodo.org/badge/latestdoi/413987683) +[![DOI](https://zenodo.org/badge/432041373.svg)](https://zenodo.org/badge/latestdoi/432041373) [![GitHub license](https://img.shields.io/github/license/shahrk/feature-hunt)](https://github.com/shahrk/feature-hunt/blob/main/LICENSE) [![made-with-javascript](https://img.shields.io/badge/Made%20with-JavaScript-blue)](https://www.javascript.com) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) @@ -197,6 +197,9 @@ This app has been deployed using Netlify and Heroku. Check it out [here!](https: You can now run and test the project locally and in deployments. More info about our deplyments and switching between production and devlopment can be found in our [Wiki](https://github.com/CSC510-Group-25/feature-hunt/wiki/Deployment:-Heroku-and-Netlify) +## Contributions to the Project +Please refer to the [Contributing.md](https://github.com/Ashnayak/feature-hunt/blob/main/CONTRIBUTING.md) if you want to contrbute to the Feature Hunt source code. Follow all the guidelines mentioned and raise a pull request for the developers to review before the code goes to the main source code. + ## Future Scope We believe in the ability to add new features in any project (including our own). @@ -206,7 +209,7 @@ We believe in the ability to add new features in any project (including our own) - + @@ -215,11 +218,20 @@ We believe in the ability to add new features in any project (including our own) - + + + + + + + + + +
Group 27 Phase 1
Raj Shah
Nirav Patel
Parth Kanakiya
Group 25 Phase 2
Emily Tracey
Peeyush Taneja
Jonathan Nguyen
Leila Moran
Shraddha Mishra
Phase 3
Suraj Devatha
Sneha Aradhey

Ashwini Nayak

Himanshuu Gupta

Shreyansh Prajapati
diff --git a/backend/app.py b/backend/app.py index 92d54e4..0a96e76 100644 --- a/backend/app.py +++ b/backend/app.py @@ -13,5 +13,5 @@ app.secret_key = "testing" CORS(app) -#if __name__ == "__main__": -# app.run(debug=True, port=environ.get("PORT", 5000) , host='0.0.0.0') +if __name__ == "__main__": + app.run(debug=True, port=environ.get("PORT", 5000) , host='0.0.0.0') diff --git a/backend/auth_controller.py b/backend/auth_controller.py index 606b7ec..3c09a83 100644 --- a/backend/auth_controller.py +++ b/backend/auth_controller.py @@ -43,6 +43,7 @@ def signup(): return message redirect_url = 'https://damp-citadel-25681.herokuapp.com/' +# redirect_url = 'http://localhost:5000/' ################################################################################# ## Function: logged_in @@ -136,4 +137,4 @@ def logout(): session.pop("email", None) return "Logout Successful" else: - return "Logout Successful" + return "Logout Successful" \ No newline at end of file diff --git a/backend/product_controller.py b/backend/product_controller.py index bf5ae57..43e4302 100644 --- a/backend/product_controller.py +++ b/backend/product_controller.py @@ -23,12 +23,14 @@ def add_product(): product_description = request.form.get("productDescription") image_url = request.form.get("imageUrl") email = request.form.get("email") + last_date = request.form.get("lastDate") tags = request.form.get("tags").split(' ') feature_dict = {'id': 2, 'text': 'feature-1', 'votes': 1, 'timestamp': '1234567', 'tags': ['tag1']} product_input = {'name': product_name, 'description': product_description, - 'image_url': image_url, 'users': [email], 'tags': tags, 'features': feature_dict} + 'image_url': image_url, 'users': [email], 'tags': tags, 'features': feature_dict, + 'last_date': last_date} product_records.insert_one(product_input) @@ -51,9 +53,9 @@ def add_product(): # result = product_records.find_one_and_update( # {"project_name": productName}, {"$push": {"features": data}} # ) -# + # return jsonify(success=True) -# + # elif request.method == 'GET': # result = mongo.db.products.find({"name": productname}, {"features": 1}) # return dumps(result) diff --git a/backend/products.py b/backend/products.py index c3008f9..1f31010 100644 --- a/backend/products.py +++ b/backend/products.py @@ -5,17 +5,20 @@ this file. If not, please write to: featurehuntteam@gmail.com """ -# pylint: disable=wrong-import-position,poiackend-lontless-string-statement,undefined-variable,line-too-long - -import os -from sys import stderr -from flask import request, jsonify +import os, io +from flask import request, jsonify, Response from flask import json from app import app - +import pandas as pd from bson.json_util import dumps from bson.objectid import ObjectId from db_init import product_records +from email.mime.multipart import MIMEMultipart +from email.mime.text import MIMEText +import smtplib +from datetime import date +from email import encoders +from email.mime.base import MIMEBase ''' Function: products @@ -40,7 +43,26 @@ def products(): return Response(response=json.dumps({"Error": "Please provide all necessary input"}), status=400, mimetype='application/json') - return jsonify({'ok': True, 'message': 'Product added successfully'}), 200 + try: + product_name = request.form.get("productName") + product_description = request.form.get("productDescription") + image_url = request.form.get("imageUrl") + email = request.form.get("email") + last_date = request.form.get("lastDate") + tags = request.form.get("tags").split(' ') + + feature_dict = {'id': 2, 'text': 'feature-1', 'votes': 1, 'timestamp': '1234567', 'tags': ['tag1']} + + product_input = {'name': product_name, 'description': product_description, 'votes': 1, + 'image_url': image_url, 'users': [email], 'tags': tags, 'features': feature_dict, + 'last_date': last_date} + + + product_records.insert_one(product_input) + + return jsonify({'ok': True, 'message': 'Product added successfully'}), 200 + except: + return jsonify(success=False) if request.method == 'DELETE': if data is None or data == {}: @@ -63,23 +85,26 @@ def products(): else: return jsonify({'ok': False, 'message': 'Bad request parameters!'}), 400 - -''' -Function: get_feature -Description: Get the list of all features for given product name -Inputs: - - productName: Name of the product -Outputs: - - results: List of features that are available in that product -''' - - -@app.route('//getFeature', methods=['GET', 'POST']) -def get_feature(product_name): +@app.route('/', methods=['GET', 'POST']) +def get_feature(productname): + ''' see above ''' if request.method == 'GET': - data = product_records.find({"name": product_name}) - return dumps(data) - + data = product_records.find({"name": productname}) + if request.method == 'POST': + data = request.json + data['_id'] = ObjectId() + print(data) + if data is None or data == {}: + return Response(response=json.dumps({"Error": + "Please provide connection information"}), + status=400, + mimetype='application/json') + result = product_records.find_one_and_update( + {"project_name": productname}, {"$push": {"features": data}} + ) + + return jsonify(success=True) + return dumps(data) ''' Function: features @@ -92,7 +117,7 @@ def get_feature(product_name): @app.route('//features', methods=['GET', 'POST']) -def features(product_name): +def features(productname): result = '' if request.method == 'POST': data = request.form.get('features') @@ -102,8 +127,93 @@ def features(product_name): return Response(response=json.dumps({"Error": "Please provide connection information"}), status=400, mimetype='application/json') - result = product_records.find_one_and_update({"name": productname}, {"$set": {"features": data}}) + result = product_records.find_one_and_update({"name": productname}, {"$set": {"features": data}}, + {'$upsert': 'true'}) elif request.method == 'GET': - result = product_records.find({"name": product_name}, {"features": 1}) + result = product_records.find({"name": productname}, {"features": 1}) return dumps(result) + + +@app.route('//email', methods=['GET']) +def email(productname): + today = date.today() + recipients = ['svaradhe@ncsu.edu', 'hgupta6@ncsu.edu', 'ashwininayak1212@gmail.com', 'surajdm123@gmail.com', 'saprajap@ncsu.edu'] + today = today.strftime("%d-%b-%Y") + print("Checking for Internet Connection\n") + username = os.getenv('USERNAME') + password = os.getenv('PASSWORD') + server = smtplib.SMTP_SSL("smtp.gmail.com") + server.login(username,password) + emailfrom = username + emailto =", ".join(recipients) + + msg = MIMEMultipart('alternative') + msg["From"] = emailfrom + msg["To"] = emailto + msg["Subject"] = "Product analysis "+today + + result = product_records.find({"name": productname}, {"features": 1}) + result = pd.json_normalize(list(result)) + result = result.explode('features').reset_index(drop=True) + features = pd.DataFrame(result['features'].tolist()) + + excel_file = pd.concat([result.drop(['features'], axis=1), result['features'].apply(pd.Series)], axis=1) + excelfilename="Product_feature_details "+today+".xlsx" + excel_file.to_excel(excelfilename) + part2 = MIMEBase('application', "octet-stream") + part2.set_payload(open("Product_feature_details "+today+".xlsx", "rb").read()) + encoders.encode_base64(part2) + part2.add_header('Content-Disposition', "attachment", filename="Product_feature_details "+today+".xlsx") + msg.attach(part2) + + features.rename(columns={'text': 'FeatureName', 'votes': 'Votes'}, inplace=True) + result = features[['FeatureName', 'Votes']].sort_values(by='Votes', ascending=False)[:5] + import io + str_io = io.StringIO() + result.to_html(buf=str_io, classes='table table-striped', index=False) + html_str1 = str_io.getvalue() + email_content = """ + + test + + + + +

+ + >>>>>>>>>>AUTOGENERATED MAIL<<<<<<<<<<>>>>>>>>>><<<<<<<<<< +
+
+ + Hi All, +
+ +
+ + """ + html_str1 + """ + +
+ """ + HTML_BODY = MIMEText(email_content, 'html') + msg.attach(HTML_BODY) + server = smtplib.SMTP_SSL("smtp.gmail.com", 465) + server.login(username, password) + print("Sending...") + server.sendmail(emailfrom, recipients, msg.as_string()) + server.quit() + print("Sent") + return 'Email Sent!' diff --git a/docs/ImprovementDoc.md b/docs/ImprovementDoc.md new file mode 100644 index 0000000..a1abf65 --- /dev/null +++ b/docs/ImprovementDoc.md @@ -0,0 +1,39 @@ +## Phase 3 Improvements +Phase 3 saw many changes in the develpoment of feature-hunt. In this document we provide a detailed overview of all the changes implemented by our team during Phase 3. + +## Front End +The team worked meticulously to improve the user interface. While revamping the existing UI, we took the liberty to add a couple more features: +- The Phase 2 version did not have a login page +- The Phase 2 version did not have a signup page. + +*Improvements:* +1) Created a SignUp page to enable new users to create an account to use feature-hunt. +2) Designed a login page that acts as the portal to sign in once a user has an account (ONLY when a user has an account). +3) Added Collaborators to the project form. This helps us send email notifications to the collaborators regarding updates related to their project features. +4) Improved existing UI for displaying projects and features. +5) Made the user experience more insightful by creating a description feature for each project and feature. A new user can intuitively understand what each project or feature does. +6) Fixed the Search Bar functionality. Users can now use the search bar to look up Projects easily. + +## Back End +With respect to backend, we decided to use the existing tech stack and improve upon it. We went ahead with using Docker and MongoDB as the previous team had done. + +*Improvements:* +1) Redesigned the schema for feature-hunt +2) We introduced an email alerting mechanism that notified users with triggered email alerts. The notification is triggered upon the completion of a project close discussion date and informs the user about the five most popular features. There is also an attachment providing more information on all the features discussed as well. + +## Comparing Results of Phase 2 and Phase 3 + + +Phase 2 | Phase 3 +:-------------------------:|:-------------------------: +No Signup page | New Signup page
+No Login page | New Login page
+No Search Functionality | Implemented Search Functionality
+Basic Form | Improved Form with Tags and Contributors
+No Project Description | Added Project Description
+ +## Tools used +The original team used React, JavaScript, Python3, Flask, MongoDB, HTML and CSS. In addition to these, we have used Bootstrap. + +## Conclusion of Phase 3 +Working on Phase 3 was an eye-opening simulation of how Software Engineering project development occurs in the real world. Countless brainstorming sessions to whip up a myriad of creative ideas which we brought to fruition, in short, the Phase 3 sojourn was a memorable learning experience. We would like to thank Dr. Timothy Menzies for helping us understand the process of building a good Software Engineering project. We would also like to thank the teaching assistants Xiao Ling, Andre Lustosa, Kewen Peng, Weichen Shi for their support throughout the project. We are grateful for the opportunity to work with our friends and colleagues at NCSU - shout out to the developers of Phase 1 and Phase 2 for their contribution to this amazing project! diff --git a/docs/Phase3_docs/ImprovementDoc.md b/docs/Phase3_docs/ImprovementDoc.md new file mode 100644 index 0000000..2af041c --- /dev/null +++ b/docs/Phase3_docs/ImprovementDoc.md @@ -0,0 +1,39 @@ +## Phase 3 Improvements +Phase 3 saw many changes in the develpoment of feature-hunt. In this document we provide a detailed overview of all the changes implemented by our team during Phase 3. + +## Front End +The team worked meticulously to improve the user interface. While revamping the existing UI, we took the liberty to add a couple more features: +- The Phase 2 version did not have a login page +- The Phase 2 version did not have a signup page. + +*Improvements:* +1) Created a SignUp page to enable new users to create an account to use feature-hunt. +2) Designed a login page that acts as the portal to sign in once a user has an account (ONLY when a user has an account). +3) Added Collaborators to the project form. This helps us send email notifications to the collaborators regarding updates related to their project features. +4) Improved existing UI for displaying projects and features. +5) Made the user experience more insightful by creating a description feature for each project and feature. A new user can intuitively understand what each project or feature does. +6) Fixed the Search Bar functionality. Users can now use the search bar to look up Projects easily. + +## Back End +With respect to backend, we decided to use the existing tech stack and improve upon it. We went ahead with using Docker and MongoDB as the previous team had done. + +*Improvements:* +1) Redesigned the schema for feature-hunt +2) We introduced an email alerting mechanism that notified users with triggered email alerts. The notification is triggered upon the completion of a project close discussion date and informs the user about the five most popular features. There is also an attachment providing more information on all the features discussed as well. + +## Comparing Results of Phase 2 and Phase 3 + + +Phase 2 | Phase 3 +:-------------------------:|:-------------------------: +No Signup page | New Signup page
+No Login page | New Login page
+No Search Functionality | Implemented Search Functionality
+Basic Form | Improved Form with Tags and Contributors
+No Project Description | Added Project Description
+ +## Tools used +The original team used React, JavaScript, Python3, Flask, MongoDB, HTML and CSS. In addition to this tech stack, we used Bootstrap for creating the login and sign up page. + +## Conclusion of Phase 3 +Working on Phase 3 was an eye-opening simulation of how Software Engineering project development occurs in the real world. Countless brainstorming sessions to whip up a myriad of creative ideas which we brought to fruition, in short, the Phase 3 sojourn was a memorable learning experience. We would like to thank Dr. Timothy Menzies for helping us understand the process of building a good Software Engineering project. We would also like to thank the teaching assistants Xiao Ling, Andre Lustosa, Kewen Peng, Weichen Shi for their support throughout the project. We are grateful for the opportunity to work with our friends and colleagues at NCSU - shout out to the developers of Phase 1 and Phase 2 for their contribution to this amazing project! diff --git a/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM (1).jpeg b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM (1).jpeg new file mode 100644 index 0000000..9643e83 Binary files /dev/null and b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM (1).jpeg differ diff --git a/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM.jpeg b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM.jpeg new file mode 100644 index 0000000..17640d1 Binary files /dev/null and b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.20 PM.jpeg differ diff --git a/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (1).jpeg b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (1).jpeg new file mode 100644 index 0000000..40be651 Binary files /dev/null and b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (1).jpeg differ diff --git a/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (2).jpeg b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (2).jpeg new file mode 100644 index 0000000..200595c Binary files /dev/null and b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM (2).jpeg differ diff --git a/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM.jpeg b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM.jpeg new file mode 100644 index 0000000..a83d1f3 Binary files /dev/null and b/docs/Phase3_docs/screenshots/WhatsApp Image 2021-11-29 at 12.12.21 PM.jpeg differ diff --git a/issue_templates/Bug_Report.md b/issue_templates/Bug_Report.md new file mode 100644 index 0000000..cbca49d --- /dev/null +++ b/issue_templates/Bug_Report.md @@ -0,0 +1,30 @@ +# BugReport.md + +| Name | About | +| ------------------- |:---------------------------------------:| +| Bug Report | Report a bug in the code environment | + + +## Summary +Description of the issue + +## Steps to reproduce + +1. +2. +3. + +**Expected behavior:** + + +**Actual behavior:** + + +**Reproduces how often:** + + +## Version Details +Please include the tools/languages and the OS version you're running. + +## Additional Information +Any additional information, configuration that might be necessary to reproduce the issue. diff --git a/issue_templates/Feature_Request.md b/issue_templates/Feature_Request.md new file mode 100644 index 0000000..56c808c --- /dev/null +++ b/issue_templates/Feature_Request.md @@ -0,0 +1,17 @@ +# FeatureRequest.md + +| Name | About | +| ------------------- |:---------------------------------------:| +| Feature Request | Suggest an new feature for this project | + + +## Summary +Summary of the feature + +## Motivation +What is the motivation behind the project? +What usecases does it support? +What is the expected outcome? + +## Additional context +Add any other context or screenshots about the feature request here. diff --git a/src/Components/Feature.js b/src/Components/Feature.js index b8fc44b..4bed3ef 100644 --- a/src/Components/Feature.js +++ b/src/Components/Feature.js @@ -57,6 +57,10 @@ const Feature = ({ features, index, setFeatures, editable }) => { {capitalizeFirstLetter(features[index].text)} +
+ + {capitalizeFirstLetter(features[index].desc || 'No Description Provided')} +

{features[index]['tags'].map(tag => diff --git a/src/Components/Product.js b/src/Components/Product.js index 46ed45b..b2d0fa7 100644 --- a/src/Components/Product.js +++ b/src/Components/Product.js @@ -3,6 +3,7 @@ import { useParams } from 'react-router-dom'; import { ReactSession } from 'react-client-session'; import Feature from './Feature'; import Service from '../Service'; +import { Button } from '@mui/material'; // // Component: Product @@ -16,10 +17,14 @@ import Service from '../Service'; const Product = ({query}) => { const { id } = useParams(); const [newFeature, setNewFeature] = useState(''); + const [newDesc, setNewDesc] = useState(''); const [sortBy, setSortBy] = useState('votes'); const handleNewFeatureChange = (event) => { setNewFeature(event.target.value); }; + const handleNewFeatureDesc = (event) => { + setNewDesc(event.target.value); + }; const addFeature = (event) => { event.preventDefault(); if (newFeature === '') @@ -32,6 +37,7 @@ const Product = ({query}) => { upVoted: true, timestamp: Date.now(), tags: ['enhancement'], + desc: newDesc }; setFeatures(features.concat(addedFeature)); setNewFeature(''); @@ -73,6 +79,15 @@ const Product = ({query}) => { onChange={handleNewFeatureChange} placeholder="Enter a feature that you'd love to see"> + + +
{features.map((f, index) => { f['index'] = index; return f; }).filter(f => query ? f.tags.includes(query.toLowerCase()) || f.text.toLowerCase().includes(query.toLowerCase()) : true).sort((f1, f2) => f2[sortBy] - f1[sortBy]).map( diff --git a/src/Components/ProjectForm.js b/src/Components/ProjectForm.js index 54afbec..9d7f584 100644 --- a/src/Components/ProjectForm.js +++ b/src/Components/ProjectForm.js @@ -3,6 +3,8 @@ import { ReactSession } from "react-client-session"; import styled from "styled-components"; import TextField from "@mui/material/TextField"; import Service from "../Service"; +import {useHistory} from "react-router-dom"; + const Styles = styled.div` background: #218888; @@ -77,7 +79,15 @@ function ProjectForm() { const [message, setMessage] = React.useState(""); const [user, setUser] = React.useState([""]); const [tags, setTags] = React.useState(""); - + const [contributors, setContributors] = React.useState(""); + const [date, setDate] = React.useState(""); + const history = useHistory(); + +/* + const goTo = (page) => () => { + history.push('/' + page); + }; +*/ React.useEffect(() => { setUser(ReactSession.get("username")); }, []); @@ -98,8 +108,19 @@ function ProjectForm() { setTags(e.target.value); } + const handleContributorsChange = (e) => { + setContributors(e.target.value); + } + + const handleDateChange = (e) => { + setDate(e.target.value); + } + + const handleSubmit = (event) => { const form = new FormData(); + + form.append("productName", name); form.append("productDescription", description); form.append("imageUrl", imageURL); @@ -109,12 +130,17 @@ function ProjectForm() { .then((data) => {setMessage(data.message); console.log(data.code); - if (data.code > 200) { + + /* if (data.code > 200) { console.log(message) } + else{ + history.push('/'); + }*/ }).catch(function(err){ setMessage("There was a problem submitting your product. Please try again later.") }); + history.push('/dashboard'); } return ( @@ -124,7 +150,7 @@ function ProjectForm() { -
+

PROJECT FORM

- + + + + + diff --git a/src/Components/login.html b/src/Components/login.html new file mode 100644 index 0000000..4f0f2d8 --- /dev/null +++ b/src/Components/login.html @@ -0,0 +1,84 @@ + + + + + + + Feature Hunt + + + + + + + + + +
+ +
+
+ +
+

Feature Hunt


 + Describe. Submit. Behold. +
+
+
+ +
+ Suggest features
for your favorite Apps! + Let's get creative! +
+
+
+
+
+ + +
+
+
+ + + \ No newline at end of file diff --git a/src/Service.js b/src/Service.js index c5e315a..3936d43 100644 --- a/src/Service.js +++ b/src/Service.js @@ -1,5 +1,5 @@ const baseUrl = "http://localhost:5000/"; - //const baseUrl = "https://damp-citadel-25681.herokuapp.com/" +//const baseUrl = "https://damp-citadel-25681.herokuapp.com/" // const requestOptionsBuilder = (method, body, headers) => { // let options = { diff --git a/src/images/backImg.jpg b/src/images/backImg.jpg new file mode 100644 index 0000000..2f8e723 Binary files /dev/null and b/src/images/backImg.jpg differ diff --git a/src/images/frontImg.jpg b/src/images/frontImg.jpg new file mode 100644 index 0000000..61fb95a Binary files /dev/null and b/src/images/frontImg.jpg differ diff --git a/src/index.css b/src/index.css index 5923318..08a9e8e 100644 --- a/src/index.css +++ b/src/index.css @@ -54,6 +54,7 @@ code { border : 0px solid; height : 2rem; padding : 0.3rem 0.5rem 0.3rem 0.5rem; + margin-bottom: 10px; } .feature .feature-container { diff --git a/src/styles/login.css b/src/styles/login.css new file mode 100644 index 0000000..4280ab2 --- /dev/null +++ b/src/styles/login.css @@ -0,0 +1,218 @@ +/* Google Font Link */ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap'); +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: "Poppins" , sans-serif; +} +body{ + min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background: #354457; + padding: 30px; +} +.container{ + position: relative; + max-width: 850px; + width: 100%; + background: #fff; + padding: 40px 30px; + box-shadow: 0 5px 10px rgba(0,0,0,0.2); + perspective: 2700px; +} +.container .cover{ + position: absolute; + top: 0; + left: 50%; + height: 100%; + width: 50%; + z-index: 98; + transition: all 1s ease; + transform-origin: left; + transform-style: preserve-3d; +} +.container .cover::before{ + content: ''; + position: absolute; + height: 100%; + width: 100%; + background: #354457; + opacity: 0.5; + z-index: 100; +} +.container .cover::after{ + content: ''; + position: absolute; + height: 100%; + width: 100%; + background: #354457; + opacity: 0.5; + z-index: 100; + transform: rotateY(180deg); +} +.container #flip:checked ~ .cover{ + transform: rotateY(-180deg); +} +.container .cover img{ + position: absolute; + height: 100%; + width: 100%; + object-fit: cover; + z-index: 12; + backface-visibility: hidden; +} +.container .cover .back .backImg{ + transform: rotateY(180deg); + transform: rotateY(180deg); +} +.container .cover .text{ + position: absolute; + z-index: 111; + height: 100%; + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} +.cover .text .text-1, +.cover .text .text-2{ + font-size: 26px; + font-weight: 600; + color: #fff; + text-align: center; + backface-visibility: hidden; +} +.cover .back .text .text-1, +.cover .back .text .text-2{ + transform: rotateY(180deg); +} +.cover .text .text-2{ + font-size: 15px; + font-weight: 500; +} +.container .forms{ + height: 100%; + width: 100%; + background: #fff; +} +.container .form-content{ + display: flex; + align-items: center; + justify-content: space-between; +} +.form-content .login-form, +.form-content .signup-form{ + width: calc(100% / 2 - 25px); +} +.forms .form-content .title{ + position: relative; + font-size: 24px; + font-weight: 500; + color: #333; +} +.forms .form-content .title:before{ + content: ''; + position: absolute; + left: 0; + bottom: 0; + height: 3px; + width: 25px; + background: #354457; +} +.forms .signup-form .title:before{ + width: 20px; +} +.forms .form-content .input-boxes{ + margin-top: 30px; +} +.forms .form-content .input-box{ + display: flex; + align-items: center; + height: 50px; + width: 100%; + margin: 10px 0; + position: relative; +} +.form-content .input-box input{ + height: 100%; + width: 100%; + outline: none; + border: none; + padding: 0 30px; + font-size: 16px; + font-weight: 500; + border-bottom: 2px solid rgba(0,0,0,0.2); + transition: all 0.3s ease; +} +.form-content .input-box input:focus, +.form-content .input-box input:valid{ + border-color: #354457; +} +.form-content .input-box i{ + position: absolute; + color: #354457; + font-size: 17px; +} +.forms .form-content .text{ + font-size: 14px; + font-weight: 500; + color: #333; +} +.forms .form-content .text a{ + text-decoration: none; +} +.forms .form-content .text a:hover{ + text-decoration: underline; +} +.forms .form-content .button{ + color: #fff; + margin-top: 40px; +} +.forms .form-content .button input{ + color: #fff; + background: #354457; + border-radius: 6px; + padding: 0; + cursor: pointer; + transition: all 0.4s ease; +} +.forms .form-content .button input:hover{ + background: #354457; +} +.forms .form-content label{ + color: #170f21; + cursor: pointer; +} +.forms .form-content label:hover{ + text-decoration: underline; +} +.forms .form-content .login-text, +.forms .form-content .sign-up-text{ + text-align: center; + margin-top: 25px; +} +.container #flip{ + display: none; +} +@media (max-width: 730px) { + .container .cover{ + display: none; + } + .form-content .login-form, + .form-content .signup-form{ + width: 100%; + } + .form-content .signup-form{ + display: none; + } + .container #flip:checked ~ .forms .signup-form{ + display: block; + } + .container #flip:checked ~ .forms .login-form{ + display: none; + } +}