feat: add native code block feature and optimize asset loading
- Implemented custom code block system with Prism.js highlighting (YAML) - Added Gutenberg block with modal editor for better handling of large code snippets - Added Classic Editor button with dialog for structured code input - Implemented copy-to-clipboard functionality with hover-based UI - Introduced dedicated styling (code.css) Performance improvements: - Load Prism.js and code block assets only when a code block is present - Reduced unnecessary JS and CSS on pages without code snippets - Improved overall frontend performance and resource efficiency UI/UX improvements: - Adapted code block styling to match theme design (rectangular layout, accent border, integrated color scheme) - Refactored sidebar search styling for consistent appearance - Removed conflicting wrapper borders causing double border rendering - Applied single-border input pattern with clean focus state - Fixed invalid CSS !important syntax issues - Aligned search input design with comments and code block components Result: - Cleaner UI with consistent component styling - Improved performance through conditional asset loading - Better authoring experience for structured YAML content
This commit is contained in:
+16
-4
@@ -9,20 +9,32 @@
|
||||
Code block wrapper
|
||||
------------------------------------------------------------------------- */
|
||||
|
||||
/* -------------------------------------------------------------------------
|
||||
Code block wrapper
|
||||
------------------------------------------------------------------------- */
|
||||
|
||||
.ztfr-code {
|
||||
position: relative;
|
||||
|
||||
background-color: var(--footer-color);
|
||||
color: var(--light-color);
|
||||
padding: 1.1rem 1.2rem;
|
||||
|
||||
padding: 1rem 1.2rem;
|
||||
margin: 1rem 0;
|
||||
border-radius: 6px;
|
||||
|
||||
border-radius: 0;
|
||||
border: 1px solid rgba(248, 248, 242, 0.08);
|
||||
border-left: 4px solid var(--hover-color);
|
||||
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
|
||||
font-family: var(--secondary-font);
|
||||
font-size: 0.870rem;
|
||||
font-size: 0.85rem;
|
||||
line-height: 1.6;
|
||||
font-weight: 400;
|
||||
border: 1px solid rgba(248, 248, 242, 0.08);
|
||||
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* -------------------------------------------------------------------------
|
||||
|
||||
Reference in New Issue
Block a user