/** * PGP Block Plugin - Unified Stylesheet */ /* ========================================================================= 1. FRONTEND RENDERING (syntax.php) ========================================================================= */ /* The outer container for an encrypted block */ .dokuwiki .pgpblock-container { margin: 1em 0; border: 1px solid #000; border-radius: 2px; overflow: hidden; font-family: sans-serif; box-shadow: 0 2px 5px rgba(0,0,0,0.1); } /* Modifier: Encrypted Text Block (Blue Theme) */ .dokuwiki .pgp-type-text { border-color: #601014; /* background-color: #f0f4ff; */ } .dokuwiki .pgp-type-text .pgp-header { background-color: #601014; } /* Modifier: Encrypted File Block (Green Theme) */ .dokuwiki .pgp-type-file { border-color: #601014; /* background-color: #f0fff4; */ } .dokuwiki .pgp-type-file .pgp-header { background-color: #601014; } /* Header bar inside the container */ .dokuwiki .pgp-header { color: #fff; padding: 6px 12px; font-size: 0.85em; font-weight: bold; text-transform: uppercase; letter-spacing: 0.05em; } /* The actual PGP Armored Text block */ .dokuwiki .pgpblock { display: block; padding: 0.7em 1em; margin: 0; border: none; border-top: 1px solid rgba(0,0,0,0.1); border-radius: 0; box-shadow: inset 0 0 0.5em rgba(0,0,0,0.1); overflow: auto; /* Background & Aesthetics */ /* background: pink; */ /* As per your original preference */ background-image: url(images/redstatic.gif); /* Typography */ font-family: Program, monospace; font-size: 0.80em; font-style: normal !important; color: #000; text-align: left; direction: ltr; /* Whitespace */ white-space: pre-wrap; word-wrap: normal; max-height: 250px; } /* Unencrypted Plaintext fallback */ .dokuwiki .pgpblock-plaintext { display: block; padding: 0.7em 1em; border: 1px dashed #cc0000; border-radius: 2px; box-shadow: inset 0 0 0.5em #ddd; overflow: auto; background: white; /* Typography */ font-family: Program, monospace; font-size: 0.80em; font-style: normal !important; color: #cc0000; text-align: left; direction: ltr; /* Whitespace */ white-space: pre-wrap; word-wrap: normal; } /* ========================================================================= 2. EDITOR UI TOOLBAR (script.js) ========================================================================= */ .pgpblock-edit-tools { background: #f0f4f8; border: 1px solid #ccd; padding: 8px; margin-bottom: 5px; border-radius: 3px; display: flex; float: left; align-items: center; gap: 10px; justify-content: space-between; /* float: left; */ /* Removed to ensure flexbox works correctly, but added back if required by your layout */ } .pgp-info-label { font-size: 0.9em; color: #334466; } /* ========================================================================= 3. BUTTONS (Shared logic) ========================================================================= */ .pgp-btn { padding: 5px 14px; font-weight: bold; cursor: pointer; border: none; border-radius: 3px; color: #fff; font-size: 0.9em; transition: background-color 0.2s ease, transform 0.1s ease, opacity 0.2s ease; } /* Text Button (Blue) */ .pgp-btn-text { background-color: #601014; } .pgp-btn-text:hover { background-color: #601014; } /* File Button (Green) */ .pgp-btn-file { background-color: #601014; } .pgp-btn-file:hover { background-color: #601014; } /* Cancel/Secondary Button (Grey) */ .pgp-btn-cancel { background-color: #eee; color: #333; border: 1px solid #ccc; } .pgp-btn-cancel:hover { background-color: #ddd; border-color: #bbb; } /* Click feedback */ .pgp-btn:active { transform: translateY(1px); } /* Disabled state */ .pgp-btn:disabled, .pgp-btn:disabled:hover { opacity: 0.5; background-color: #999; cursor: not-allowed; transform: none; } /* ========================================================================= 4. PASSWORD MODAL (script.js) ========================================================================= */ #pgpblock-modal { display: none; /* Hidden by default */ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 10000; align-items: center; justify-content: center; } .pgp-modal-content { background: #fff; padding: 25px; border-radius: 5px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); width: 360px; max-width: 90%; box-sizing: border-box; font-family: 'Segoe UI', Tahoma, sans-serif; } .pgp-modal-content h3 { margin: 0 0 10px 0; font-size: 1.3em; color: #601014; border-bottom: 2px solid #f0f4f8; padding-bottom: 8px; } .pgp-modal-content p { font-size: 0.9em; color: #555; margin: 10px 0 15px 0; line-height: 1.5; } .pgp-modal-content input[type="password"] { width: 100%; padding: 12px; margin-bottom: 20px; border: 2px solid #eee; border-radius: 4px; box-sizing: border-box; font-size: 1em; transition: border-color 0.2s; } .pgp-modal-content input[type="password"]:focus { border-color: #601014; outline: none; } .pgp-modal-actions { display: flex; justify-content: flex-end; gap: 8px; }