From 4f3f0d3063cac12bd543cd8a295306e912e91f6e Mon Sep 17 00:00:00 2001 From: GitHub Action Date: Fri, 3 Jan 2025 19:46:59 +0000 Subject: [PATCH 1/3] Update consolidated snippets --- public/consolidated/cpp.json | 17 +++++++++++++++++ public/consolidated/javascript.json | 18 ++++++------------ 2 files changed, 23 insertions(+), 12 deletions(-) diff --git a/public/consolidated/cpp.json b/public/consolidated/cpp.json index e560e82d..6427f04f 100644 --- a/public/consolidated/cpp.json +++ b/public/consolidated/cpp.json @@ -32,6 +32,23 @@ } ] }, + { + "categoryName": "Debuging", + "snippets": [ + { + "title": "Vector Print", + "description": "Overloads the << operator to print the contents of a vector just like in python.", + "author": "Mohamed-faaris", + "tags": [ + "printing", + "debuging", + "vector" + ], + "contributors": [], + "code": "#include \n#include \n\ntemplate \nstd::ostream& operator<<(std::ostream& os, const std::vector& vec) {\n os << \"[\"; \n for (size_t i = 0; i < vec.size(); ++i) {\n os << vec[i]; // Print each vector element\n if (i != vec.size() - 1) {\n os << \", \"; // Add separator\n }\n }\n os << \"]\"; \n return os; // Return the stream\n}\n\n// Usage:\nstd::vector numbers = {1, 2, 3, 4, 5};\nstd::cout << numbers << std::endl; // Outputs: [1, 2, 3, 4, 5]\n\n" + } + ] + }, { "categoryName": "Math And Numbers", "snippets": [ diff --git a/public/consolidated/javascript.json b/public/consolidated/javascript.json index 99588330..c7b78ff8 100644 --- a/public/consolidated/javascript.json +++ b/public/consolidated/javascript.json @@ -85,10 +85,8 @@ "description": "Converts RGB color values to hexadecimal color code.", "author": "jjcantu", "tags": [ - "javascript", "color", - "conversion", - "utility" + "conversion" ], "contributors": [], "code": "function rgbToHex(r, g, b) {\n const toHex = (n) => {\n const hex = n.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n };\n \n return '#' + toHex(r) + toHex(g) + toHex(b);\n}\n\n// Usage:\nconsole.log(rgbToHex(255, 128, 0)); // Output: \"#ff8000\"\nconsole.log(rgbToHex(0, 255, 0)); // Output: \"#00ff00\"\n" @@ -407,10 +405,8 @@ "description": "Converts bytes into human-readable file size format.", "author": "jjcantu", "tags": [ - "javascript", "format", - "size", - "utility" + "size" ], "contributors": [], "code": "function formatFileSize(bytes) {\n if (bytes === 0) return '0 Bytes';\n \n const k = 1024;\n const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n \n return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\n}\n\n// Usage:\nconsole.log(formatFileSize(1234)); // Output: \"1.21 KB\"\nconsole.log(formatFileSize(1234567)); // Output: \"1.18 MB\"\n" @@ -506,13 +502,11 @@ "description": "Creates a deep copy of an object or array without reference.", "author": "jjcantu", "tags": [ - "javascript", "object", - "clone", - "utility" + "clone" ], "contributors": [], - "code": "function deepClone(obj) {\n if (obj === null || typeof obj !== 'object') return obj;\n \n const clone = Array.isArray(obj) ? [] : {};\n \n for (let key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) {\n clone[key] = deepClone(obj[key]);\n }\n }\n \n return clone;\n}\n\n// Usage:\nconst original = { a: 1, b: { c: 2 }, d: [1, 2, 3] };\nconst cloned = deepClone(original);\nconsole.log(cloned); // Output: { a: 1, b: { c: 2 }, d: [1, 2, 3] }\n" + "code": "function deepClone(obj) {\n if (obj === null || typeof obj !== 'object') return obj;\n \n const clone = Array.isArray(obj) ? [] : {};\n \n for (let key in obj) {\n if (Object.prototype.hasOwnProperty.call(obj, key)) {\n clone[key] = deepClone(obj[key]);\n }\n }\n \n return clone;\n}\n\n// Usage:\nconst original = { a: 1, b: { c: 2 }, d: [1, 2, 3] };\nconst cloned = deepClone(original);\nconsole.log(cloned); // Output: 'original' but cloned\n" }, { "title": "Filter Object", @@ -758,9 +752,9 @@ "description": "Generates a UUID (v4) string.", "author": "jjcantu", "tags": [ - "javascript", "uuid", - "utility" + "generate", + "string" ], "contributors": [], "code": "function generateUUID() {\n return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {\n const r = Math.random() * 16 | 0;\n const v = c === 'x' ? r : (r & 0x3 | 0x8);\n return v.toString(16);\n });\n}\n\n// Usage:\nconsole.log(generateUUID()); // Output: \"a1b2c3d4-e5f6-4g7h-8i9j-k0l1m2n3o4p5\"\n" From 2b6dd3bf0026bfd117f361389a962d34aff3f8be Mon Sep 17 00:00:00 2001 From: rakRandom <112525075+neoRandom@users.noreply.github.com> Date: Fri, 3 Jan 2025 18:15:49 -0300 Subject: [PATCH 2/3] feat: update snippet button and modal increased the size of the snippet modal, added a bit more responsitivity too removed the gray filter on the snippet button --- src/components/CodePreview.tsx | 2 +- src/components/SnippetModal.tsx | 48 +++++++++++++++++---------------- src/styles/main.css | 28 ++++++++++++------- 3 files changed, 45 insertions(+), 33 deletions(-) diff --git a/src/components/CodePreview.tsx b/src/components/CodePreview.tsx index 5e72711f..b936fbaa 100644 --- a/src/components/CodePreview.tsx +++ b/src/components/CodePreview.tsx @@ -40,7 +40,7 @@ const CodePreview = ({ language = "markdown", code }: Props) => { language={language} style={theme === "dark" ? oneDark : oneLight} wrapLines={true} - customStyle={{ margin: "0", maxHeight: "20rem" }} + customStyle={{ margin: "0", maxHeight: "32rem" }} > {code} diff --git a/src/components/SnippetModal.tsx b/src/components/SnippetModal.tsx index b5e2379e..428ab21c 100644 --- a/src/components/SnippetModal.tsx +++ b/src/components/SnippetModal.tsx @@ -58,29 +58,31 @@ const SnippetModal: React.FC = ({ - -

- Description: - {snippet.description} -

-

- Contributed by{" "} - - @{snippet.author} - -

-
    - {snippet.tags.map((tag) => ( -
  • - {tag} -
  • - ))} -
+
+ +

+ Description: + {snippet.description} +

+

+ Contributed by{" "} + + @{snippet.author} + +

+
    + {snippet.tags.map((tag) => ( +
  • + {tag} +
  • + ))} +
+
, modalRoot diff --git a/src/styles/main.css b/src/styles/main.css index cd4ea727..f689f66c 100644 --- a/src/styles/main.css +++ b/src/styles/main.css @@ -550,22 +550,19 @@ abbr { border-radius: var(--br-lg); padding: 0.75em; text-align: start; - filter: grayscale(100%); &:is(:hover, :focus-visible) { - outline: 3px solid var(--clr-border-primary); - filter: grayscale(0); + outline: 2px solid var(--clr-border-primary); } } .snippet__preview { width: 100%; overflow: hidden; - aspect-ratio: 10 / 3; + aspect-ratio: 9 / 3; background-color: var(--clr-bg-secondary); /* background-image: var(--gradient-secondary); */ border: 1px solid var(--clr-border-primary); - border-radius: var(--br-md); position: relative; padding-inline: 1em; display: grid; @@ -599,20 +596,33 @@ body:has(.modal-overlay) { .modal { background-color: var(--clr-bg-secondary); - padding: 2rem; - width: 90%; - max-width: 800px; + width: fit-content; + max-width: 1000px; + max-height: 90%; border-radius: var(--br-lg); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); + gap: 0; position: relative; - gap: 1rem; + overflow: auto; } .modal__header { + z-index: 50; display: flex; + position: sticky; + top: 0; align-items: center; justify-content: space-between; gap: 1rem; + padding: 1rem 1.5rem; + background-color: var(--clr-bg-secondary); + border-radius: var(--br-lg); +} + +.modal__body { + padding: 1.5rem; + padding-top: 0; + gap: 1rem; } .code-preview { From aa6c55116e168c9477798913004c5e6c4dd0d53f Mon Sep 17 00:00:00 2001 From: rakRandom <112525075+neoRandom@users.noreply.github.com> Date: Thu, 9 Jan 2025 00:27:23 -0300 Subject: [PATCH 3/3] feat: add minimum width to modal --- src/styles/main.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/main.css b/src/styles/main.css index f689f66c..9f8436bb 100644 --- a/src/styles/main.css +++ b/src/styles/main.css @@ -597,6 +597,7 @@ body:has(.modal-overlay) { .modal { background-color: var(--clr-bg-secondary); width: fit-content; + min-width: 50%; max-width: 1000px; max-height: 90%; border-radius: var(--br-lg);