Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create Improved HTML #4

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
189 changes: 189 additions & 0 deletions Improved HTML
Original file line number Diff line number Diff line change
@@ -0,0 +1,189 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Exif Images Edition - Extract and manage EXIF data effortlessly.">
<title>Exif Images Edition</title>
<style>
body {
font-family: Arial, sans-serif;
line-height: 1.6;
background-color: #ffffff;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
.container {
max-width: 800px;
background: #c7b8b8;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 15px rgba(255, 0, 0, 0.2);
position: relative;
}
.logo {
display: block;
margin: 0 auto;
max-height: 200px;
border-radius: 50%;
box-shadow: 0px 0px 15px rgba(60, 198, 129, 0.5);
}
h2, h3 {
text-align: center;
color: #446d15;
font-weight: bold;
margin-bottom: 10px;
}
hr {
border: none;
border-top: 2px solid #7e7c7c;
margin: 20px 0;
}
ul, ol {
margin-left: 20px;
padding-left: 10px;
}
ul li, ol li {
color: white;
margin-bottom: 8px;
}
.code-block {
position: relative;
background-color: #f8f8f8;
padding: 10px;
border-radius: 8px;
margin-bottom: 20px;
}
.copy-btn {
position: absolute;
top: 10px;
right: 10px;
background-color: #8795a3;
color: #000;
border: none;
padding: 5px 10px;
cursor: pointer;
border-radius: 5px;
transition: background-color 0.3s ease;
}
.copy-btn.copied {
background-color: #c4ccc6;
}
.copy-btn.copied::after {
content: "Copied";
}
.copy-btn:hover {
background-color: #000;
}
.center {
text-align: center;
margin-top: 20px;
}
.animated-text {
font-size: 24px;
font-weight: bold;
animation: color-change 5s infinite alternate;
margin-top: 20px;
display: block;
}
@keyframes color-change {
0% { color: #007bff; }
100% { color: #ff6347; }
}
.floating-image {
position: fixed;
bottom: 20px;
right: 20px;
width: 100px;
height: 100px;
background-color: #f8f8f8;
border-radius: 50%;
box-shadow: 0 0 10px rgba(255, 255, 255, 0.2);
overflow: hidden;
}
.floating-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
@media (max-width: 600px) {
.container {
padding: 15px;
}
.logo {
max-height: 150px;
}
.animated-text {
font-size: 20px;
}
}
</style>
</head>
<body>
<div class="container">
<p class="center">
<img class="logo" src="https://github.com/AryanVBW/Exif/releases/download/Exif/ExIF-Logo_BackgroundWhite.png" alt="Exif Logo">
<span class="animated-text">Exif-Images Edition</span>
</p>
<hr>
<h2>Features</h2>
<hr>
<ul>
<li>Extract exif data of images (jpg, jpeg, png).</li>
<li>Clear exif data from images.</li>
<li>Save data in a text file.</li>
</ul>
<h2>Supported Formats</h2>
<hr>
<ul>
<li>Images: PNG, JPG, JPEG, GIF, BMP, TIFF</li>
<li>Videos: MP4, MKV, AVI, MOV</li>
<li>Audio: MP3 (limited support, additional library may be required)</li>
</ul>
<h2>Installation and Usage Instructions</h2>
<hr>
<ol>
<li>Add .jpg to subfolder ./images from where the script is stored.</li>
<li>Note: Most social media sites strip exif data from uploaded photos.</li>
</ol>
<h3>Prerequisites</h3>
<hr>
<ul>
<li>Install Python3
<ul>
<li>Debian, Ubuntu, Etc: <code>sudo apt-get install python3</code></li>
<li>Fedora, Oracle, Red Hat, etc: <code>su -c "yum install python"</code></li>
<li>Windows: <a href="https://www.python.org/downloads/windows/">Python for Windows</a></li>
</ul>
</li>
<li>Install Pillow (Pillow will not work if you have PIL installed):
<pre><code>python3 -m pip install --upgrade pip
python3 -m pip install --upgrade Pillow
pip install Pillow moviepy
pip install eyed3</code></pre>
</li>
</ul>
<h2>Installation</h2>
<hr>
<h3>Copy & paste the following commands:</h3>
<div class="code-block">
<button class="copy-btn" aria-label="Copy installation commands" onclick="copyToClipboard('#install-commands')">Copy</button>
<pre id="install-commands"><code>git clone https://github.com/AryanVBW/Exif.git
cd Exif
python3 exif-main.py</code></pre>
</div>
<h3>To remove exif data from images, use the following command:</h3>
<div class="code-block">
<button class="copy-btn" aria-label="Copy remove exif commands" onclick="copyToClipboard('#remove-exif-commands')">Copy</button>
<pre id="remove-exif-commands"><code>python3 remove-exif.py</code></pre>
</div>
<h2>Direct Use</h2>
<hr>
<p>Discover the hidden details in your media files effortlessly! Simply run this script and:</p>
<ul>
<li>Enter the path to your images, videos, or audio files.</li>
<li>Choose where