Changes to backend and tabs UI
This commit is contained in:
@ -1,3 +1,5 @@
|
|||||||
|
|
||||||
|
/* ACCORDION */
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
// Find all elements with the class "lcp-accordion"
|
// Find all elements with the class "lcp-accordion"
|
||||||
var accordions = document.querySelectorAll('.lcp-accordion');
|
var accordions = document.querySelectorAll('.lcp-accordion');
|
||||||
@ -31,31 +33,64 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/* TABS */
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
const tabs = document.querySelectorAll('.tab-link');
|
const tabs = document.querySelectorAll('.tab-link');
|
||||||
const panes = document.querySelectorAll('.tab-pane');
|
const panes = document.querySelectorAll('.tab-pane');
|
||||||
|
const tabContainer = document.querySelector('.lcp-tab-container'); // The parent container
|
||||||
|
|
||||||
tabs.forEach(tab => {
|
// Only enable the hash functionality if the container has the class '.lcp-support-hash'
|
||||||
tab.addEventListener('click', function (event) {
|
if (tabContainer && tabContainer.classList.contains('lcp-support-hash')) {
|
||||||
event.preventDefault();
|
|
||||||
|
// Function to set the active tab based on the hash in the URL
|
||||||
|
function setActiveTabFromHash() {
|
||||||
|
const hash = window.location.hash; // Get the current URL hash
|
||||||
|
if (hash) {
|
||||||
|
const targetTab = document.querySelector(`.tab-link[data-tab="${hash.substring(1)}"]`); // Remove '#' from hash
|
||||||
|
const targetPane = document.getElementById(hash.substring(1));
|
||||||
|
|
||||||
// Remove active class from all tabs and panes
|
// If both tab and pane exist, make them active
|
||||||
tabs.forEach(link => link.classList.remove('active'));
|
if (targetTab && targetPane) {
|
||||||
panes.forEach(pane => pane.classList.remove('active'));
|
tabs.forEach(link => link.classList.remove('active'));
|
||||||
|
panes.forEach(pane => pane.classList.remove('active'));
|
||||||
|
|
||||||
// Add active class to the clicked tab
|
targetTab.classList.add('active');
|
||||||
tab.classList.add('active');
|
targetPane.classList.add('active');
|
||||||
|
} else {
|
||||||
// Get the target pane
|
console.error(`Tab or pane with ID '${hash}' not found.`);
|
||||||
const targetPaneId = tab.dataset.tab;
|
}
|
||||||
const targetPane = document.getElementById(targetPaneId);
|
|
||||||
|
|
||||||
// Check if targetPane exists before trying to manipulate it
|
|
||||||
if (targetPane) {
|
|
||||||
targetPane.classList.add('active');
|
|
||||||
} else {
|
|
||||||
console.error(`Tab pane with ID '${targetPaneId}' not found.`);
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set the active tab from the hash when the page loads
|
||||||
|
setActiveTabFromHash();
|
||||||
|
}
|
||||||
|
// Handle tab clicks
|
||||||
|
tabs.forEach(tab => {
|
||||||
|
tab.addEventListener('click', function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
// Remove active class from all tabs and panes
|
||||||
|
tabs.forEach(link => link.classList.remove('active'));
|
||||||
|
panes.forEach(pane => pane.classList.remove('active'));
|
||||||
|
|
||||||
|
// Add active class to the clicked tab
|
||||||
|
tab.classList.add('active');
|
||||||
|
|
||||||
|
// Get the target pane and update URL hash
|
||||||
|
const targetPaneId = tab.dataset.tab;
|
||||||
|
const targetPane = document.getElementById(targetPaneId);
|
||||||
|
|
||||||
|
// Check if targetPane exists before trying to manipulate it
|
||||||
|
if (targetPane) {
|
||||||
|
targetPane.classList.add('active');
|
||||||
|
if (tabContainer && tabContainer.classList.contains('lcp-support-hash')){
|
||||||
|
window.location.hash = targetPaneId; // Update the URL hash
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.error(`Tab pane with ID '${targetPaneId}' not found.`);
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|||||||
@ -89,7 +89,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Add debounced scroll event listener
|
// Add debounced scroll event listener
|
||||||
window.addEventListener('scroll', debounce(handleScroll, 20)); // 200ms debounce
|
window.addEventListener('scroll', debounce(handleScroll, 0)); // 200ms debounce
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -170,32 +170,6 @@ function drop_lcp_icons_table() {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* BACKEND ICON ADDER */
|
|
||||||
// Register the dashboard page in the admin menu
|
|
||||||
function lcp_register_dashboard_page() {
|
|
||||||
add_menu_page(
|
|
||||||
'Icon Management', // Page Title
|
|
||||||
'Icon Management', // Menu Title
|
|
||||||
'manage_options', // Capability
|
|
||||||
'icon-management', // Menu Slug
|
|
||||||
'lcp_dashboard_page', // Callback function
|
|
||||||
'dashicons-images-alt2', // Icon for the menu item
|
|
||||||
60 // Position
|
|
||||||
);
|
|
||||||
}
|
|
||||||
add_action('admin_menu', 'lcp_register_dashboard_page');
|
|
||||||
|
|
||||||
// Callback function to display the dashboard page content
|
|
||||||
function lcp_dashboard_page() {
|
|
||||||
?>
|
|
||||||
<div class="wrap">
|
|
||||||
<h1><?php esc_html_e('Icon Management Dashboard', 'lcp'); ?></h1>
|
|
||||||
<div id="icon-dashboard-container">
|
|
||||||
<?php lcp_display_icon_sets(); ?>
|
|
||||||
</div> <!-- This will be populated by PHP -->
|
|
||||||
</div>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to read and display icon sets from the JSON file
|
// Function to read and display icon sets from the JSON file
|
||||||
// Function to read and display icon sets from the JSON file
|
// Function to read and display icon sets from the JSON file
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<?php return array('dependencies' => array('react', 'react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => '00e12da1bdf9e61c448a');
|
<?php return array('dependencies' => array('react', 'react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => 'eca736ee702435b6a2ff');
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@ -10,26 +10,26 @@ export default function save(props) {
|
|||||||
// Conditionally render the link or button based on buttonAction
|
// Conditionally render the link or button based on buttonAction
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div {...blockProps}>
|
<>
|
||||||
{buttonAction === 'customUrl' ? (
|
{buttonAction === 'customUrl' ? (
|
||||||
<a href={customUrl} className="lcp-button" style={{ padding: buttonPadding || '10px' }}>
|
<a href={customUrl} className="lcp-button" style={{ padding: buttonPadding || '10px' }}>
|
||||||
{displayIcon && iconSvgPath && (
|
{displayIcon && iconSvgPath && (
|
||||||
<svg style={{ height: iconHeight }} className="lcp-icon" xmlns="http://www.w3.org/2000/svg" viewBox={iconSvgViewbox || "0 0 576 576"} dangerouslySetInnerHTML={{ __html: iconSvgPath }} />
|
<svg style={{ height: iconHeight }} className="lcp-icon" xmlns="http://www.w3.org/2000/svg" viewBox={iconSvgViewbox || "0 0 576 576"} dangerouslySetInnerHTML={{ __html: iconSvgPath }} />
|
||||||
)}
|
)}
|
||||||
<span className="lcp-button-text">
|
<span className="lcp-button-text">
|
||||||
{buttonText || 'Button'}
|
{buttonText || 'Button'}
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
) : (
|
) : (
|
||||||
<button className="lcp-button" style={{ padding: buttonPadding || '10px' }}>
|
<button className="lcp-button" style={{ padding: buttonPadding || '10px' }}>
|
||||||
{displayIcon && iconSvgPath && (
|
{displayIcon && iconSvgPath && (
|
||||||
<svg style={{ height: iconHeight }} className="lcp-icon" xmlns="http://www.w3.org/2000/svg" viewBox={iconSvgViewbox || "0 0 576 576"} dangerouslySetInnerHTML={{ __html: iconSvgPath }} />
|
<svg style={{ height: iconHeight }} className="lcp-icon" xmlns="http://www.w3.org/2000/svg" viewBox={iconSvgViewbox || "0 0 576 576"} dangerouslySetInnerHTML={{ __html: iconSvgPath }} />
|
||||||
)}
|
)}
|
||||||
<span className="lcp-button-text">
|
<span className="lcp-button-text">
|
||||||
{buttonText || 'Button'}
|
{buttonText || 'Button'}
|
||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n'), 'version' => 'e74f7d37dca7635e59f9');
|
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n'), 'version' => '7b19c7f88a697fc64c09');
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
(()=>{"use strict";var e,n={998:()=>{const e=window.wp.blocks,n=window.wp.i18n,t=window.wp.blockEditor,r=window.wp.components,i=window.ReactJSXRuntime,s=JSON.parse('{"UU":"lcp/main-area"}');(0,e.registerBlockType)(s.UU,{edit:function(e){const{attributes:s,setAttributes:a}=e,{maxWidth:o="100%",expandVertical:l=!0}=s,c=(0,t.useBlockProps)(),p=(0,t.useInnerBlocksProps)(c);return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.InspectorControls,{children:(0,i.jsx)(r.PanelBody,{title:(0,n.__)("Max Width Settings","lcp"),initialOpen:!0,children:(0,i.jsxs)("div",{className:"max-width-settings",children:[(0,i.jsx)(r.__experimentalUnitControl,{onChange:e=>{a({maxWidth:e})},value:o,defaultUnit:"px"}),(0,i.jsx)(r.ToggleControl,{label:(0,n.__)("Enable Vertical Expansion","lcp"),checked:l,onChange:e=>{a({expandVertical:e})}})]})})}),(0,i.jsx)("div",{...p,id:"lcp-main-container",style:{minHeight:"200px"},children:(0,i.jsx)(t.InnerBlocks,{...p})})]})},save:function({attributes:e}){const{maxWidth:n="100%",expandVertical:r}=e,s=t.useBlockProps.save(),a=r?`${s.className} lcp-grow-vertical`:s.className,o={maxWidth:n};return(0,i.jsx)("div",{...s,id:"lcp-main-container",className:a,style:o,children:(0,i.jsx)(t.InnerBlocks.Content,{})})}})}},t={};function r(e){var i=t[e];if(void 0!==i)return i.exports;var s=t[e]={exports:{}};return n[e](s,s.exports,r),s.exports}r.m=n,e=[],r.O=(n,t,i,s)=>{if(!t){var a=1/0;for(p=0;p<e.length;p++){t=e[p][0],i=e[p][1],s=e[p][2];for(var o=!0,l=0;l<t.length;l++)(!1&s||a>=s)&&Object.keys(r.O).every((e=>r.O[e](t[l])))?t.splice(l--,1):(o=!1,s<a&&(a=s));if(o){e.splice(p--,1);var c=i();void 0!==c&&(n=c)}}return n}s=s||0;for(var p=e.length;p>0&&e[p-1][2]>s;p--)e[p]=e[p-1];e[p]=[t,i,s]},r.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={57:0,350:0};r.O.j=n=>0===e[n];var n=(n,t)=>{var i,s,a=t[0],o=t[1],l=t[2],c=0;if(a.some((n=>0!==e[n]))){for(i in o)r.o(o,i)&&(r.m[i]=o[i]);if(l)var p=l(r)}for(n&&n(t);c<a.length;c++)s=a[c],r.o(e,s)&&e[s]&&e[s][0](),e[s]=0;return r.O(p)},t=self.webpackChunklcp_viewport=self.webpackChunklcp_viewport||[];t.forEach(n.bind(null,0)),t.push=n.bind(null,t.push.bind(t))})();var i=r.O(void 0,[350],(()=>r(998)));i=r.O(i)})();
|
(()=>{"use strict";var e,n={998:()=>{const e=window.wp.blocks,n=window.wp.i18n,t=window.wp.blockEditor,i=window.wp.components,r=window.ReactJSXRuntime,s=JSON.parse('{"UU":"lcp/main-area"}');(0,e.registerBlockType)(s.UU,{edit:function(e){const{attributes:s,setAttributes:a}=e,{maxWidth:o="100%",expandVertical:l=!0}=s,c=(0,t.useBlockProps)(),p=(0,t.useInnerBlocksProps)(c);return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(t.InspectorControls,{children:(0,r.jsx)(i.PanelBody,{title:(0,n.__)("Max Width Settings","lcp"),initialOpen:!0,children:(0,r.jsxs)("div",{className:"max-width-settings",children:[(0,r.jsx)(i.__experimentalUnitControl,{onChange:e=>{a({maxWidth:e})},value:o,defaultUnit:"px"}),(0,r.jsx)(i.ToggleControl,{label:(0,n.__)("Enable Vertical Expansion","lcp"),checked:l,onChange:e=>{a({expandVertical:e})}})]})})}),(0,r.jsx)("div",{...p,id:"lcp-main-container",style:{minHeight:"200px"},children:(0,r.jsx)(t.InnerBlocks,{...p})})]})},save:function({attributes:e}){const{maxWidth:n="100%",expandVertical:i}=e,s=t.useBlockProps.save(),a=i?`${s.className} lcp-grow-vertical`:s.className,o={maxWidth:n};return(0,r.jsx)("div",{...s,id:"lcp-main-container",className:a,style:o,children:(0,r.jsx)("div",{id:"lcp-main-container-inner",children:(0,r.jsx)(t.InnerBlocks.Content,{})})})}})}},t={};function i(e){var r=t[e];if(void 0!==r)return r.exports;var s=t[e]={exports:{}};return n[e](s,s.exports,i),s.exports}i.m=n,e=[],i.O=(n,t,r,s)=>{if(!t){var a=1/0;for(p=0;p<e.length;p++){t=e[p][0],r=e[p][1],s=e[p][2];for(var o=!0,l=0;l<t.length;l++)(!1&s||a>=s)&&Object.keys(i.O).every((e=>i.O[e](t[l])))?t.splice(l--,1):(o=!1,s<a&&(a=s));if(o){e.splice(p--,1);var c=r();void 0!==c&&(n=c)}}return n}s=s||0;for(var p=e.length;p>0&&e[p-1][2]>s;p--)e[p]=e[p-1];e[p]=[t,r,s]},i.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={57:0,350:0};i.O.j=n=>0===e[n];var n=(n,t)=>{var r,s,a=t[0],o=t[1],l=t[2],c=0;if(a.some((n=>0!==e[n]))){for(r in o)i.o(o,r)&&(i.m[r]=o[r]);if(l)var p=l(i)}for(n&&n(t);c<a.length;c++)s=a[c],i.o(e,s)&&e[s]&&e[s][0](),e[s]=0;return i.O(p)},t=self.webpackChunklcp_viewport=self.webpackChunklcp_viewport||[];t.forEach(n.bind(null,0)),t.push=n.bind(null,t.push.bind(t))})();var r=i.O(void 0,[350],(()=>i(998)));r=i.O(r)})();
|
||||||
@ -16,7 +16,9 @@ export default function Save( { attributes } ) {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div {...blockProps} id="lcp-main-container" className={className} style={style}>
|
<div {...blockProps} id="lcp-main-container" className={className} style={style}>
|
||||||
<InnerBlocks.Content />
|
<div id="lcp-main-container-inner">
|
||||||
|
<InnerBlocks.Content />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '9fbf94ac3507c2365b0a');
|
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => 'e510dd9214b81b305e13');
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
(()=>{"use strict";var e,n={650:()=>{const e=window.wp.blocks,n=(window.wp.i18n,window.wp.blockEditor),r=window.ReactJSXRuntime,o=JSON.parse('{"UU":"lcp/sidecontent"}');(0,e.registerBlockType)(o.UU,{edit:function(){return(0,n.useBlockProps)(),(0,r.jsx)("div",{...n.useBlockProps,children:(0,r.jsx)("div",{id:"lcp-sidecontent",children:(0,r.jsx)(n.InnerBlocks,{renderAppender:()=>(0,r.jsx)(n.InnerBlocks.ButtonBlockAppender,{})})})})},save:function(){const e=n.useBlockProps.save();return(0,r.jsx)("div",{...e,id:"lcp-sidecontent",children:(0,r.jsx)(n.InnerBlocks.Content,{})})}})}},r={};function o(e){var t=r[e];if(void 0!==t)return t.exports;var s=r[e]={exports:{}};return n[e](s,s.exports,o),s.exports}o.m=n,e=[],o.O=(n,r,t,s)=>{if(!r){var i=1/0;for(d=0;d<e.length;d++){r=e[d][0],t=e[d][1],s=e[d][2];for(var c=!0,l=0;l<r.length;l++)(!1&s||i>=s)&&Object.keys(o.O).every((e=>o.O[e](r[l])))?r.splice(l--,1):(c=!1,s<i&&(i=s));if(c){e.splice(d--,1);var p=t();void 0!==p&&(n=p)}}return n}s=s||0;for(var d=e.length;d>0&&e[d-1][2]>s;d--)e[d]=e[d-1];e[d]=[r,t,s]},o.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={57:0,350:0};o.O.j=n=>0===e[n];var n=(n,r)=>{var t,s,i=r[0],c=r[1],l=r[2],p=0;if(i.some((n=>0!==e[n]))){for(t in c)o.o(c,t)&&(o.m[t]=c[t]);if(l)var d=l(o)}for(n&&n(r);p<i.length;p++)s=i[p],o.o(e,s)&&e[s]&&e[s][0](),e[s]=0;return o.O(d)},r=self.webpackChunklcp_sidecontent=self.webpackChunklcp_sidecontent||[];r.forEach(n.bind(null,0)),r.push=n.bind(null,r.push.bind(r))})();var t=o.O(void 0,[350],(()=>o(650)));t=o.O(t)})();
|
(()=>{"use strict";var e,n={650:()=>{const e=window.wp.blocks,n=(window.wp.i18n,window.wp.blockEditor),r=window.ReactJSXRuntime,o=JSON.parse('{"UU":"lcp/sidecontent"}');(0,e.registerBlockType)(o.UU,{edit:function(){return(0,n.useBlockProps)(),(0,r.jsx)("div",{...n.useBlockProps,children:(0,r.jsx)("div",{id:"lcp-sidecontent",children:(0,r.jsx)(n.InnerBlocks,{renderAppender:()=>(0,r.jsx)(n.InnerBlocks.ButtonBlockAppender,{})})})})},save:function(){const e=n.useBlockProps.save();return(0,r.jsx)("div",{...e,id:"lcp-sidecontent",children:(0,r.jsx)("div",{id:"lcp-sidecontent-inner",children:(0,r.jsx)(n.InnerBlocks.Content,{})})})}})}},r={};function o(e){var t=r[e];if(void 0!==t)return t.exports;var i=r[e]={exports:{}};return n[e](i,i.exports,o),i.exports}o.m=n,e=[],o.O=(n,r,t,i)=>{if(!r){var s=1/0;for(p=0;p<e.length;p++){r=e[p][0],t=e[p][1],i=e[p][2];for(var c=!0,l=0;l<r.length;l++)(!1&i||s>=i)&&Object.keys(o.O).every((e=>o.O[e](r[l])))?r.splice(l--,1):(c=!1,i<s&&(s=i));if(c){e.splice(p--,1);var d=t();void 0!==d&&(n=d)}}return n}i=i||0;for(var p=e.length;p>0&&e[p-1][2]>i;p--)e[p]=e[p-1];e[p]=[r,t,i]},o.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={57:0,350:0};o.O.j=n=>0===e[n];var n=(n,r)=>{var t,i,s=r[0],c=r[1],l=r[2],d=0;if(s.some((n=>0!==e[n]))){for(t in c)o.o(c,t)&&(o.m[t]=c[t]);if(l)var p=l(o)}for(n&&n(r);d<s.length;d++)i=s[d],o.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return o.O(p)},r=self.webpackChunklcp_sidecontent=self.webpackChunklcp_sidecontent||[];r.forEach(n.bind(null,0)),r.push=n.bind(null,r.push.bind(r))})();var t=o.O(void 0,[350],(()=>o(650)));t=o.O(t)})();
|
||||||
@ -20,11 +20,12 @@ export default function Save() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div {...blockProps} id="lcp-sidecontent">
|
<div {...blockProps} id="lcp-sidecontent">
|
||||||
|
<div id="lcp-sidecontent-inner">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<InnerBlocks.Content />
|
<InnerBlocks.Content />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -241,7 +241,7 @@ function render_lcp_theme_settings_page() {
|
|||||||
<h1>Theme Settings</h1>
|
<h1>Theme Settings</h1>
|
||||||
|
|
||||||
<!-- Tab Structure -->
|
<!-- Tab Structure -->
|
||||||
<div class="tab-container">
|
<div class="lcp-tab-container lcp-support-hash">
|
||||||
<!-- Tabs -->
|
<!-- Tabs -->
|
||||||
<ul class="tabs">
|
<ul class="tabs">
|
||||||
<li class="tab-link active" data-tab="custom-meta">Custom Meta</li>
|
<li class="tab-link active" data-tab="custom-meta">Custom Meta</li>
|
||||||
|
|||||||
36
style.css
36
style.css
@ -41,7 +41,7 @@ Version: 0.0.1
|
|||||||
|
|
||||||
|
|
||||||
/* Main Content */
|
/* Main Content */
|
||||||
.lcp-has-sidecontent #lcp-main-container > * > *{ padding:20px
|
.lcp-has-sidecontent #lcp-main-container > *{ padding-left:40px
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -53,15 +53,23 @@ Version: 0.0.1
|
|||||||
overflow:auto;
|
overflow:auto;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
|
||||||
width: 340px;
|
width: 340px;
|
||||||
height: 100%;
|
height: calc(100vh - var(--lcp--header--height));
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border-right: 2px solid #eee;
|
border-right: 2px solid #eee;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
outline: 0;
|
outline: 0;
|
||||||
}
|
|
||||||
|
|
||||||
|
}
|
||||||
|
#lcp-sidecontent #lcp-sidecontent-inner {
|
||||||
|
padding:10px
|
||||||
|
}
|
||||||
|
.admin-bar #lcp-sidecontent {
|
||||||
|
height:calc(100vh - var(--lcp--header--height) - 32px)
|
||||||
|
}
|
||||||
|
#lcp-sidecontent:not(.lcp-fixed) {
|
||||||
|
top:0
|
||||||
|
}
|
||||||
#lcp-viewport-outer.lcp-has-sticky-header #lcp-sidecontent {
|
#lcp-viewport-outer.lcp-has-sticky-header #lcp-sidecontent {
|
||||||
top: var(--lcp--header--height);
|
top: var(--lcp--header--height);
|
||||||
position:fixed!important;
|
position:fixed!important;
|
||||||
@ -116,10 +124,10 @@ Version: 0.0.1
|
|||||||
width: 100%
|
width: 100%
|
||||||
}
|
}
|
||||||
#lcp-sidecontent {top:var(--lcp---header--height)}
|
#lcp-sidecontent {top:var(--lcp---header--height)}
|
||||||
#lcp-sidecontent {
|
#lcp-sidecontent:not(.lcp-fixed) {
|
||||||
top: calc(var(--lcp--header--height) );
|
top: calc(var(--lcp--header--height) );
|
||||||
}
|
}
|
||||||
.admin-bar #lcp-sidecontent.lcp-fixed {
|
#lcp-viewport-outer:not(.lcp-has-sticky-header).admin-bar #lcp-sidecontent.lcp-fixed {
|
||||||
top: calc(var(--lcp--header--height) + 32px);
|
top: calc(var(--lcp--header--height) + 32px);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -130,7 +138,12 @@ Version: 0.0.1
|
|||||||
right: 0;
|
right: 0;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
|
#lcp-header-sidecontent.lcp-fixed {
|
||||||
|
height:100vh
|
||||||
|
}
|
||||||
|
.admin-bar #lcp-sidecontent.lcp-fixed {
|
||||||
|
height:calc(100vh - 32px)
|
||||||
|
}
|
||||||
#lcp-header-container.lcp-sticky-on-scroll.lcp-fixed {
|
#lcp-header-container.lcp-sticky-on-scroll.lcp-fixed {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top:32px;
|
top:32px;
|
||||||
@ -306,3 +319,12 @@ Version: 0.0.1
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
#lcp-sidecontent {
|
||||||
|
overflow: scroll;
|
||||||
|
scrollbar-color: red orange;
|
||||||
|
scrollbar-width: thin;
|
||||||
|
border-radius:5px
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@ -5,6 +5,7 @@
|
|||||||
|
|
||||||
],
|
],
|
||||||
"settings": {
|
"settings": {
|
||||||
|
|
||||||
"appearanceTools": true,
|
"appearanceTools": true,
|
||||||
"color": {
|
"color": {
|
||||||
"defaultDuotone": false,
|
"defaultDuotone": false,
|
||||||
|
|||||||
Reference in New Issue
Block a user