diff --git a/pr-preview/pr-7/index.html b/pr-preview/pr-7/index.html index f39398d..a9550dc 100644 --- a/pr-preview/pr-7/index.html +++ b/pr-preview/pr-7/index.html @@ -9,27 +9,24 @@ font-family: var(--font-sans); background-color: var(--gray-9); /* Dark background for body */ color: var(--gray-1); /* Light text color */ - margin: 0; - padding: 20px; - min-height: 100vh; + margin: 0 auto; + padding: var(--size-3); + max-width: var(--size-sm); } header { color: var(--gray-3); /* Lightest text color */ - padding-bottom: 10px; + padding-bottom: var(--size-2); text-align: center; font-size: var(--font-size-1); /* Larger text for the header */ - margin: 10px auto; - max-width: 600px; - border-radius: 8px; + margin: var(--size-2) auto; } ul { list-style-type: none; padding: 0; - margin: 10px auto; - max-width: 600px; + margin: var(--size-2) auto; background-color: var(--gray-8); /* Slightly lighter dark background for contrast */ box-shadow: var(--shadow-3); /* Prominent shadow for 3D effect */ - border-radius: 8px; + border-radius: var(--radius-2); } li { border-bottom: 1px solid var(--gray-7); @@ -37,17 +34,20 @@ transition: background-color 0.3s; } li:first-child { - border-radius: 8px 8px 0 0; + border-radius: var(--radius-2) var(--radius-2) 0 0; } li:last-child { - border-radius: 0 0 8px 8px; + border-radius: 0 0 var(--radius-2) var(--radius-2); + } + li:only-child { + border-radius: var(--radius-2); } li:hover { background-color: var(--gray-6); /* Slightly lighter on hover for interactive feel */ } a { display: block; - padding: 15px 20px; + padding: var(--size-3) var(--size-4); text-decoration: none; color: var(--gray-4); /* Subtle blue color for links */ transition: color 0.3s;