ui and ux adjustments

Author: technoph1le

public/data/css.json

@@ -7,14 +7,14 @@
         "description": "Adjusts font size based on viewport width.",
         "code": "h1 {\n  font-size: calc(1.5rem + 2vw);\n}",
         "tags": ["css", "font", "responsive", "typography"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Letter Spacing",
         "description": "Adds space between letters for better readability.",
         "code": "p {\n  letter-spacing: 0.05em;\n}",
         "tags": ["css", "typography", "spacing"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -26,14 +26,14 @@
         "description": "Ensures the footer always stays at the bottom of the page.",
         "code": "body {\n  display: flex;\n  flex-direction: column;\n  min-height: 100vh;\n}\n\nfooter {\n  margin-top: auto;\n}",
         "tags": ["css", "layout", "footer", "sticky"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Equal-Width Columns",
         "description": "Creates columns with equal widths using flexbox.",
         "code": ".columns {\n  display: flex;\n  justify-content: space-between;\n}\n\n.column {\n  flex: 1;\n  margin: 0 10px;\n}",
         "tags": ["css", "flexbox", "columns", "layout"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -45,14 +45,14 @@
         "description": "Creates a hover effect with a color transition.",
         "code": ".button {\n  background-color: #007bff;\n  color: white;\n  padding: 10px 20px;\n  border: none;\n  border-radius: 5px;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n}\n\n.button:hover {\n  background-color: #0056b3;\n}",
         "tags": ["css", "button", "hover", "transition"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "3D Button Effect",
         "description": "Adds a 3D effect to a button when clicked.",
         "code": ".button {\n  background-color: #28a745;\n  color: white;\n  padding: 10px 20px;\n  border: none;\n  border-radius: 5px;\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n  transition: transform 0.1s;\n}\n\n.button:active {\n  transform: translateY(2px);\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);\n}",
         "tags": ["css", "button", "3D", "effect"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -64,14 +64,14 @@
         "description": "Applies a blur effect to the background of an element.",
         "code": ".blur-background {\n  backdrop-filter: blur(10px);\n  background: rgba(255, 255, 255, 0.5);\n}",
         "tags": ["css", "blur", "background", "effects"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Hover Glow Effect",
         "description": "Adds a glowing effect on hover.",
         "code": ".glow {\n  background-color: #f39c12;\n  padding: 10px 20px;\n  border-radius: 5px;\n  transition: box-shadow 0.3s ease;\n}\n\n.glow:hover {\n  box-shadow: 0 0 15px rgba(243, 156, 18, 0.8);\n}",
         "tags": ["css", "hover", "glow", "effects"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   }

public/data/javascript.json

@@ -7,14 +7,14 @@
         "description": "Removes duplicate values from an array.",
         "code": "const removeDuplicates = (arr) => [...new Set(arr)];\n\n// Usage:\nconst numbers = [1, 2, 2, 3, 4, 4, 5];\nconsole.log(removeDuplicates(numbers)); // Output: [1, 2, 3, 4, 5]",
         "tags": ["javascript", "array", "deduplicate", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Flatten Array",
         "description": "Flattens a multi-dimensional array.",
         "code": "const flattenArray = (arr) => arr.flat(Infinity);\n\n// Usage:\nconst nestedArray = [1, [2, [3, [4]]]];\nconsole.log(flattenArray(nestedArray)); // Output: [1, 2, 3, 4]",
         "tags": ["javascript", "array", "flatten", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -26,14 +26,14 @@
         "description": "Capitalizes the first letter of a string.",
         "code": "const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);\n\n// Usage:\nconsole.log(capitalize('hello')); // Output: 'Hello'",
         "tags": ["javascript", "string", "capitalize", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Reverse String",
         "description": "Reverses the characters in a string.",
         "code": "const reverseString = (str) => str.split('').reverse().join('');\n\n// Usage:\nconsole.log(reverseString('hello')); // Output: 'olleh'",
         "tags": ["javascript", "string", "reverse", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -45,14 +45,14 @@
         "description": "Formats a date in 'YYYY-MM-DD' format.",
         "code": "const formatDate = (date) => date.toISOString().split('T')[0];\n\n// Usage:\nconsole.log(formatDate(new Date())); // Output: '2024-12-10'",
         "tags": ["javascript", "date", "format", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Get Time Difference",
         "description": "Calculates the time difference in days between two dates.",
         "code": "const getTimeDifference = (date1, date2) => {\n  const diff = Math.abs(date2 - date1);\n  return Math.ceil(diff / (1000 * 60 * 60 * 24));\n};\n\n// Usage:\nconst date1 = new Date('2024-01-01');\nconst date2 = new Date('2024-12-31');\nconsole.log(getTimeDifference(date1, date2)); // Output: 365",
         "tags": ["javascript", "date", "time-difference", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -64,14 +64,14 @@
         "description": "Delays a function execution until after a specified time.",
         "code": "const debounce = (func, delay) => {\n  let timeout;\n  return (...args) => {\n    clearTimeout(timeout);\n    timeout = setTimeout(() => func(...args), delay);\n  };\n};\n\n// Usage:\nwindow.addEventListener('resize', debounce(() => console.log('Resized!'), 500));",
         "tags": ["javascript", "utility", "debounce", "performance"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Throttle Function",
         "description": "Limits a function execution to once every specified time interval.",
         "code": "const throttle = (func, limit) => {\n  let lastFunc;\n  let lastRan;\n  return (...args) => {\n    const context = this;\n    if (!lastRan) {\n      func.apply(context, args);\n      lastRan = Date.now();\n    } else {\n      clearTimeout(lastFunc);\n      lastFunc = setTimeout(() => {\n        if (Date.now() - lastRan >= limit) {\n          func.apply(context, args);\n          lastRan = Date.now();\n        }\n      }, limit - (Date.now() - lastRan));\n    }\n  };\n};\n\n// Usage:\ndocument.addEventListener('scroll', throttle(() => console.log('Scrolled!'), 1000));",
         "tags": ["javascript", "utility", "throttle", "performance"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -83,14 +83,14 @@
         "description": "Toggles a class on an element.",
         "code": "const toggleClass = (element, className) => {\n  element.classList.toggle(className);\n};\n\n// Usage:\nconst element = document.querySelector('.my-element');\ntoggleClass(element, 'active');",
         "tags": ["javascript", "dom", "class", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Smooth Scroll to Element",
         "description": "Scrolls smoothly to a specified element.",
         "code": "const smoothScroll = (element) => {\n  element.scrollIntoView({ behavior: 'smooth' });\n};\n\n// Usage:\nconst target = document.querySelector('#target');\nsmoothScroll(target);",
         "tags": ["javascript", "dom", "scroll", "ui"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   }

public/data/python.json

@@ -7,14 +7,14 @@
         "description": "Reverses the characters in a string.",
         "code": "def reverse_string(s):\n    return s[::-1]\n\n# Usage:\nprint(reverse_string('hello'))  # Output: 'olleh'",
         "tags": ["python", "string", "reverse", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Check Palindrome",
         "description": "Checks if a string is a palindrome.",
         "code": "def is_palindrome(s):\n    s = s.lower().replace(' ', '')\n    return s == s[::-1]\n\n# Usage:\nprint(is_palindrome('A man a plan a canal Panama'))  # Output: True",
         "tags": ["python", "string", "palindrome", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -26,14 +26,14 @@
         "description": "Flattens a multi-dimensional list into a single list.",
         "code": "def flatten_list(lst):\n    return [item for sublist in lst for item in sublist]\n\n# Usage:\nnested_list = [[1, 2], [3, 4], [5]]\nprint(flatten_list(nested_list))  # Output: [1, 2, 3, 4, 5]",
         "tags": ["python", "list", "flatten", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Remove Duplicates",
         "description": "Removes duplicate elements from a list while maintaining order.",
         "code": "def remove_duplicates(lst):\n    return list(dict.fromkeys(lst))\n\n# Usage:\nprint(remove_duplicates([1, 2, 2, 3, 4, 4, 5]))  # Output: [1, 2, 3, 4, 5]",
         "tags": ["python", "list", "duplicates", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -45,14 +45,14 @@
         "description": "Reads all lines from a file and returns them as a list.",
         "code": "def read_file_lines(filepath):\n    with open(filepath, 'r') as file:\n        return file.readlines()\n\n# Usage:\nlines = read_file_lines('example.txt')\nprint(lines)",
         "tags": ["python", "file", "read", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Write to File",
         "description": "Writes content to a file.",
         "code": "def write_to_file(filepath, content):\n    with open(filepath, 'w') as file:\n        file.write(content)\n\n# Usage:\nwrite_to_file('example.txt', 'Hello, World!')",
         "tags": ["python", "file", "write", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -64,14 +64,14 @@
         "description": "Calculates the factorial of a number.",
         "code": "def factorial(n):\n    if n == 0:\n        return 1\n    return n * factorial(n - 1)\n\n# Usage:\nprint(factorial(5))  # Output: 120",
         "tags": ["python", "math", "factorial", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Check Prime Number",
         "description": "Checks if a number is a prime number.",
         "code": "def is_prime(n):\n    if n <= 1:\n        return False\n    for i in range(2, int(n**0.5) + 1):\n        if n % i == 0:\n            return False\n    return True\n\n# Usage:\nprint(is_prime(17))  # Output: True",
         "tags": ["python", "math", "prime", "check"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -83,14 +83,14 @@
         "description": "Measures the execution time of a code block.",
         "code": "import time\n\ndef measure_time(func, *args):\n    start = time.time()\n    result = func(*args)\n    end = time.time()\n    print(f'Execution time: {end - start:.6f} seconds')\n    return result\n\n# Usage:\ndef slow_function():\n    time.sleep(2)\n\nmeasure_time(slow_function)",
         "tags": ["python", "time", "execution", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Generate Random String",
         "description": "Generates a random alphanumeric string.",
         "code": "import random\nimport string\n\ndef random_string(length):\n    letters_and_digits = string.ascii_letters + string.digits\n    return ''.join(random.choice(letters_and_digits) for _ in range(length))\n\n# Usage:\nprint(random_string(10))  # Output: Random 10-character string",
         "tags": ["python", "random", "string", "utility"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   }

public/data/scss.json

@@ -7,28 +7,28 @@
         "description": "A Sass mixin to clamp text to a specific number of lines.",
         "code": "@mixin line-clamp($number) {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: $number;\n  overflow: hidden;\n}",
         "tags": ["sass", "mixin", "typography", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Text Overflow Ellipsis",
         "description": "Ensures long text is truncated with an ellipsis.",
         "code": "@mixin text-ellipsis {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}",
         "tags": ["sass", "mixin", "text", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Font Import Helper",
         "description": "Simplifies importing custom fonts in Sass.",
         "code": "@mixin import-font($family, $weight: 400, $style: normal) {\n  @font-face {\n    font-family: #{$family};\n    font-weight: #{$weight};\n    font-style: #{$style};\n    src: url('/fonts/#{$family}-#{$weight}.woff2') format('woff2'),\n         url('/fonts/#{$family}-#{$weight}.woff') format('woff');\n  }\n}",
         "tags": ["sass", "mixin", "fonts", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Text Gradient",
         "description": "Adds a gradient color effect to text.",
         "code": "@mixin text-gradient($from, $to) {\n  background: linear-gradient(to right, $from, $to);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n}",
         "tags": ["sass", "mixin", "gradient", "text", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -40,21 +40,21 @@
         "description": "Creates a responsive grid container with customizable column counts.",
         "code": "@mixin grid-container($columns: 12, $gap: 1rem) {\n  display: grid;\n  grid-template-columns: repeat($columns, 1fr);\n  gap: $gap;\n}",
         "tags": ["scss", "grid", "layout", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Flex Center",
         "description": "A mixin to center content using flexbox.",
         "code": "@mixin flex-center {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}",
         "tags": ["scss", "flex", "center", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Aspect Ratio",
         "description": "Ensures elements maintain a specific aspect ratio.",
         "code": "@mixin aspect-ratio($width, $height) {\n  position: relative;\n  width: 100%;\n  padding-top: ($height / $width) * 100%;\n  > * {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n}",
         "tags": ["scss", "aspect-ratio", "layout", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -66,14 +66,14 @@
         "description": "Animates the fade-in effect.",
         "code": "@keyframes fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@mixin fade-in($duration: 1s, $easing: ease-in-out) {\n  animation: fade-in $duration $easing;\n}",
         "tags": ["scss", "animation", "fade", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Slide In From Left",
         "description": "Animates content sliding in from the left.",
         "code": "@keyframes slide-in-left {\n  from {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n@mixin slide-in-left($duration: 0.5s, $easing: ease-out) {\n  animation: slide-in-left $duration $easing;\n}",
         "tags": ["scss", "animation", "slide", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -85,14 +85,14 @@
         "description": "Generates media queries for responsive design.",
         "code": "@mixin breakpoint($breakpoint) {\n  @if $breakpoint == sm {\n    @media (max-width: 576px) { @content; }\n  } @else if $breakpoint == md {\n    @media (max-width: 768px) { @content; }\n  } @else if $breakpoint == lg {\n    @media (max-width: 992px) { @content; }\n  } @else if $breakpoint == xl {\n    @media (max-width: 1200px) { @content; }\n  }\n}",
         "tags": ["scss", "responsive", "media-queries", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Clearfix",
         "description": "Provides a clearfix utility for floating elements.",
         "code": "@mixin clearfix {\n  &::after {\n    content: '';\n    display: block;\n    clear: both;\n  }\n}",
         "tags": ["scss", "clearfix", "utility", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -104,14 +104,14 @@
         "description": "Applies a customizable border-radius.",
         "code": "@mixin border-radius($radius: 4px) {\n  border-radius: $radius;\n}",
         "tags": ["scss", "border", "radius", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       },
       {
         "title": "Box Shadow Helper",
         "description": "Generates a box shadow with customizable values.",
         "code": "@mixin box-shadow($x: 0px, $y: 4px, $blur: 10px, $spread: 0px, $color: rgba(0, 0, 0, 0.1)) {\n  box-shadow: $x $y $blur $spread $color;\n}",
         "tags": ["scss", "box-shadow", "css", "effects"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   },
@@ -123,7 +123,7 @@
         "description": "Generates a styled primary button.",
         "code": "@mixin primary-button($bg: #007bff, $color: #fff) {\n  background-color: $bg;\n  color: $color;\n  padding: 0.5rem 1rem;\n  border: none;\n  border-radius: 4px;\n  cursor: pointer;\n\n  &:hover {\n    background-color: darken($bg, 10%);\n  }\n}",
         "tags": ["scss", "button", "primary", "css"],
-        "author": "@technoph1le"
+        "author": "dostonnabotov"
       }
     ]
   }