/* ===== acenteui#111 — "Liman" teması (css/liman.css, e-Denizcilik ortak dosyası) için GABS'a özgü uyarlamalar ===== liman.css giriş sistemi / SSO paneli / ADBS / DSBS / ISPS ile BİREBİR aynı tutulur (değiştirilmez); GABS'ın kendi parçaları (Metronic üst çubuğu, Menu.js'in çizdiği menü ve rozet stilleri, form-styles.css'in mavi-mor renk değişkenleri ve sayfa başlık bantları, herkese açık sayfalardaki giriş çubuğu, ana sayfa şamandıra bağlantıları) burada boyanır. Bu dosya liman.css'ten SONRA yüklenir. Panel kuralları yalnız tema açıkken (body.liman-app) geçerlidir; menüsüz sayfalar (MasterEmpty: ana sayfa, hata) body.layout-liman'dır. CSP: dekor satır içi SVG / CSS ya da data: URI'dir (img-src 'self' data: izinli); dış kaynak yoktur. */ /* ---------- Renk değişkenleri ---------- form-styles.css :root'ta mavi-mor degrade (--primary-gradient) ve turkuaz vurgu (--accent-color) tanımlar; birincil düğmeler, sayfa başlık bantları ve form öğeleri bunları kullanır. Tema açıkken lacivert + altına çevrilir (gövde düzeyinde yeniden tanım, alt öğeler bunu devralır). Menu.js'in enjekte ettiği menü vurgu değişkenleri (--menu-accent*) de mavi yerine altın olur. */ .liman-app { --primary-color: #0f4c8a; --primary-gradient: linear-gradient(135deg, #0f4c8a 0%, #0a2342 100%); --primary-gradient-hover: linear-gradient(135deg, #1460a8 0%, #0d2b52 100%); --accent-color: #e0b44c; --menu-accent: rgba(224, 180, 76, 0.95); --menu-accent-soft: rgba(224, 180, 76, 0.1); --menu-accent-soft2: rgba(224, 180, 76, 0.16); } /* ---------- Üst çubuk: gece mavisi, altta altın çizgi ---------- liman.css bu boyamayı ESS tabanlı panellerin .ess-headerbar sınıfına bağlar; GABS Metronic'in kendi üst çubuğunu kullanır (sınıf eklenmedi, çünkü liman.css dar ekranda .ess-headerbar'ı sabitler ve Metronic düzeninde içeriğin üstüne binerdi). */ .liman-app #kt_app_header { background: linear-gradient(90deg, var(--hb-night) 0%, #0d2b52 60%, #13406f 100%) !important; border-bottom: 1px solid rgba(224, 180, 76, 0.55); box-shadow: 0 6px 18px rgba(3, 14, 28, 0.35); } /* Misafir (oturumsuz; Master.cshtml gövdeye sunucuda "ac-guest" yazar): yan menü yoktur. Metronic push-header düzeni üst çubuğu menü genişliği kadar (265px) sağa iter ve betiğin data-kt-app-sidebar-enabled="false" yazması bunu geri almaz; çubuk tam genişlik olsun. (Eski açık temada çubuk beyaz zeminde görünmediği için bu kayma fark edilmiyordu.) */ .liman-app.ac-guest #kt_app_header { left: 0 !important; } .liman-app #user-name { color: #fff; font-weight: 600; } .liman-app .ac-user-role { color: rgba(255, 255, 255, 0.62); font-size: 0.75rem; font-weight: 500; } /* ---------- Yan menü: Menu.js rozetleri ve sunucuda çizilen "Sistem" bölümü (#104) mavi yerine altın / lacivert ---------- */ .liman-app #kt_app_sidebar_menu .menu-link:hover, .liman-app #kt_app_sidebar_menu_sistem .menu-link:hover { background: rgba(255, 255, 255, 0.07) !important; } .liman-app #kt_app_sidebar_menu .menu-icon.menu-icon-badge, .liman-app #kt_app_sidebar_menu_sistem .menu-icon.menu-icon-badge { background: rgba(255, 255, 255, 0.06); border-color: rgba(224, 180, 76, 0.28); } .liman-app #kt_app_sidebar_menu .menu-icon.menu-icon-badge i, .liman-app #kt_app_sidebar_menu_sistem .menu-icon.menu-icon-badge i { color: rgba(201, 214, 228, 0.85) !important; } .liman-app #kt_app_sidebar_menu .menu-link:hover .menu-icon.menu-icon-badge, .liman-app #kt_app_sidebar_menu_sistem .menu-link:hover .menu-icon.menu-icon-badge { border-color: rgba(224, 180, 76, 0.6); background: rgba(224, 180, 76, 0.1); } .liman-app #kt_app_sidebar_menu .menu-link.active .menu-icon.menu-icon-badge, .liman-app #kt_app_sidebar_menu_sistem .menu-link.active .menu-icon.menu-icon-badge { background: rgba(224, 180, 76, 0.18); border-color: var(--hb-gold); } .liman-app #kt_app_sidebar_menu .menu-link.active .menu-icon.menu-icon-badge i, .liman-app #kt_app_sidebar_menu .menu-link:hover .menu-icon.menu-icon-badge i { color: var(--hb-gold) !important; } /* Alt menüler (Acente / Personel grupları): soldan kesikli altın çizgiyle girintili */ .liman-app #kt_app_sidebar_menu .menu-sub-accordion { margin-left: 16px; padding-left: 4px; border-left: 1px dashed rgba(224, 180, 76, 0.3); } .liman-app #kt_app_sidebar_menu .menu-sub .menu-icon.menu-icon-sub i { color: rgba(201, 214, 228, 0.75) !important; } .liman-app #kt_app_sidebar_menu .menu-sub .menu-bullet .bullet-dot { background-color: rgba(224, 180, 76, 0.7) !important; } .liman-app #kt_app_sidebar_menu .menu-arrow::after { filter: brightness(0) invert(0.85); } /* Menü kaydırma çubuğu koyu zeminde görünür kalsın */ .liman-app #kt_app_sidebar_menu_scroll { scrollbar-color: rgba(224, 180, 76, 0.45) transparent; } /* Yan menü altındaki bakanlık bağlantısı: koyu zeminde ince altın çerçeveli */ .liman-app #kt_app_sidebar_footer .btn-custom { background: rgba(255, 255, 255, 0.06) !important; border: 1px solid rgba(224, 180, 76, 0.35); border-radius: 10px; } .liman-app #kt_app_sidebar_footer .btn-custom .btn-label { color: rgba(255, 231, 176, 0.9); font-size: 0.8rem; } .liman-app #kt_app_sidebar_footer .btn-custom:hover { background: rgba(224, 180, 76, 0.16) !important; } /* ---------- Sayfa başlık bantları: küçük "ufuk bandı" ---------- Sayfalar (form-styles.css .fullwidth-grid-page .portlet-title) başlığı mavi-mor degrade bantta yazar. Tema açıkken bant DSBS'teki gibi alacakaranlık gökyüzüne döner, altında akmayan iki katman dalga (data: URI SVG) ve soldaki vurgu çizgisi altın olur. İşaretleme değişmez; arama kutusu vb. sağdaki öğeler bandın önünde kalır. */ .liman-app .fullwidth-grid-page .portlet-title { position: relative; overflow: hidden; border-radius: 18px; padding-bottom: 34px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath fill='%23104878' fill-opacity='.75' d='M0 18c90 14 270-14 360 0s270-14 360 0 270-14 360 0 270-14 360 0v22H0Z'/%3E%3Cpath fill='%230e4476' d='M0 27c90-10 270 10 360 0s270 10 360 0 270 10 360 0 270 10 360 0v13H0Z'/%3E%3C/svg%3E") left bottom / 100% 22px no-repeat, radial-gradient(160px 120px at 88% 120%, rgba(255, 214, 140, 0.55), transparent 70%), linear-gradient(180deg, var(--hb-night) 0%, #0d2b52 45%, #2b5b8c 80%, #d98c5f 100%); box-shadow: 0 14px 30px rgba(6, 21, 43, 0.22); } .liman-app .fullwidth-grid-page .portlet-title .caption::before { background-color: var(--hb-gold); } .liman-app .fullwidth-grid-page .page-title { font-weight: 700; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35); } /* ---------- İçerik ---------- Izgarada seçili satır: liman.css hücreyi açık altın boyar; yazı rengi devralınır (eski Master'daki kural yazıyı beyaz yapıyordu). */ .liman-app .dx-datagrid .dx-row.dx-selection { background-color: transparent; color: inherit; } /* Herkese açık sayfalardaki giriş çubuğu (_PublicActionBar): düğmeler liman.css .hb-btn, yerleşim burada */ .public-action-bar { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.25rem; } .public-action-bar .hb-btn { height: 40px; } /* ---------- Menüsüz sayfalar (MasterEmpty) ---------- */ /* Ana sayfa şamandıraları bağlantıdır: tüm satır tıklanır, üzerine gelince altın çerçeve */ .lg-buoys li { padding: 0; } .ac-buoy-link { display: flex; align-items: center; gap: 14px; width: 100%; padding: 12px 16px; border-radius: 14px; color: inherit; text-decoration: none; transition: background 0.15s ease, box-shadow 0.15s ease; } .ac-buoy-link:hover, .ac-buoy-link:focus-visible { color: inherit; background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(224, 180, 76, 0.75); } .ac-buoy-link:focus-visible { outline: 3px solid var(--hb-gold); outline-offset: 2px; } /* Biniş kartındaki giriş düğmesi