/* Dianalund CPT Display Block Styles */
.dianalund-cpt-display {
border: 1px solid #ddd;
padding: 20px;
border-radius: 8px;
text-align: center;
max-width: 300px;
margin: 0 auto;
background-color: #fff;
}
/* Main link styling for logo + navn */
.cpt-main-link {
display: block;
text-decoration: none;
color: inherit;
transition: opacity 0.3s ease;
}
.cpt-main-link:hover {
opacity: 0.8;
text-decoration: none;
}
.cpt-main-link:focus {
outline: 2px solid #0073aa;
outline-offset: 2px;
}
.cpt-logo img {
max-width: 150px;
height: auto;
margin-bottom: 15px;
display: block;
}
.cpt-name {
margin: 10px 0;
font-size: 1.2em;
color: inherit;
}
.cpt-main-link .cpt-name {
color: #333;
}
.cpt-main-link:hover .cpt-name {
color: #0073aa;
}
.cpt-social-links {
display: flex;
justify-content: center;
gap: 15px;
margin-top: 15px;
}
.social-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
text-decoration: none;
transition: transform 0.3s ease, opacity 0.3s ease;
border-radius: 4px;
}
.social-icon:hover {
transform: translateY(-2px);
opacity: 0.8;
text-decoration: none;
}
.social-icon:focus {
outline: 2px solid #0073aa;
outline-offset: 2px;
}
/* Social icons */
#facebook:after {
content: url('data:image/svg+xml,');
position: relative;
top: 10px;
left: 10px;
}
#linkedin:after {
content: url('data:image/svg+xml,');
position: relative;
top: 10px;
left: 10px;
}
#mail:after {
content: url('data:image/svg+xml,');
position: relative;
top: 10px;
left: 10px;
}
#instagram:after {
content: url('data:image/svg+xml,');
position: relative;
top: 10px;
left: 10px;
}
#www:after {
content: url('data:image/svg+xml,');
position: relative;
top: 10px;
left: 10px;
}
/* Ikoner uden baggrundsfarve - bruger kun farvet ikon */
.social-icon .dashicons {
font-size: 24px;
width: 24px;
height: 24px;
}
.social-icon.facebook .dashicons {
color: #4267B2;
}
.social-icon.instagram .dashicons {
color: #E4405F;
}
.social-icon.website .dashicons {
color: #333;
}
.social-icon.email .dashicons {
color: #D44638;
}
/* Responsive design */
@media (max-width: 480px) {
.dianalund-cpt-display {
max-width: 100%;
margin: 10px;
padding: 15px;
}
.dianalund-cpt-display .cpt-logo img {
max-width: 120px;
}
.dianalund-cpt-display .social-icon {
width: 40px;
height: 40px;
font-size: 16px;
}
.dianalund-cpt-display .social-icon .dashicons {
font-size: 18px;
}
}
/* Editor preview styling */
.dianalund-cpt-display-editor {
padding: 20px;
border: 2px dashed #ccc;
text-align: center;
background-color: #f9f9f9;
}
.cpt-display-preview {
border: 1px solid #ddd;
padding: 15px;
border-radius: 8px;
background-color: #fff;
max-width: 300px;
margin: 0 auto;
}