Úprava modal oken administrace

26. čvn 2018 22:28 - 26. čvn 2018 22:42 #136480

Úprava modal oken administrace od Bong

Moderátor

Nemáte někdo nějaký návod (tip, odkaz,...) na úpravu zobrazení modal oken v administraci? Myslím modal pro vkládání obrázků, změny obrázků, hromadné úpravy,...

Od počátků J3 je to děsběs nepřátelský uživatelům, neustálé rolování a klikání bez ohledu na velikost obrazovky. Jako kdyby autor neustále používal 15 monitor a nevěděl, že se prvky dají zobrazit naráz. Navíc se to přenáší i do dalších rozšíření, které toto využívají.

Viz. jedna z těch všech příšerností níže.

I'm sorry, my responses are limited...you must ask the right questions.

Přílohy:

26. čvn 2018 22:56 #136481

Odpověď od Cony

Moderátor

JCE nahradí většinu popup oken pro výběr obrázků svým File managerem, který je myslím velmi příjemný. Bohužel ne úplně všude to funguje, ale v základních rozšíření a těch které používají klasickou syntaxi to funguuje....

27. čvn 2018 11:34 #136486

Odpověď od H13

Admin

Je to bootstrap 2, takže dokud nebude aktualizace na Joomlu! 4, asi se nic nezmění.

Jediný co mě napadá, je dodat si vlastní CSS a např. zmenšit zbytečný mezery mezi prvky, padding, margin, atd. :idea:

Phoca Cart - www.phoca.cz/phocacart - e-shop, e-commerce
Phoca Gallery - www.phoca.cz/phocagallery - obrázková galerie
Phoca Download - www.phoca.cz/phocadownload - stahování souborů
Phoca Guestbook - www.phoca.cz/phocaguestbook - guestbook

27. čvn 2018 12:20 - 27. čvn 2018 12:28 #136487

Odpověď od H13

Admin

Např. zvětšit ten modal na celou obrazovku, zmenšit paddingy a marginy, něco hodit do floatu, zhustit zobrazení obrázků:

administrator\templates\isis\css\template.css (na konec)

Code:

div.modal {
	top: 3% !important;
	left: 50%;
	width: 95%;
	margin-left: -48%;
	height: 93%;	
}
.modal-body iframe {
	height: 83vh !important;
}
iframe#imageframe {
	height: 63vh !important;
}
#imageForm .well {
	padding: 0.8em 0.8em 0 0.8em;
}
.form-vertical .control-label {
	float: left;
	margin-right: 1em;
}
.well .row .control-group {
	width: 70%;
	float:left;
}
.thumbnails-media .thumbnail {
	border-radius: 0;
	margin: 1px;
	width: 95px;
	height: 95px;
	border: 1px solid #c0c0c0;
}
.mce-container.mce-window {
	width: 95vw !important;
	left: 1.5vw !important;
}
.mce-container.mce-window.mc-container-body {
	width: 95vw !important;
}