noham/Code-to-PDF
1
0
Fork 0
mirror of https://github.com/NohamR/Code-to-PDF.git synced 2026-05-24 19:58:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix issues with border radius

Browse Source
This commit is contained in:
tarikjaber
2023-04-06 19:16:48 -04:00
parent c4ca4a2495
commit d70e6c6249
2 changed files with 26 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
index.js
View File

@@ -30,13 +30,16 @@ printBtn.addEventListener('click', () => {
updateCode();
let optGroup = themeSelector.options[themeSelector.selectedIndex].parentNode;
const lineNumbers = document.querySelectorAll('.line-number');
const root = document.documentElement;
if (optGroup.label === 'Dark') {
root.style.setProperty('--border-thickness', '0px');
for (let i = 0; i < lineNumbers.length; i++) {
lineNumbers[i].style.backgroundColor = '#353b48';
lineNumbers[i].style.color = '#dfe6e9';
}
} else {
root.style.setProperty('--border-thickness', '1px');
for (let i = 0; i < lineNumbers.length; i++) {
lineNumbers[i].style.backgroundColor = '#dcdde1';
lineNumbers[i].style.color = '#2d3436';

31
styles.css
View File

@@ -3,6 +3,10 @@ body {
margin: 0px;
}
:root {
--border-thickness: 1px;
}
select {
padding: 6px;
border-radius: 5px;
@@ -58,7 +62,6 @@ button:active {
background-color: #0077b6;
}
textarea {
padding: 10px;
margin-top: 20px;
@@ -85,31 +88,32 @@ pre {
#code-container {
margin: 0;
border-radius: 5px;
max-width: 100%;
}
#code-container .code-line:first-of-type .line-number {
padding-top: 10px;
border-top-left-radius: 10px;
padding-top: 11px;
}
#code-container .code-line:last-of-type .line-number {
padding-bottom: 10px;
border-bottom-left-radius: 10px;
padding-bottom: 11px;
}
#code-container .code-line:first-of-type #code {
padding-top: 10px;
border-top-right-radius: 10px;
border-top: var(--border-thickness) solid #c9d1d9;
}
#code-container .code-line:last-of-type #code {
padding-bottom: 10px;
border-bottom-right-radius: 10px;
border-bottom: var(--border-thickness) solid #c9d1d9;
}
#code {
font-size: 14px;
border: none;
border-right: var(--border-thickness) solid #c9d1d9;
font-family: 'Fira Code', monospace;
white-space: pre-wrap;
padding: 0px 11px;
@@ -155,7 +159,7 @@ a {
@media print {
body {
color-adjust: exact;
print-color-adjust: exact;
-webkit-print-color-adjust: exact;
}
@@ -195,6 +199,7 @@ p {
::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
@@ -204,3 +209,13 @@ p {
::-webkit-scrollbar-thumb:hover {
background: #555;
}
textarea::-webkit-scrollbar-thumb {
border-radius: 4px;
}