open-webui/backend/open_webui/static/assets/pdf-style.css

320 lines
5.8 KiB
CSS
Raw Normal View History

2024-10-12 16:12:31 +00:00
/* HTML and Body */
2024-10-13 07:05:28 +00:00
@font-face {
font-family: 'NotoSans';
src: url('fonts/NotoSans-Variable.ttf');
}
@font-face {
font-family: 'NotoSansJP';
src: url('fonts/NotoSansJP-Variable.ttf');
}
@font-face {
font-family: 'NotoSansKR';
src: url('fonts/NotoSansKR-Variable.ttf');
}
@font-face {
font-family: 'NotoSansSC';
src: url('fonts/NotoSansSC-Variable.ttf');
}
@font-face {
font-family: 'NotoSansSC-Regular';
src: url('fonts/NotoSansSC-Regular.ttf');
}
2024-10-12 16:12:31 +00:00
html {
2024-10-13 07:05:28 +00:00
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'NotoSans', 'NotoSansJP', 'NotoSansKR',
'NotoSansSC', 'STSong-Light', 'MSung-Light', 'HeiseiMin-W3', 'HYSMyeongJo-Medium', Roboto,
'Helvetica Neue', Arial, sans-serif;
font-size: 14px; /* Default font size */
line-height: 1.5;
2024-10-12 16:12:31 +00:00
}
2024-10-13 07:05:28 +00:00
*,
*::before,
*::after {
box-sizing: inherit;
2024-10-12 16:12:31 +00:00
}
body {
2024-10-13 07:05:28 +00:00
margin: 0;
color: #212529;
background-color: #fff;
width: auto;
2024-10-12 16:12:31 +00:00
}
/* Typography */
2024-10-13 07:05:28 +00:00
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 500;
margin: 0;
2024-10-12 16:12:31 +00:00
}
h1 {
2024-10-13 07:05:28 +00:00
font-size: 2.5rem;
2024-10-12 16:12:31 +00:00
}
h2 {
2024-10-13 07:05:28 +00:00
font-size: 2rem;
2024-10-12 16:12:31 +00:00
}
h3 {
2024-10-13 07:05:28 +00:00
font-size: 1.75rem;
2024-10-12 16:12:31 +00:00
}
h4 {
2024-10-13 07:05:28 +00:00
font-size: 1.5rem;
2024-10-12 16:12:31 +00:00
}
h5 {
2024-10-13 07:05:28 +00:00
font-size: 1.25rem;
2024-10-12 16:12:31 +00:00
}
h6 {
2024-10-13 07:05:28 +00:00
font-size: 1rem;
2024-10-12 16:12:31 +00:00
}
p {
2024-10-13 07:05:28 +00:00
margin-top: 0;
margin-bottom: 1rem;
2024-10-12 16:12:31 +00:00
}
/* Grid System */
.container {
2024-10-13 07:05:28 +00:00
width: 100%;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
2024-10-12 16:12:31 +00:00
}
/* Utilities */
.text-center {
2024-10-13 07:05:28 +00:00
text-align: center;
2024-10-12 16:12:31 +00:00
}
/* Additional Text Utilities */
.text-muted {
2024-10-13 07:05:28 +00:00
color: #6c757d; /* Muted text color */
2024-10-12 16:12:31 +00:00
}
/* Small Text */
small {
2024-10-13 07:05:28 +00:00
font-size: 80%; /* Smaller font size relative to the base */
color: #6c757d; /* Lighter text color for secondary information */
margin-bottom: 0;
margin-top: 0;
2024-10-12 16:12:31 +00:00
}
/* Strong Element Styles */
strong {
2024-10-13 07:05:28 +00:00
font-weight: bolder; /* Ensures the text is bold */
color: inherit; /* Inherits the color from its parent element */
2024-10-12 16:12:31 +00:00
}
/* link */
a {
2024-10-13 07:05:28 +00:00
color: #007bff;
text-decoration: none;
background-color: transparent;
2024-10-12 16:12:31 +00:00
}
a:hover {
2024-10-13 07:05:28 +00:00
color: #0056b3;
text-decoration: underline;
2024-10-12 16:12:31 +00:00
}
/* General styles for lists */
2024-10-13 07:05:28 +00:00
ol,
ul,
li {
padding-left: 40px; /* Increase padding to move bullet points to the right */
margin-left: 20px; /* Indent lists from the left */
2024-10-12 16:12:31 +00:00
}
/* Ordered list styles */
ol {
2024-10-13 07:05:28 +00:00
list-style-type: decimal; /* Use numbers for ordered lists */
margin-bottom: 10px; /* Space after each list */
2024-10-12 16:12:31 +00:00
}
ol li {
2024-10-13 07:05:28 +00:00
margin-bottom: 0.5rem; /* Space between ordered list items */
2024-10-12 16:12:31 +00:00
}
/* Unordered list styles */
ul {
2024-10-13 07:05:28 +00:00
list-style-type: disc; /* Use bullets for unordered lists */
margin-bottom: 10px; /* Space after each list */
2024-10-12 16:12:31 +00:00
}
ul li {
2024-10-13 07:05:28 +00:00
margin-bottom: 0.5rem; /* Space between unordered list items */
2024-10-12 16:12:31 +00:00
}
/* List item styles */
li {
2024-10-13 07:05:28 +00:00
margin-bottom: 5px; /* Space between list items */
line-height: 1.5; /* Line height for better readability */
2024-10-12 16:12:31 +00:00
}
/* Nested lists */
2024-10-13 07:05:28 +00:00
ol ol,
ol ul,
ul ol,
ul ul {
padding-left: 20px;
margin-left: 30px; /* Further indent nested lists */
margin-bottom: 0; /* Remove extra margin at the bottom of nested lists */
2024-10-12 16:12:31 +00:00
}
/* Code blocks */
pre {
2024-10-13 07:05:28 +00:00
background-color: #f4f4f4;
padding: 10px;
overflow-x: auto;
max-width: 100%; /* Ensure it doesn't overflow the page */
width: 80%; /* Set a specific width for a container-like appearance */
margin: 0 1em; /* Center the pre block */
box-sizing: border-box; /* Include padding in the width */
border: 1px solid #ccc; /* Optional: Add a border for better definition */
border-radius: 4px; /* Optional: Add rounded corners */
2024-10-12 16:12:31 +00:00
}
code {
2024-10-13 07:05:28 +00:00
font-family: 'Courier New', Courier, monospace;
background-color: #f4f4f4;
padding: 2px 4px;
border-radius: 4px;
box-sizing: border-box; /* Include padding in the width */
2024-10-12 16:12:31 +00:00
}
.message {
2024-10-13 07:05:28 +00:00
margin-top: 8px;
margin-bottom: 8px;
max-width: 100%;
overflow-wrap: break-word;
2024-10-12 16:12:31 +00:00
}
/* Table Styles */
table {
2024-10-13 07:05:28 +00:00
width: 100%;
margin-bottom: 1rem;
color: #212529;
border-collapse: collapse; /* Removes the space between borders */
2024-10-12 16:12:31 +00:00
}
2024-10-13 07:05:28 +00:00
th,
td {
margin: 0;
padding: 0.75rem;
vertical-align: top;
border-top: 1px solid #dee2e6;
2024-10-12 16:12:31 +00:00
}
thead th {
2024-10-13 07:05:28 +00:00
vertical-align: bottom;
border-bottom: 2px solid #dee2e6;
2024-10-12 16:12:31 +00:00
}
tbody + tbody {
2024-10-13 07:05:28 +00:00
border-top: 2px solid #dee2e6;
2024-10-12 16:12:31 +00:00
}
/* markdown-section styles */
.markdown-section blockquote,
.markdown-section h1,
.markdown-section h2,
.markdown-section h3,
.markdown-section h4,
.markdown-section h5,
.markdown-section h6,
.markdown-section p,
.markdown-section pre,
.markdown-section table,
.markdown-section ul {
2024-10-13 07:05:28 +00:00
/* Give most block elements margin top and bottom */
margin-top: 1rem;
2024-10-12 16:12:31 +00:00
}
/* Remove top margin if it's the first child */
.markdown-section blockquote:first-child,
.markdown-section h1:first-child,
.markdown-section h2:first-child,
.markdown-section h3:first-child,
.markdown-section h4:first-child,
.markdown-section h5:first-child,
.markdown-section h6:first-child,
.markdown-section p:first-child,
.markdown-section pre:first-child,
.markdown-section table:first-child,
.markdown-section ul:first-child {
2024-10-13 07:05:28 +00:00
margin-top: 0;
2024-10-12 16:12:31 +00:00
}
/* Remove top margin of <ul> following a <p> */
.markdown-section p + ul {
2024-10-13 07:05:28 +00:00
margin-top: 0;
2024-10-12 16:12:31 +00:00
}
/* Remove bottom margin of <p> if it is followed by a <ul> */
/* Note: :has is not supported in CSS, so you would need JavaScript for this behavior */
.markdown-section p {
2024-10-13 07:05:28 +00:00
margin-bottom: 0;
2024-10-12 16:12:31 +00:00
}
/* Add a rule to reset margin-bottom for <p> not followed by <ul> */
.markdown-section p + ul {
2024-10-13 07:05:28 +00:00
margin-top: 0;
2024-10-12 16:12:31 +00:00
}
/* List item styles */
.markdown-section li {
2024-10-13 07:05:28 +00:00
padding: 2px;
2024-10-12 16:12:31 +00:00
}
.markdown-section li p {
2024-10-13 07:05:28 +00:00
margin-bottom: 0;
padding: 0;
2024-10-12 16:12:31 +00:00
}
/* Avoid margins for nested lists */
.markdown-section li > ul {
2024-10-13 07:05:28 +00:00
margin-top: 0;
margin-bottom: 0;
2024-10-12 16:12:31 +00:00
}
/* Table styles */
.markdown-section table {
2024-10-13 07:05:28 +00:00
width: 100%;
border-collapse: collapse;
margin: 1rem 0;
2024-10-12 16:12:31 +00:00
}
.markdown-section th,
.markdown-section td {
2024-10-13 07:05:28 +00:00
border: 1px solid #ddd;
padding: 0.5rem;
text-align: left;
2024-10-12 16:12:31 +00:00
}
.markdown-section th {
2024-10-13 07:05:28 +00:00
background-color: #f2f2f2;
2024-10-12 16:12:31 +00:00
}
.markdown-section pre {
2024-10-13 07:05:28 +00:00
padding: 10px;
margin: 10px;
2024-10-12 16:12:31 +00:00
}
.markdown-section pre code {
2024-10-13 07:05:28 +00:00
position: relative;
color: rgb(172, 0, 95);
2024-10-12 16:12:31 +00:00
}