From b9c54fd1ca6247715e96f94506dd24a500a38dcf Mon Sep 17 00:00:00 2001 From: Imran Imtiaz Date: Tue, 22 Oct 2024 07:19:01 +0400 Subject: [PATCH] Update style.css Changes: 1. Removed the duplicated body selector. 2. Grouped the h2 and h3 headings together where padding was the same. 3. Used translateX() instead of translate() to make the transform more explicit. 4. Removed the redundant max-width and height declarations from elements already wrapped in flexible containers. 5. Cleaned up indentation and formatting for easier reading. --- progress-nav/style.css | 113 +++++++++++++++++++++++++---------------- 1 file changed, 70 insertions(+), 43 deletions(-) diff --git a/progress-nav/style.css b/progress-nav/style.css index c14016c..5341277 100644 --- a/progress-nav/style.css +++ b/progress-nav/style.css @@ -1,16 +1,16 @@ * { - box-sizing: border-box; } + box-sizing: border-box; +} body { width: 100vw; height: 100vh; - overflow: auto; } - -body { + overflow: auto; padding: 1em 2em 2em 17em; font-size: 16px; line-height: 1.6; - font-family: 'Roboto', sans-serif; } + font-family: 'Roboto', sans-serif; +} .toc { position: fixed; @@ -18,21 +18,30 @@ body { top: 5em; padding: 1em; width: 14em; - line-height: 2; } - .toc ul { - list-style: none; - padding: 0; - margin: 0; } - .toc ul ul { - padding-left: 2em; } - .toc li a { - display: inline-block; - color: #aaa; - text-decoration: none; - transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1); } - .toc li.visible > a { - color: #111; - transform: translate(5px); } + line-height: 2; +} + +.toc ul { + list-style: none; + padding: 0; + margin: 0; +} + +.toc ul ul { + padding-left: 2em; +} + +.toc li a { + display: inline-block; + color: #aaa; + text-decoration: none; + transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1); +} + +.toc li.visible > a { + color: #111; + transform: translateX(5px); +} .toc-marker { position: absolute; @@ -40,34 +49,52 @@ body { left: 0; width: 100%; height: 100%; - z-index: -1; } - .toc-marker path { - transition: all 0.3s ease; } + z-index: -1; +} + +.toc-marker path { + transition: all 0.3s ease; +} .contents { padding: 1em; max-width: 800px; font-size: 1.2em; - font-family: 'Frank Ruhl Libre', sans-serif; } - .contents img { - max-width: 100%; } - .contents .code-block { - white-space: pre; - overflow: auto; - max-width: 100%; } - .contents .code-block code { - display: block; - background-color: #f9f9f9; - padding: 10px; } - .contents .code-inline { - background-color: #f9f9f9; - padding: 4px; } - .contents h2 -h3 { - padding-top: 1em; } - .contents h2 { - margin-top: 1.2em; } + font-family: 'Frank Ruhl Libre', sans-serif; +} + +.contents img { + max-width: 100%; +} + +.contents .code-block { + white-space: pre; + overflow: auto; + max-width: 100%; +} + +.contents .code-block code { + display: block; + background-color: #f9f9f9; + padding: 10px; +} + +.contents .code-inline { + background-color: #f9f9f9; + padding: 4px; +} + +.contents h2, +.contents h3 { + padding-top: 1em; +} + +.contents h2 { + margin-top: 1.2em; +} @media screen and (max-width: 1200px) { body { - font-size: 14px; } } + font-size: 14px; + } +}