Merge pull request #446 from ZoeADavis/master

Added cursor types
you-dont-need · Oct 3, 2024 · df73661 · df73661
2 parents 7d390d6 + ea89b17
commit df73661
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 0 deletions.
diff --git a/...encast from 31-10-23 07:12:05 PM IST.webm → ...encast from 31-10-23 07_12_05 PM IST.webm b/...encast from 31-10-23 07:12:05 PM IST.webm → ...encast from 31-10-23 07_12_05 PM IST.webm
diff --git a/Cursor/index.html b/Cursor/index.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html> 
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="./style.css" />
+    <title>Cursors - Zoe Davis</title>
+  </head>
+  <body>
+    <div class="container">
+      <div class="cursor-auto cursor-common">🖱️ Hover over me (auto)</div>
+      <div class="cursor-default cursor-common">➡️ Hover over me (default)</div>
+      <div class="cursor-crosshair cursor-common">🎯 Hover over me (crosshair)</div>
+      <div class="cursor-wait cursor-common">⏳ Hover over me (wait)</div>
+      <div class="cursor-text cursor-common">✏️ Hover over me (text)</div>
+    </div>
+  </body>
+</html>
diff --git a/Cursor/style.css b/Cursor/style.css
@@ -0,0 +1,45 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway:300,400');
+body {
+  background: #e1e2dd;
+  font-family: 'Raleway', sans-serif;
+}
+
+.cursor-common {
+    width: 350px;
+    height: 50px;
+    font-size: 25px;
+    transition: color 2s ease-out 100ms;
+}
+
+.cursor-common:hover {
+    color: #7ae615;
+}
+
+.cursor-auto {
+    cursor: auto;
+}
+
+.cursor-default {
+    cursor: default;
+}
+
+.cursor-crosshair {
+    cursor: crosshair;
+}
+
+.cursor-wait {
+    cursor: wait;
+}
+
+.cursor-text {
+    cursor: text;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 20px;
+    height: 100vh;
+}