testing area

tayrp · Sep 17, 2024 · 796c93e · 796c93e
1 parent 8ea9e08
commit 796c93e
Show file tree

Hide file tree

Showing 7 changed files with 114 additions and 0 deletions.
diff --git a/testing/Assets/img/discord.png b/testing/Assets/img/discord.png
diff --git a/testing/Assets/img/github.png b/testing/Assets/img/github.png
diff --git a/testing/Assets/img/icon.png b/testing/Assets/img/icon.png
diff --git a/testing/Assets/img/youtube.png b/testing/Assets/img/youtube.png
diff --git a/testing/README.md b/testing/README.md
@@ -0,0 +1,43 @@
+# PlowDev Portfolio
+Welcome to the PlowDev Portfolio, the showcase of my web development. Here is my personnal website!
+
+## Table of Contents
+- [Introduction](https://github.com/PlowDev/Website-Template?tab=readme-ov-file#introdution)
+- [Features](https://github.com/PlowDev/Website-Template?tab=readme-ov-file#features)
+- [How to Use](https://github.com/PlowDev/Website-Template?tab=readme-ov-file#how-to-use)
+- [Contribution](https://github.com/PlowDev/Website-Template?tab=readme-ov-file#contribution)
+- [License](https://github.com/PlowDev/Website-Template?tab=readme-ov-file#license)
+
+## Introduction
+This repository is my personnal website created by Plow to make [My Website](https://plow.is-a.dev)
+
+## Features
+You can modify the links where it redirects you to, you can change the background video and the socials logo too!
+
+## How to Use
+Clone the repository to your local machine.
+```git clone https://github.com/PlowDev/Website-Template.git```
+1. Open the **index.html** file in your preferred code editor.
+2. Customize the content in the HTML file to reflect your personal information, projects, and skills.
+3. Modify the images and background video to personalize the visual elements.
+4. Save your changes and deploy the website on your hosting platform of choice. I suggest cloudfare pages.
+
+## Customisation
+**Changing Images**
+
+Replace the existing images in Assets/img with your own. Ensure that the file names in the HTML file match your new image names.
+
+**Background Video**
+
+Swap out the background video by replacing the existing video file in Assets/vid. Update the file name in the HTML file accordingly.
+
+**Colors**
+
+Feel free to modify the color scheme by adjusting the CSS styles in the styles.css file.
+
+## Contribution
+If you find any issues or have suggestions for improvement, please open an issue or create a pull request. Contributions are highly welcome!
+
+## License
+This project doesn't have any licence! You can customize it for your own use! 
+Feel free to credit me!
diff --git a/testing/index.html b/testing/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html oncontextmenu="return false">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Plow | Developer</title>
+    <link rel="stylesheet" href="style.css">
+    <link rel="icon" type="image/png" href="Assets/img/icon.png" />
+</head>
+<body>
+    <div class="content">
+        <h1>PlowDev</h1>
+        <p>Hey, i'm Plow! A new website developer.</p>
+        <div id="images">
+        <a href="https://discord.com/users/1050531216589332581" target="_blank"><img src="Assets/img/discord.png" class="social-logo" alt="Discord"></a>
+        <a href="https://github.com/tayrp" target="_blank"><img src="Assets/img/github.png" class="social-logo" alt="Github"></a>
+        <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank"><img src="Assets/img/youtube.png" class="social-logo" alt="Twitter"></a>
+        </div>
+    </div>
+    <video autoplay loop>
+        <source src="https://index.havenmc.org/website/assets/mp4/usurper.mp4" type="video/mp4">
+    </video>
+</body>
+</html>
diff --git a/testing/style.css b/testing/style.css
@@ -0,0 +1,47 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');
+
+body {
+    overflow: hidden;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    background-color: black;
+    z-index: 1;
+}
+
+.content {
+    text-align: center;
+    color: white;
+    z-index: 1;
+    font-family: 'Roboto Mono', monospace;
+    font-size: 30px;
+}
+
+#images {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.social-logo {
+    padding-left: 15px;
+    padding-right: 10px;
+    transition: transform 0.2s;
+    width: 50px;
+    height: 50px;
+}
+
+video {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    min-width: 100%;
+    min-height: 100%;
+    width: auto;
+    height: auto;
+    transform: translateX(-50%) translateY(-50%);
+    z-index: -1;
+    filter: blur(7px);
+    opacity: 65%;
+}