/* DevTool — izgled konzole (CSS UGOVOR iz CC_HELPER/js/devtool/README.md §5). * * Živi u `core/`, dakle identičan je na svakoj stranici i NE ovisi o dizajnu klijenta. * Namjerno je neutralno taman i sav pod `.devtool*` prefiksom, da se ne sudari s * `templates/assets/css/style.css` pojedine stranice. * * Uz ovo, sam alat pri montaži injektira `SAFE_LAYOUT_CSS` (najniži sloj u ) — * ondje su samo layout pravila (nowrap, flex:none, ellipsis). Ovaj file je tema. */ .devtool { position: fixed; z-index: 2147483000; font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #e8e8ef; background: rgba(22, 22, 30, .96); border: 1px solid #3b3b52; border-radius: 8px; box-shadow: 0 10px 30px rgba(0, 0, 0, .45); transition: opacity .15s ease; overflow: hidden; } .devtool-header { gap: .4rem; padding: .4rem .5rem; background: #23233a; border-bottom: 1px solid #3b3b52; cursor: move; user-select: none; } .devtool--reversed .devtool-header { border-bottom: 0; border-top: 1px solid #3b3b52; } .devtool-title { font-weight: 700; letter-spacing: .03em; } .devtool-dxdy { color: #8f8fae; font-size: 11px; } .devtool-wrench, .devtool-btn { padding: 0 .3rem; color: #cfcfe4; background: transparent; border: 0; border-radius: 4px; font: inherit; line-height: 1.4; cursor: pointer; } .devtool-wrench:hover, .devtool-btn:hover { background: #35354f; color: #fff; } .devtool-btn--close:hover { background: #7a2634; } .devtool-actions { gap: .1rem; margin-left: .4rem; } .devtool-body { padding: .45rem .5rem; max-height: 60vh; overflow: auto; } .devtool-body.is-hidden { display: none; } .is-hidden { display: none !important; } .devtool-empty { margin: 0; color: #8f8fae; } .devtool-methods { display: flex; flex-direction: column; gap: .3rem; } .devtool-method { padding: .3rem .35rem; background: #1d1d2b; border: 1px solid #32324a; border-radius: 6px; } .devtool-method-head { gap: .4rem; } .devtool-method-name { color: #d7d7ea; } .devtool-method-run, .devtool-method-cust, .devtool-save { padding: .15rem .45rem; color: #e8e8ef; background: #35354f; border: 1px solid #45456a; border-radius: 4px; font: inherit; text-decoration: none; cursor: pointer; } .devtool-method-run:hover, .devtool-method-cust:hover, .devtool-save:hover { background: #45456a; } .devtool-method-cust.is-active { background: #5a4b8a; border-color: #7a68b8; } .devtool-customize { margin-top: .35rem; } .devtool-customize-label { display: block; margin-bottom: .2rem; color: #8f8fae; font-size: 11px; } .devtool-customize-row { gap: .3rem; } .devtool-input { padding: .15rem .35rem; color: #e8e8ef; background: #14141f; border: 1px solid #45456a; border-radius: 4px; font: inherit; } .devtool-settings { display: flex; flex-direction: column; gap: .4rem; } .devtool-settings-title { font-weight: 700; color: #cfcfe4; } .devtool-setting { display: flex; gap: .4rem; align-items: flex-start; cursor: pointer; } .devtool-setting-txt { display: flex; flex-direction: column; } .devtool-setting-label { color: #d7d7ea; } .devtool-setting-hint { color: #8f8fae; font-size: 11px; } /* --- Mark EDA content ------------------------------------------------------- * Klasu `.devtool-eda-marked` postavlja komanda "Mark on/off EDA content" * (core/devtool/devtool.apsi.js) na svaki `.by_eda_source` element. Sam border/padding * ide inline (da se prethodno stanje može vratiti 1:1), ovdje je samo pojačanje. */ .devtool-eda-marked { position: relative; box-shadow: 0 0 0 1px rgba(168, 32, 240, .35); }