Skip to content

Commit 83ab432

Browse files
usrrnameusrrname
committed
style(cards): update layout and fix image links
- Fix broken image links with stable GIF sources - Update card layout and styling - Improve copy button container layout - Clean up HTML structure Commit written by KawaiiSamurai
1 parent dafc63c commit 83ab432

File tree

1 file changed

+53
-31
lines changed

1 file changed

+53
-31
lines changed

‎index.html‎

Lines changed: 53 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,38 @@
44
<head>
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<title>Problematic Cursor Agents</title>
7+
<meta name="description" content="Problematic Cursor Agents from hell">
8+
<meta name="keywords" content="Cursor Agents, Problematic, Hell, Coding, Assistance">
9+
<meta name="author" content="Problematic Cursor Agents">
10+
<meta name="robots" content="index, follow">
11+
<meta name="googlebot" content="index, follow">
12+
<meta name="bingbot" content="index, follow">
13+
<meta name="alexa" content="index, follow">
14+
<meta name="og:author" content="Jen Chan <[email protected]>">
15+
<meta name="og:title" content="Problematic Cursor Agents">
16+
<meta name="og:description" content="Problematic Cursor Agents">
17+
<meta name="og:image" content="">
18+
<meta name="og:url" content="">
19+
<meta name="og:site_name" content="Problematic Cursor Agents">
20+
<meta name="og:type" content="website">
21+
<meta name="og:locale" content="en_US">
22+
<title>Problematic Cursor Agents</title>
23+
<link rel="preconnect" href="https://fonts.googleapis.com" />
24+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
25+
<link href="https://fonts.googleapis.com/css2?family=Doto&display=swap" rel="stylesheet" />
26+
<!-- Add Japanese font -->
27+
<link rel="preload" as="font"
28+
href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;500;700&display=swap" rel="stylesheet">
29+
<!-- Preload critical images -->
30+
<link rel="preload" as="image"
31+
href="https://64.media.tumblr.com/93d6985c1e43fc60af8b0b00933fbae5/2e5abd8b6472caf5-e7/s540x810/9bc3765938f78d8ca1edfcb2afb83ddb99fcfffd.gif">
32+
<link rel="preload" as="image" href="https://img.wattpad.com/010697b3d2ebd7ece3c4ef45bb8ee45163752439/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f64497736424f626c39415a6f6e513d3d2d313931332e313636653662646361616534303532633933353139303631353531302e676966>
33+
<link rel=" preload" as="image"
34+
href="https://cdn.myanimelist.net/images/characters/8/327520.jpg">
35+
<link rel="preload" as="image"
36+
href="https://gifdb.com/images/high/anime-elf-frieren-going-to-eat-cake-33rvseyebg1a1wgj.gif">
37+
<link rel="preload" as="image"
38+
href="https://img.wattpad.com/7bb66ef9e6d07c0b459d8631e3026b13174667bb/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f6b4f624b695074717237437471773d3d2d313032373638323333362e313636343863376263376464386634643434303934303038303237362e676966">
839
<style>
940
/* Optimize performance with CSS containment */
1041
.card {
@@ -143,7 +174,7 @@
143174
radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .1) 1%, transparent 1.1%),
144175
radial-gradient(circle at 80% 20%, rgba(255, 255, 255, .1) 1.5%, transparent 1.6%),
145176
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23ff9ecd' d='M50 90c-5-20-10-35-25-35s-20 15-25 35c30 20 45 20 50 0zm0 0c5-20 10-35 25-35s20 15 25 35c-30 20-45 20-50 0'/%3E%3Ccircle fill='%23ff70b5' cx='50' cy='35' r='20'/%3E%3C/svg%3E");
146-
background-size: 400px 400px, 300px 300px, 200px 200px, 150px 150px;
177+
background-size: contain;
147178
background-position: 0 0, 50px 50px, -30px -30px, 0 0;
148179
animation: sparkle 20s linear infinite;
149180
opacity: 0.3;
@@ -500,15 +531,16 @@
500531

501532
/* Ticker styles */
502533
.ticker-container {
503-
width: 100%;
534+
max-width: 650px;
535+
width: auto;
504536
height: 40px;
505537
background: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(255, 142, 180, 0.8), rgba(0, 0, 0, 0.8));
506538
backdrop-filter: blur(5px);
507539
overflow: hidden;
508-
position: fixed;
509-
left: 0;
540+
position: relative;
510541
z-index: 1000;
511542
display: flex;
543+
justify-content: center;
512544
align-items: center;
513545
}
514546

@@ -524,9 +556,9 @@
524556
white-space: nowrap;
525557
padding-right: 100%;
526558
display: inline-block;
527-
animation: ticker 20s linear infinite;
559+
animation: ticker 60s linear infinite;
528560
color: #fff;
529-
font-family: monospace;
561+
font-family: 'Doto';
530562
font-size: 16px;
531563
}
532564

@@ -590,7 +622,6 @@
590622
.copy-button {
591623
background: linear-gradient(45deg, #ff8eb4, #ffa7c7);
592624
color: darkslategray;
593-
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
594625
border: none;
595626
padding: 12px 20px;
596627
border-radius: 25px;
@@ -626,19 +657,9 @@
626657
width: 16px;
627658
height: 16px;
628659
}
660+
629661
</style>
630-
<!-- Add Japanese font -->
631-
<link rel="preload" href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;500;700&display=swap"
632-
rel="stylesheet">
633-
<!-- Preload critical images -->
634-
<link rel="preload" as="image"
635-
href="https://64.media.tumblr.com/93d6985c1e43fc60af8b0b00933fbae5/2e5abd8b6472caf5-e7/s540x810/9bc3765938f78d8ca1edfcb2afb83ddb99fcfffd.gif">
636-
<link rel="preload" as="image" href="https://img.wattpad.com/010697b3d2ebd7ece3c4ef45bb8ee45163752439/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f64497736424f626c39415a6f6e513d3d2d313931332e313636653662646361616534303532633933353139303631353531302e676966>
637-
<link rel="preload" as="image" href="https://cdn.myanimelist.net/images/characters/8/327520.jpg">
638-
<link rel="preload" as="image"
639-
href="https://gifdb.com/images/high/anime-elf-frieren-going-to-eat-cake-33rvseyebg1a1wgj.gif">
640-
<link rel="preload" as="image"
641-
href="https://img.wattpad.com/7bb66ef9e6d07c0b459d8631e3026b13174667bb/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f6b4f624b695074717237437471773d3d2d313032373638323333362e313636343863376263376464386634643434303934303038303237362e676966">
662+
642663
</head>
643664

644665
<body>
@@ -652,21 +673,22 @@
652673
<div class="sakura"></div>
653674
<div class="sakura"></div>
654675

655-
<div class="ticker-container ticker-top">
656-
<div class="ticker">
657-
What are you waiting for? What could possibly be holding you back? Give it a try!
658-
&nbsp;&nbsp;&nbsp; The only thing holding you back is... yourself! &nbsp;&nbsp;&nbsp; Remember, love
659-
conquers
660-
all! &nbsp;&nbsp;&nbsp; Live passionately! &nbsp;&nbsp;&nbsp;
661-
Mirror mirror on the wall, who's the best ai of them all? &nbsp;&nbsp;&nbsp;
662-
</div>
663-
</div>
664676
<div class="">
665677
<div class="copy-container">
666678
<div class="copy-text">
667679
<h1>Cursor Agents from hell</h1>
668680
<h2>Coding assistance with personality</h2>
669681
</div>
682+
<div class="ticker-container ticker-top">
683+
<div class="ticker">
684+
This page may or may not stay online. What are you waiting for? What could possibly be holding you back? Give it
685+
a try!
686+
&nbsp;&nbsp;&nbsp; The only thing holding you back is... yourself! &nbsp;&nbsp;&nbsp; Remember, love conquers
687+
all!
688+
&nbsp;&nbsp;&nbsp; Live passionately! &nbsp;&nbsp;&nbsp;
689+
Mirror mirror on the wall, who's the best agent of them all? &nbsp;&nbsp;&nbsp;
690+
</div>
691+
</div>
670692
<div class="copy-button-container">
671693
<code class="copy-text">npx @usrrname/cursorrules</code>
672694
<button class="copy-button" aria-label="Copy command to clipboard" onclick="copyToClipboard()">
@@ -678,7 +700,7 @@ <h2>Coding assistance with personality</h2>
678700
Copy
679701
</button>
680702
</div>
681-
</div>
703+
</div>
682704
<div class="card-container">
683705
<!-- ThirstySimp Card -->
684706
<div class="card basic">
@@ -840,7 +862,7 @@ <h2>Coding assistance with personality</h2>
840862
<div class="type">Fairy / Flying</div>
841863
</div>
842864
</div>
843-
</div>
865+
</div>
844866
</div>
845867
<div class="footer">
846868
🦝 Vibe coded in Toronto

0 commit comments

Comments
 (0)