forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
fix: align code content
+9
-4
+9
-4
app/components/CodeViewer.vue
+9
-4
app/components/CodeViewer.vue
···
110
110
111
111
.code-content :deep(code) {
112
112
display: block;
113
+
padding: 0 1rem;
113
114
background: transparent !important;
114
115
}
115
116
116
117
.code-content :deep(.line) {
117
118
display: block;
118
-
padding: 0 1rem;
119
-
/* Ensure consistent line height matching line numbers */
120
-
line-height: 1.5rem;
121
-
min-height: 1.5rem;
119
+
/* Ensure consistent height matching line numbers */
120
+
line-height: 24px;
121
+
min-height: 24px;
122
+
max-height: 24px;
123
+
white-space: pre;
124
+
overflow: hidden;
122
125
transition: background-color 0.1s;
123
126
}
124
127
125
128
/* Highlighted lines in code content */
126
129
.code-content :deep(.line.highlighted) {
127
130
background: rgb(234 179 8 / 0.2); /* yellow-500/20 */
131
+
margin: 0 -1rem;
132
+
padding: 0 1rem;
128
133
}
129
134
</style>