feat(app): add tinDog-canine-connection-app

Fronted Projects/tinDog - Canine Connection App/README.md

@@ -0,0 +1,68 @@
+# tinDog - Canine Connection Apsp
+
+Welcome to tinDog, the ultimate platform for dog lovers to meet nearby dogs and potentially find their true love. Inspired by Tinder, tinDog is designed to connect people through their shared love for dogs. Swipe right to meet your furry friend or even your future life partner. Get started now and unleash the world of doggy happiness!
+
+## Table of Contents
+
+- [Demo](#demo)
+- [Technologies Used](#technologies-used)
+- [Features](#features)
+- [Screenshots](#screenshots)
+- [Getting Started](#getting-started)
+- [Contributing](#contributing)
+- [License](#license)
+
+## Demo
+
+Check out the live demo: [tinDog Live Demo](https://ahsancommits.github.io/tinDog)
+
+## Technologies Used
+
+This app is built using the following technologies:
+
+- HTML
+- CSS
+- JavaScript
+- Bootstrap
+- Responsive Design
+
+## Features
+
+- User-friendly, Tinder-inspired interface for dog lovers.
+- Find nearby dogs and their owners.
+- Swipe right to like and connect with others.
+- Explore a world of doggy happiness.
+- Connect with like-minded dog enthusiasts.
+- Responsive design for a seamless experience on all devices.
+
+## Screenshots
+
+![tinDog Screenshot 1](images/1.png)
+
+![tinDog Screenshot 2](images/2.png)
+
+![tinDog Screenshot 3](images/3.png)
+
+## Getting Started
+
+Follow these steps to get a copy of the project up and running on your local machine.
+
+1. Clone the repository:
+
+   ```shell
+   git clone https://github.com/ahsancommits/tinDog.git
+   ```
+
+2. Open the project directory:
+
+   ```shell
+   cd tinDog
+   ```
+
+3. Open the `index.html` file in your web browser to start using tinDog.
+
+## Contributing
+
+We welcome contributions from the community. If you have ideas for improvements or find any issues, please submit a pull request or open an issue in this repository.
+
+Enjoy connecting with fellow dog lovers on tinDog! 🐶❤️

Fronted Projects/tinDog - Canine Connection App/css/styles.css

@@ -0,0 +1,196 @@
+body {
+  font-family: 'Montserrat', sans-serif;
+  text-align: center;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 700;
+}
+
+p {
+  color: #8f8f8f;
+}
+
+/* Headings */
+
+.big-heading{
+  font-family: 'Montserrat', sans-serif;
+  font-size: 3.5rem;
+  font-weight: 900;
+  line-height: 1.5;
+}
+
+.section-heading{
+  font-size: 3rem;
+  line-height: 1.5;
+}
+
+
+/* Containers */
+
+.container-fluid {
+  padding: 7% 15%;
+}
+
+/* Sections */
+
+.colored-section {
+background-color: #ff4c68;
+color: #fff;
+}
+
+.white-section {
+background-color: #fff;
+}
+
+/* Navigation Bar */
+.navbar {
+  padding: 0 0 4.5rem;
+}
+
+.navbar-brand {
+  font-family: 'Ubuntu', sans-serif;
+  font-size: 2.5rem;
+  font-weight: bold;
+}
+
+.nav-item {
+  padding: 0 18px;
+}
+
+.nav-link {
+  font-size: 1.2rem;
+  font-family: 'Montserrat', sans-serif;
+  font-weight: 300;
+}
+
+/* Title Section  */
+
+#title .container-fluid{
+  padding: 3% 15% 7%;
+  text-align: left;
+}
+
+/* Download Buttons */
+.download-button {
+  margin: 5% 3% 5% 0;
+}
+
+/* Title Image */
+.title-image {
+  height: 67%;
+  transform: rotate(25deg);
+  position: absolute;
+  right: 25%;
+}
+
+/* Features Section*/
+#features {
+  position: relative;
+}
+
+.feature-title {
+  font-size: 1.5rem;
+}
+
+.feature-box {
+  padding: 2.8%;
+}
+
+.icon {
+  color: #ef8172;
+  margin-bottom: 1rem;
+}
+
+.icon:hover {
+  color: #ff4c68;
+}
+
+/* Testimonials Section */
+#testimonials {
+  background-color: #ef8172;
+}
+
+.testimonial-text {
+  font-size: 3rem;
+  line-height: 1.5;
+}
+
+.testimonial-image {
+  width: 10%;
+  border-radius: 100%;
+  margin: 20px;
+}
+
+
+/* Press Section */
+#press {
+  background-color: #ef8172;
+  padding-bottom: 3%;
+}
+
+.press-logo {
+  width: 15%;
+  margin: 20px 20px 50px;
+}
+
+/* Pricing Section */
+#pricing {
+  padding: 100px;
+}
+
+.price-title {
+  margin-top: 0.5rem;
+  font-size: 1.5rem;
+}
+
+.price-text{
+  font-size: 3rem;
+}
+
+.pricing-column {
+  padding: 3% 2%;
+}
+
+.pricing-icon {
+  display: flex;
+  align-items: center;
+}
+
+.pricing-icon i {
+  color: #ef8172;
+}
+
+.pricing-icon i:hover {
+  color: #ff4c68;
+}
+
+.pricing-icon p {
+  margin: 0 10px;
+}
+
+
+/* Footer Section */
+
+.social-icon{
+  margin: 20px 10px;
+}
+
+
+/* Responsive */
+@media (max-width: 1028px) {
+  .title-main{
+  text-align: center;
+  }
+
+
+  .nav-item {
+    padding: 0;
+  }
+
+  .title-image{
+    position: static;
+    transform: rotate(0);
+  }
+}