beginning of first dev challenge from devchallenges

This commit is contained in:
Robert McGovern 2022-03-22 11:57:07 +00:00
parent f9ba9e8891
commit 01fad08c4d
4 changed files with 170 additions and 0 deletions

View File

@ -0,0 +1,75 @@
<!-- Please update value in the {} -->
<h1 align="center">{Your project name}</h1>
<div align="center">
Solution for a challenge from <a href="http://devchallenges.io" target="_blank">Devchallenges.io</a>.
</div>
<div align="center">
<h3>
<a href="https://{your-demo-link.your-domain}">
Demo
</a>
<span> | </span>
<a href="https://{your-url-to-the-solution}">
Solution
</a>
<span> | </span>
<a href="https://devchallenges.io/challenges/wBunSb7FPrIepJZAg0sY">
Challenge
</a>
</h3>
</div>
<!-- TABLE OF CONTENTS -->
## Table of Contents
- [Overview](#overview)
- [Built With](#built-with)
- [Features](#features)
- [Contact](#contact)
- [Acknowledgements](#acknowledgements)
<!-- OVERVIEW -->
## Overview
![screenshot](https://user-images.githubusercontent.com/16707738/92399059-5716eb00-f132-11ea-8b14-bcacdc8ec97b.png)
Introduce your projects by taking a screenshot or a gif. Try to tell visitors a story about your project by answering:
- Where can I see your demo?
- What was your experience?
- What have you learned/improved?
- Your wisdom? :)
### Built With
<!-- This section should list any major frameworks that you built your project using. Here are a few examples.-->
- [React](https://reactjs.org/)
- [Vue.js](https://vuejs.org/)
- [Tailwind](https://tailwindcss.com/)
## Features
<!-- List the features of your application or follow the template. Don't share the figma file here :) -->
This application/site was created as a submission to a [DevChallenges](https://devchallenges.io/challenges) challenge. The [challenge](https://devchallenges.io/challenges/wBunSb7FPrIepJZAg0sY) was to build an application to complete the given user stories.
## Acknowledgements
<!-- This section should list any articles or add-ons/plugins that helps you to complete the project. This is optional but it will help you in the future. For exmpale -->
- [Steps to replicate a design with only HTML and CSS](https://devchallenges-blogs.web.app/how-to-replicate-design/)
- [Node.js](https://nodejs.org/)
- [Marked - a markdown parser](https://github.com/chjj/marked)
## Contact
- Website [your-website.com](https://{your-web-site-link})
- GitHub [@your-username](https://{github.com/your-usermame})
- Twitter [@your-twitter](https://{twitter.com/your-username})

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,95 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1,
maximum-scale=5"
/>
<link rel="icon" href="devchallenges.png" />
<link
rel="shortcut icon"
type="image/x-icon"
href="https://devchallenges.io/"
/>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap"
rel="stylesheet"
/>
<title>Devchallenges</title>
<style>
body {
font-family: "Poppins", sans-serif;
}
ul {
padding-left: 24px;
}
li {
margin-bottom: 8px;
}
.welcome {
max-width: 800px;
margin: 0 auto;
}
.welcome-text {
margin-top: 30vh;
font-weight: 500;
}
.welcome-text p {
font-size: 1rem;
font-weight: 400;
}
.welcome-text h1 {
font-size: 1.5rem;
}
.welcome-text a {
color: #f7542e;
}
</style>
</head>
<body>
<div class="welcome">
<div class="welcome-text">
<h1>
Welcome to
<a href="https://devchallenges.io/" target="_blank"
>devchallenges.io</a
>
</h1>
<p>
If you have any questions, don't hesitate to ask on Discord. Here are
7 general steps to complete the challenge:
</p>
</div>
<ul>
<li><b>Step 1:</b> Create a new repository on github</li>
<li><b>Step 2:</b> Copy resources, README.md to your repository</li>
<li>
<b>Step 3:</b> Login to Figma to checkout font, color, spacing,..
</li>
<li><b>Step 4:</b> Complete all user stories</li>
<li><b>Step 5:</b> Update README.md</li>
<li><b>Step 6:</b> Deploy your app and submit your solution</li>
<li>
<b>Step 7:</b> Share your solution on Discord, Twitter and other
platforms to ask for feedback
</li>
</ul>
</div>
</body>
</html>