Merge pull request #2640 from AsmitaMishra24/master

Added Citation Generator
Sulagna-Dutta-Roy · Aug 9, 2024 · d7b51f7 · d7b51f7
2 parents 67f1d2f + db9a8f7
commit d7b51f7
Show file tree

Hide file tree

Showing 7 changed files with 118 additions and 0 deletions.
diff --git a/Citation Generator/icon128.png b/Citation Generator/icon128.png
diff --git a/Citation Generator/icon16.png b/Citation Generator/icon16.png
diff --git a/Citation Generator/icon48.png b/Citation Generator/icon48.png
diff --git a/Citation Generator/index.html b/Citation Generator/index.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Citation Generator</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<div class="container">
+    <h1>Citation Generator</h1>
+    <form id="citation-form">
+        <label for="author">Author:</label>
+        <input type="text" id="author" name="author" required>
+
+        <label for="title">Title:</label>
+        <input type="text" id="title" name="title" required>
+
+        <label for="publisher">Publisher:</label>
+        <input type="text" id="publisher" name="publisher" required>
+
+        <label for="year">Year:</label>
+        <input type="text" id="year" name="year" required>
+
+        <button type="submit">Genrate Citation</button>
+    </form>
+
+    <div id="citation-output">
+        <h2>Your Citation:</h2>
+        <p id="citation"></p>
+    </div>
+</div>
+<script src="script.js"></script>
+</body>
+</html>
diff --git a/Citation Generator/manifest.json b/Citation Generator/manifest.json
@@ -0,0 +1,16 @@
+{
+    "manifest_version": 3,
+    "name": "Citation Generator",
+    "version": "1.0",
+    "description": "A simple citation generator tool.",
+    "icons": {
+        "16": "icon16.png",
+        "48": "icon48.png",
+        "128": "icon128.png"
+    },
+    "action": {
+        "default_popup": "index.html",
+        "default_icon": "icon128.png"
+    },
+    "permissions": []
+}
diff --git a/Citation Generator/script.js b/Citation Generator/script.js
@@ -0,0 +1,13 @@
+document.getElementById('citation-form').addEventListener('submit', function(e) {
+    e.preventDefault();
+
+    const author = document.getElementById('author').value;
+    const title = document.getElementById('title').value;
+    const publisher = document.getElementById('publisher').value;
+    const year = document.getElementById('year').value;
+
+    const citation = `${author}. (${year}). *${title}*. ${publisher}.`;
+
+    document.getElementById('citation').textContent = citation;
+
+});
diff --git a/Citation Generator/style.css b/Citation Generator/style.css
@@ -0,0 +1,55 @@
+body {
+    width: 100%;
+    font-family: Arial, sans-serif;
+    background-color: #f4f4f4;
+    margin: 0;
+    padding: 0;
+}
+
+.container {
+    max-width: fit-content;
+    margin: 50px auto;
+    padding: 20px;
+}
+
+h1 {
+    text-align: center;
+}
+
+form {
+    display: flex;
+    flex-direction: column;
+}
+
+label {
+    margin-top: 10px;
+}
+
+input {
+    padding: 8px;
+    margin-top: 5px;
+    font-size: 16px;
+}
+
+button {
+    margin-top: 20px;
+    padding: 10px;
+    font-size: 16px;
+    background-color: #007bff;
+    color: #fff;
+    border: none;
+    cursor: pointer;
+}
+
+button:hover {
+    background-color: #0056b3;
+}
+
+#citation-output {
+    margin-top: 20px;
+}
+
+#citation {
+    font-style: italic;
+    color: #333;
+}