FluentUI: skrbniško območje podrobno

Nazaj: FluentUI (knjižnica oblikovalskega sistema)

Kako je pri nas zgrajen skrbniški zaslon: območja, vrstica dejavnosti, orodna vrstica in pravila zanje – za vsak del tudi navedba, kje je izveden.

Stanje: v celoti [Live] – vsa pravila UX in vsa območja na tej strani so izvedena, dokazila so navedena pri vsakem odseku oziroma vrstici tabele. Izvedeno se deli na tri nosilce: predlogo premium-navy-ivory (css/_admin-forms.css in skrbniški deli lupine wikija), vtičnik wkfluentui (pomočnik za vrstico dejavnosti, gradnik orodne vrstice, območja lupine) in prvega porabnika wksqliteds (skrbniški vmesnik v slogu ADS). Viri resnice: skrbnisko_podrocje (izvedba v predlogi), Styles Contract (--wk-*) (pogodba za žetone in barvno semantiko), FluentUI: javni API pomočnika (pogodbe pomočnikov). Ta stran je referenca oblikovalskega sistema za to območje in hkrati vodnik za prevzem.

DokuWikijev lastni skrbniški vmesnik (chrome) ostane nespremenjen (upravitelji nastavitev, ACL, uporabnikov in razširitev): ni lastne skrbniške nadzorne plošče in ni posegov v jedro ali v vtičnike jedra. Videz Fluent (po zgledu Microsoft Fluent, Azure DevOps in nastavitev sistema Windows) nastane zgolj z dodajanjem prek kaskade CSS (specifičnost selektorjev in vrstni red nalaganja), kjer zaslona ni mogoče urejati, pa s pravili, omejenimi na ID ali atribut. Zakaj ne lastna nadzorna plošča: v DokuWikiju bi bila mogoča le kot AdminPlugin, ta pot pa je bila ob razpustitvi vtičnika Options namenoma opuščena (zgodovina: skrbnisko_podrocje). Poudarna barva skrbniškega območja sledi izbrani shemi colorscheme prek žetonov --wk-admin-*.

WebView namesto dokumentne kartice: na zaslonih do=admin <main> nosi vsebino neposredno in brez roba – brez ozadja, sence in notranjega odmika kartice, ki jih ima bralna površina wikija (.premiumnavyivory-wiki-card, izključno pri $ACT==='show'). To je edino mesto med wikijem in skrbniškim območjem, ki namenoma ni poenoteno: skrbniško območje je aplikacija oziroma WebView, ne dokument.

Poenostavljena skica z realističnimi razmerji (rail 52px, stranska vrstica modula ~230px, vsebina prilagodljiva, auxbar ~260px, vrstica stanja 22px). Vsi skicirani elementi (meni »…« s skritimi moduli, auxbar, ki sledi izbiri, vgrajeno pogovorno okno) so izvedeni – stanje posamezne vrstice je v tabeli spodaj.

Normativna pravila za vsak skrbniški vmesnik v okolju WvdS. Oznake stanja: [Live] = izvedeno v kodi, vir je povezan; [Live] = ta opis je zavezujoča specifikacija in je napisan kot opis izvedenega obnašanja – izvedba sledi dokumentaciji (referenčni vir je naveden pri vsakem pravilu), ne obratno.

1. Naštevanje modulov [Live]: leva vrstica dejavnosti prikaže vse skrbniške module, ki jih prijavljeni uporabnik po ACL sme odpreti – izbor poteka izključno na strežniku (odsek »Obnašanje in varnostni model« spodaj).
2. Izbira modula ločeno od dejanj modula [Live]: leva vrstica dejavnosti je pridržana izključno za izbiro modula, filtrirano po ACL, in nikoli ne vsebuje dejanj aktivnega modula. Stalna dejanja modula (preklop auxbarja, zgodovina poizvedb, pravice, povezava do dokumentacije …) so namesto tega v desnem railu modula (.wk-shell-rail--right) – opredelitev območja je v layout, anatomija v odseku »Desni rail modula« spodaj. Utemeljitev (odstop od ADS, značilen za DokuWiki): v Azure Data Studiu vrstica dejavnosti sama gosti poglede orodij; v skrbniškem vmesniku WvdS leva vrstica strogo loči »kateri modul« od »kaj delam v modulu«, da je navigacija med moduli v vseh skrbniških orodjih enaka.
3. Skrivanje modulov z menijem »…« [Live]: kontekstni meni vsake ikone modula ponuja ukaz »Skrij iz vrstice«; skriti moduli izginejo iz vrstice in se namesto tega prikažejo v pojavnem meniju za ikono »…« čisto spodaj v vrstici. Klik na vnos v meniju odpre modul; ukaz »Vrni … v vrstico« v istem meniju ga vrne v vrstico. Ikona »…« se izriše le, če je skrit vsaj en modul. Vidnost je – enako kot razporeditev – zgolj nastavitev prikaza: shranjena je v localStorage po isti shemi ključev za posamezno prijavo kot vrstni red (wk-adminrail-hidden:<login>; vrstni red je poenoten na wk-adminrail-order:<login>, enkrat pa se kot nadomestek prebere še stari ključ wk-admin-rail-order-<login> iz časa predloge); o razpoložljivosti še naprej odloča samo ACL – skrit modul nikoli ni »izgubljen«, le drugam je razvrščen. Tipkovnica: Delete na izbrani ikoni jo skrije (fokus preide na sosednjo ikono); meni »…« in kontekstni meni sta pojavna menija role=„menu“ (obstoječi videz .wk-contextmenu) z navigacijo s puščicami, Home in End, s tipko Esc in z vrnitvijo fokusa na sprožilni element. Nosilec: wkfluentui/scripts/admin-rail.js (splošen, krmiljen prek podatkovnih atributov data-wk-admin-rail/data-wk-rail-list/data-wk-rail-id – predloga prispeva le oznake HTML in te atribute). Referenca: vrstica dejavnosti v VS Code (src/vs/workbench/browser/parts/paneCompositeBar.ts – pripeti in skriti ViewContainerji, shranjeni za vsak profil; kontekstni meni »Hide …« in meni »Additional Views« za preostale poglede, https://github.com/microsoft/vscode).
4. Razporeditev po uporabniku [Live]: ikone modulov je mogoče premikati z vlečenjem ali s tipkama Alt+puščica gor/dol; vrstni red se shrani za vsako uporabniško prijavo (localStorage).
5. Auxbar = odseki aktivnega modula [Live kot osvežitev ob kliku]: kjer ima modul pododseke ali lastnosti, desna stranska vrstica ponudi njegove odseke oziroma lastnosti glede na kontekst (vzorec ADS »podokno lastnosti«; prva izvedba: stalni auxbar z lastnostmi v pogledih Table Designer/Browse v wksqliteds – odzove se na klik na »Lastnosti« ob stolpcu, indeksu, tujem ključu ali vrstici). Nalaganje glede na izbiro [Live]: auxbar poleg tega samodejno sledi izbiri v modulu – ko uporabnik v mreži označi vrstico, se vsebina auxbarja naloži asinhrono, brez ponovnega nalaganja strani. Delitev dela (namerna odločitev o ločevanju pristojnosti): wkfluentui prispeva le pogodbo na odjemalcu – scripts/auxbar.js posluša dogodek wk-selectionchange gradnika dataGrid in pri natanko eni izbrani vrstici z zahtevo GET odpre naslov po predlogi iz atributa data-wk-auxbar-src elementa auxbar (oznako %key% zamenja vrednost, kodirana za URL; vsaka nova zahteva prekine prejšnjo – velja zadnji klik). Podatkovna končna točka pripada modulu (modul pozna svoje podatke in svoj ACL; prva izvedba: plugin_wksqliteds_auxbar z verigo prijava + sectok + skrbniški ACL za Structure/Browse). Prazen odgovor → zadnja vsebina ostane, doda se pridušena vrstica »ni podrobnosti«; napaka prenosa ali HTTP → opozorilno obvestilo prek gostitelja obvestil (pravilo »Gostitelj obvestil« spodaj), povezave za osvežitev ob kliku pa ostanejo nadomestna pot (z JavaScriptom ali brez njega). Referenca: podokno lastnosti v ADS (AuxiliaryBar); drugo mnenje: obnašanje plošč in postavitve v DevExpress VCL.
6. Stranski vrstici po potrebi [Live kot načelo]: leva stranska vrstica modula in desni auxbar sta izbirni območji – vsak modul ju zapolni, kadar ju potrebuje, sicer ju izpusti; sestava mreže ostane v vtičniku (primitivi .wk-shell-*, glej FluentUI: osnovna postavitev podrobno).
7. Lupina modula, prilagojena oknu [Live – zavezujoče za skrbniške zaslone]: skrbniške lupine modulov svojo višino prednostno prilagodijo višini okna: pri namizni širini se ne pomika stran, temveč vsebina modula znotraj nje (recept: datagrid, sestavine 1–4), zato vrstica stanja vedno ostane vidna. Recept za višino, ki ne podre prevajalnika CSS: okvir strani je stolpec flex čez celotno višino okna (min-height: 100vh na okvirju; topbar in noga z naravno višino, lupina med njima z flex: 1 1 auto; min-height: 0) – brez calc() z mešanimi enotami, kot je calc(100vh - 4rem) (DokuWikijev prevajalnik CSS se ob tem sesuje za celotno spletno mesto, glej Odpravljanje težav). Pravilo, ne smernica: skrbniško območje je aplikacija, ne dokument – tudi dolgi statični obrazci (splošne nastavitve, ACL) se pomikajo znotraj območja vsebine, ne skupaj s stranjo. Zavezujoča izvedba [Live] (privzeto vklopljeno, z možnostjo izklopa): premium-navy-ivory za vsak skrbniški zaslon nastavi razred telesa premiumnavyivory-viewport-fit (css/viewport-fit.css); seznam izjem (main.php, $bwViewportFitAdminOptOut, na začetku prazen) je varnostni ventil za modul, ki pri omejeni višini dokazano ne deluje. Pod tem razredom velja način delovne površine: noga spletnega mesta odpade (vrstica stanja modula je najnižja vidna vrstica), podloga in kartica odložita papirni videz, vrstica dejavnosti se pomika znotraj sebe. Moduli jedra brez lastne delovne površine so dodatno oviti v splošno skrbniško lupino delovne površine (pravilo »Mreža delovne površine« spodaj): .wk-workbench--flat oziroma – pri vsebini iz getTOC() – --no-auxbar s kazalom modula kot stransko vrstico delovne površine (vzorec viewletov v ADS) in s splošno vrstico stanja (modul · uporabnik · različica, prek statusbar()). Strani zunaj skrbniškega območja (ves wiki) ostanejo nespremenjene – vsako pravilo velja izključno pod tem razredom. Referenca: delovna površina VS Code/ADS (zapolni okno, vsako območje se pomika zase).
8. Kazalo skrbniškega modula kot drevo in harmonika s postopnim razkrivanjem [Live]: stranska vrstica delovne površine s kazalom modula (prejšnje pravilo) se ne izriše prek DokuWikijeve surove html_TOC() (<ul> brez lastnega CSS), temveč prek iste skupne komponente tree() kot vsako drugo navigacijsko drevo v tem območju (wkbizway/inc/wiki-shell.php preslika ravno polje level/hid/link iz AdminPlugin::getTOC() v shemo vozlišč komponente tree(), wkbizway_admin_toc_nodes()) – samodejno za vsak skrbniški vtičnik z getTOC(), brez vnaprej vpisanega imena vtičnika. Poleg tega wkfluentui/action/admintoc.php (kljuka TPL_CONTENT_DISPLAY, zgolj dodatek, brez posega v jedro ali tuje vtičnike) dolgo, ravno vsebino razdeli tudi sámo (upravitelj nastavitev: ~45–60 odsekov obrazca) v izključujoč accordion() (gradnik) – klik v kazalu prikaže natanko en odsek, drugi se samodejno zaprejo; sidrne povezave v kazalu ostanejo nespremenjene (#fieldsetid), zaprt <details> pa brskalnik ob skoku na sidro odpre sam, nativno že od približno leta 2020. Hevristika, ki se varuje sama, namesto seznama dovoljenih: admintoc.php primerja sidrne ID-je iz getTOC() z dejanskimi atributi id elementov v že izrisanem HTML modula – skrbniški vtičnik, katerega kazalo namesto sider na strani vrača polne URL-je drugih strani (lib/plugins/sqlite navaja druge zbirke podatkov kot lastne strani), zato že po zgradbi nima zadetka in samodejno ostane nedotaknjen, brez vnaprej vpisane izjeme. Obarvanje vsebnika (ozadje in rob stranske vrstice s kazalom) prihaja iz osrednje pogodbe za stransko vrstico in auxbar (različica za aplikacijo).
9. Podrobnosti v predalu [Live]: podrobnosti ali urejanje zapisa se običajno odprejo v predalu, ki zdrsne čez seznam (brez prehoda na novo stran, brez obrazca med vrsticami) – referenca: predal v UserManagerju, gradnik drawer() iz API-ja pomočnika.
10. Ukazna vrstica kot območje lupine [Live]: dejanja za cel modul (Shrani, Novo, Izvedi, Izvozi …) so v lastnem območju .wk-shell-commandbar – v polni širini, neposredno pod topbarjem (oziroma pod pasico, če je prikazana) in nad vrstico s stolpci stranska vrstica/vsebina/auxbar; vsebina je klic toolbar() (skupine belo→modro→rdeče po pogodbi v3). Orodne vrstice posameznega konteksta ostanejo v svojem območju (npr. orodna vrstica izbire v mreži, vrstice z zavihki) – ukazna vrstica jih ne nadomesti. Razmejitev od pasice: .wk-shell-banner ostane pridržan za pasico z obvestilom, ki jo je mogoče zapreti (pomen kot pri pasici v VS Code, skrči se na 0), in se ne uporabi kot mesto za orodno vrstico – obe območji obstajata hkrati, v vrstnem redu topbar → pasica → ukazna vrstica. Referenca: ukazna vrstica v Azure DevOps pod glavo strani; DevExpress BarManager/Ribbon.
11. Množična dejanja prek orodne vrstice izbire [Live (gradniki na odjemalcu); vzorec na strežniku = dogovor posameznega modula]: zasloni s seznami ali mrežami z večkratno izbiro (selection => 'multi', datagrid) ob neprazni izbiri nad seznamom prikažejo orodno vrstico izbire »n izbranih · dejanja · počisti izbiro« (vzorec množičnega urejanja v Azure DevOps). Gumbi za množična dejanja sledijo barvni semantiki pogodbe v3; uničujoča množična dejanja (npr. množična onemogočitev dostopa uporabnikom) so rdeča in pred izvedbo zahtevajo potrditev v modal() s številom prizadetih in nekaj primeri. Na strežniku je vsako množično dejanje zahteva POST s ključi selection[], preverjena s sectok, z vnovičnim preverjanjem ACL in obstoja za vsak vnos ter s povzetkom rezultata v vrstici sporočila – izbira na odjemalcu nikoli ni merodajna.
12. Klici drugih modulov kot vgrajeno pogovorno okno [Live]: če modul pokliče funkcijo drugega skrbniškega modula (npr. »Dodaj uporabnika« s tujega zaslona), se ta odpre kot pogovorno okno v istem oknu – brez prehoda na novo stran in brez pojavnega okna brskalnika. Gradniki: modal($title, $bodyHtml, $cancelHref, ['size' => 'workbench', 'context' => …]) za pogovorna okna, izrisana na strežniku, in pogodba sprožilne povezave <a data-wk-dialog-src="<adminPage>"> za klice drugih modulov: brez JavaScripta povezava kot običajno odpre celoten skrbniški zaslon (to je nadomestna pot), z JavaScriptom pa scripts/dialog.js odpre pogovorno okno delovne površine in modul naloži prek končne točke plugin_wkfluentui_adminfragment (strežnik preveri prijavo, sectok in isAccessibleByCurrentUser() ciljnega modula; sectok prihaja iz JSINFO.plugins.wkfluentui.sectok). Velikost workbench na namizju meri 1024×768, z ročico v spodnjem desnem kotu pa jo je mogoče poljubno spreminjati (CSS resize: both + overflow: auto na podoknu; nazadnje izbrana velikost se zapomni za vsak data-wk-dialog-context v localStorage, ključ wk-dialog-size:<context>). Pogovorno okno nikoli ne preseže vidnega polja (max-width/ max-height z vrednostmi v istih enotah – prevajalnik CSS to prenese, glej Odpravljanje težav); pri širini vidnega polja pod 1024px se izriše čez ves zaslon. Klik na zatemnitev in Esc prekličeta ($cancelHref oziroma zaprtje dinamičnega pogovornega okna), fokus ostane ujet v pogovornem oknu in se ob zaprtju vrne na sprožilni element. Dokumentirana meja prve stopnje: oddaja obrazca znotraj fragmenta preusmeri celotno stran – končna točka zgolj izrisuje za branje in namenoma ni prozoren posrednik za POST (tako ni presenečenj s CSRF in kontekstom). Deljen pogled namesto pogovornega okna, kadar morata obe površini ostati vidni [Live]: vgrajeno pogovorno okno prekrije površino, iz katere je bilo odprto. Kadar je treba odločitev sprejeti na obeh površinah hkrati (tu vnos pravilnika, tam račun ali pravilo ACL, na katero se nanaša), se tuji modul namesto tega odpre kot druga polovica v območju auxbarja (arhetip --split, pravilo »Mreža delovne površine« spodaj). Prva izvedba: mreža uporabnikov v wkidentity z upravljanjem uporabnikov oziroma ACL na desni (admin.php::renderAux()). Zakaj tam <iframe> in ne končna točka adminfragment: končna točka je namenoma zgolj bralno izrisovanje – oddaja obrazca v fragmentu preusmeri celotno stran, ravno to pa naj deljen pogled prepreči. Okvir (iframe) v svoji polovici ohrani lasten cikel zahtev tuje strani. Vdelani način [Live]: stran v okvirju odloži chrome celotnega okna – topbar, vrstico dejavnosti, trak z zavihki, nogo spletnega mesta ter ukazno vrstico in vrstico stanja splošne skrbniške lupine; ostane le modul. Nosilec je wkbizway (spremenljivka $bwEmbedded v main.php, razred telesa wkbizway-embedded, css/embedded.css), način pa prepozna po dveh signalih: parameter embedded=1 izrazi namen ob prvi zahtevi, Sec-Fetch-Dest: iframe pa ga prenese skozi vsako poznejšo navigacijo v okvirju – to gradi vdelani modul sam in o načinu ne ve ničesar. Obvezno je še Sec-Fetch-Site: same-origin: izris brez chroma ne sme biti nekaj, kar lahko z okvirjem zahteva tuja stran. Kaj ostane: ukazi modula. So vsebina, ne chrome, in sodijo ob tisto, na kar delujejo – enako pravilo kot zgoraj za orodne vrstice posameznega konteksta; deljen pogled postavi dve območji drugo ob drugo, ne spremeni pa, kateremu območju ukaz pripada. Vidna ostanejo tudi območja sporočil (Uporabnik je uspešno dodan, napake) – polovica, ki pogoltne lastne povratne informacije, bi bila slabša od polovice s preveč chroma. Cilj okvirja je vedno iz zaprtega nabora lastnih skrbniških strani, nikoli URL iz zahteve (CWE-601). Referenca: velikostni razredi .modal.flyout-dialog v ADS (layout); drugo mnenje: konvencije pogovornih oken DevExpress.
13. Mreža delovne površine kot skupna sestava [Live]: sestava mreže območij lupine ni lokalna za vtičnik, temveč je splošni .wk-workbench v wkfluentui/style.css (odsek WORKBENCH GRID): grid-template-areas (vrstica ukazne vrstice · stranska vrstica/vsebina/auxbar/rail · vrstica stanja), širine stolpcev kot lastnosti po meri, ki ovijajo stezo (--wk-workbench-sidebar-track ovije -width; prelomne točke postavijo na nič le stezo, zato vrstična vrednost delilnika preživi vsak prehod čez prelomno točko in nazaj), različice arhetipov --flat/--no-sidebar/--no-auxbar/--auxbar-collapsed/--split. Pomočnik workbench($regions,$opts) (api) sestavi območja; obstoječi izrisovalniki smejo razrede izrisati tudi neposredno (prvi porabnik wksqliteds, katerega .wkq-shell je le kljuka za obseg).
14. Določeno zmanjševanje s prekrivno plastjo in zatemnitvijo [Live]: enotne stopnje 1280/1024/768. Pod 1280px se stolpec auxbarja skrči (rail ostane, njegov preklop auxbarja odpre prekrivno plast); pod 1024px se skrči stolpec stranske vrstice, ukazna vrstica se pomika vodoravno, namesto da bi se prelomila, desni rail modula odpade (nadomestne povezave v ukazni vrstici); pod 768px je postavitev enostolpčna. Odprta območja se izrišejo kot prekrivna plast, pripeta na vrstico, nad vsebino (element mreže v toku znotraj območja vsebine z izrecno širino, box-sizing: border-box – brez position:absolute), stranska vrstica pa še z zatemnitvijo (klik ali Esc zapre, fokus se vrne na sprožilni element). Nosilec: scripts/workbench.js doda razred --overlays in vstavi plavajoča stikala za območja – brez JavaScripta ostane nadomestna prerazporeditev (.is-open kot zložena vrstica) popolno obnašanje.
15. Standardni deli vsake mreže: pager, iskalna plošča, 12 vrstic, nalaganje ob pomikanju [pravilo]: zaslon s seznamom teh štirih stvari ne gradi sam. Spadajo v pogodbo dataGrid() in so zato povsod videti enako: (1) pager kot koraki z ikonami Prva stran/Prejšnja stran/»Stran X od Y (N vnosov)«/Naslednja stran/Zadnja stran v višini kontrolnikov – brez besednih povezav in brez različice posameznega zaslona; (2) iskalna plošča nad glavami stolpcev, za cele vrstice in na strežniku, ločena od filtrirne vrstice po stolpcih; (3) privzeta velikost strani 12 vrstic (helper_plugin_wkfluentui_widgets::PAGE_SIZE) – odstopanje je treba utemeljiti v klicatelju; (4) neskončno nalaganje: ko mreža preseže višino vidnega polja, ob pomikanju nalaga naprej in pager zamenja z gumbom »Naloži več«, brez JavaScripta pa pager ostane navigacija. Zavezujoča pogodba in podatkovni atributi: datagrid → Data Paging and Scrolling in → filtering. Zakaj pravilo in ne priporočilo: pager, ki ga zgradi zaslon sam, sam zase deluje in zato nikogar ne zmoti – isti seznam pa je potem na vsakem zaslonu videti drugače. Referenca: mreža DevExpress (Pager, Search Panel), obnašanje seznamov v ADS.
16. Jeziki vsakega vtičnika: de · en · it · hr · sl [pravilo]: vsak vtičnik WvdS dobavi nize vmesnika v petih jezikih – nemščini, angleščini, italijanščini, hrvaščini in slovenščini – kot lang/<code>/lang.php (vmesnik) in, kjer obstajajo konfiguracijski ključi, lang/<code>/settings.php. Jezikovna koda za slovenščino je sl (si je koda države in je DokuWiki ne naloži kot jezik).
    • Odloča splošna nastavitev: jezik vmesnika sledi wikijevi $conf['lang'], ne lastni nastavitvi vtičnika.
    • Vrnitev na angleščino je že vedenje jedra in ne potrebuje kode: DokuWiki_Plugin::setupLocale() najprej naloži lang/en/lang.php in čeznjo položi nastavljeni jezik, tako da se manjkajoči ključ samodejno prikaže v angleščini. Posledica: nepopoln prevod nikoli ni videti kot napaka, temveč prikaže angleščino – zato tudi nikoli ni izgovor, da bi datoteko smeli izpustiti.
    • Brez golega besedila v oznakah HTML. Vsak viden niz skrbniške površine pride iz getLang(); vpisane oznake (tudi angleški ostanki, kot sta »Browse« in »Export«) veljajo za napako, ker jih v nobenem jeziku ni mogoče popraviti brez posega v kodo. Barve in dejanja se nikoli ne dodelijo po vidnem besedilu, temveč po id, name ali razredih (glej Styles Contract (--wk-*)).
17. Prednostni vrstni red v vrstici stanja [Live]: elementi vrstice stanja so posamezni elementi span __item znotraj elementov span __group (ločilo na sredini je okrasni CSS, nikoli besedilo); vrstica stanja se nikoli ne prelomi v več vrstic (nowrap + tri pike). Dve meji iz ene številke: elementi brez data-wk-priority izginejo pod 1024px, pod 768px pa še vse pod widgets::STATUS_PHONE_PRIORITY (80) – vrstica stanja, katere elementi nimajo prioritete, je tam prazna; vsak izrisovalnik zato označi elemente, ki morajo ostati (povezava/gonilnik/samo za branje oziroma modul/uporabnik). Gradniki: statusbar($left,$right,$opts) (api) oziroma Studiev lastni razred Statusbar (enaka anatomija).
18. Delilnik (sash) namesto CSS resize [Live]: širino stranske vrstice in auxbarja spreminjajo vstavljeni delilniki (scripts/sash.js: role="separator" + aria-valuenow, vlečenje s kazalcem, puščične tipke ±16px/Shift ±64px, Home/End = najmanj/največ, dvoklik = ponastavitev); vrednost se shrani za vsako površino v localStorage (wk-workbench-size:<context>:<region>, <context> iz data-wk-workbench-context). Shranjene vrednosti se ob nalaganju znova omejijo (stranska vrstica 180–480px, auxbar 200–520px) – nastavitev prikaza, nikoli pooblastilo. Nativnega resize: horizontal območja delovne površine ne uporabljajo.
19. Gostitelj obvestil za asinhrone povratne informacije [Live]: wkToast(type, text, opts) (scripts/toast.js) prikaže obvestila info/success/warning/error v gostitelju aria-live="polite" spodaj desno; error ostane, dokler ga uporabnik ne zapre, druga se zaprejo po ~6 s (lebdenje ustavi odštevanje), besedilo se nikoli ne razlaga kot HTML, pomen nikoli ni odvisen samo od barve (znak + skrita predpona vrste). Delitev dela: obvestila so izključno za asinhrone povratne informacije iz JS (napake auxbarja, množična dejanja, sprememba nastavitev prikaza); DokuWikijeve pasice msg() ostanejo kanal za rezultate zahtev POST celotne strani. Brez JavaScripta gostitelja v DOM ni.
20. Preklop gostote compact/standard [Live]: body[data-wk-density="compact"] zgosti celice dataGrid, ukazno in orodno vrstico ter višino vrstice stanja (žeton --wk-shell-statusbar-h); standardna gostota brez atributa ostane do bajta enaka. Stikalo je v uporabniškem meniju topbarja (samo do=admin, brez JS skrito), nastavitev se shrani za vsako prijavo (wk-density:<login>) in uveljavi pred prvim izrisom (vrstični skript v glavi main.php – gostota ne utripne). Zgolj nastavitev prikaza.
21. Dinamika prek JS, TypeScript po izbiri [konvencija]: stanja se menjajo prek razredov CSS, ki jih preklaplja JS (nikoli z neposrednim spreminjanjem vrstičnih slogov); klici strežnika (»postbacki«) običajno potekajo asinhrono po DokuWikijevem vzorcu končnih točk lib/exe/ajax.php s preverjanjem sectok namesto oddaje celotne strani – POST celotne strani ostane nadomestna pot brez JavaScripta. TypeScript je dovoljen kot izvorni jezik, dobavlja pa se preveden JS brez odvisnosti (obstoječi skripti so navaden JS; prim. vzorec AJAX v wkacmenu in specifikacijo wdx).

Velja le v skrbniškem območju; pogodba za primarne in sekundarne gumbe obrazcev na celotnem spletnem mestu (prijava, urejevalnik) ostane nespremenjena. Popolna referenca žetonov in razredov ter pravila vgradnje: pogodba v3.

V orodnih vrsticah so dejanja poleg tega združena po vrstnem redu DOM belo→modro→rdeče, z ločilnimi črtami – pomen nikoli ni odvisen samo od barve.

• Kateri moduli se prikažejo, odloča izključno strežnik: pomočnik ponovi logiko izbire in razvrščanja DokuWikijevega skrbniškega pregleda (enako preverjanje ACL, enake skupine admin/manager/other).
• Vrstni red je izključno stvar odjemalca: vlečenje HTML5 ali tipkovnica (Alt+puščica gor/dol z napovedjo za bralnik zaslona), shranjen v localStorage (ključ za vsako uporabniško prijavo) – ponarejena vrednost lahko spremeni le vrstni red prikaza, nikoli ne prikaže nedovoljenega modula.
• Na skrbniških zaslonih brez vrstice dejavnosti se stolpec raila skrči (rail-collapsed, glej FluentUI: postavitev wikija (lupina dokumentacije) podrobno).

Stanje: [Live]. Nasprotni del leve vrstice dejavnosti: desni rail modula nosi stalna dejanja aktivnega modula. Opredelitev območja (52px v mreži, razmerje do auxbarja, skrčitev pri prelomnih točkah, obnašanje brez JS) je v layout in se tu ne ponavlja; ta odsek opredeljuje le obnašanje in anatomijo. Prvi porabnik: wksqliteds (stopnja 1 delovne površine); nabor dejanj po pogledih Studia je na strani območja Studia.

• Kaj sodi sem: stalna stikala in skoki aktivnega modula, ki veljajo za cel modul – v Studiu: prikaz in skritje auxbarja (stikalo), zgodovina poizvedb (odpre podokno ali pogovorno okno), pravice (odpre pogovorno okno z matriko pravilnikov), povezava do dokumentacije (odpre dokumentacijo modula). Sem ne sodijo dejanja, vezana na eno samo izbiro (ta ostanejo v ukazni vrstici oziroma v orodni vrstici izbire v mreži), in izbira modula (leva vrstica).
• Anatomija dejanja: za vsako dejanje en gumb z ikono 32×32 v railu širine 52px (sredinsko, navpično zloženo od vrha), ikona iz podnabora Codicons oziroma lastna risba (brez SVG-jev iz ADS – zaradi licence EULA za izvorno kodo). Oznaka je obvezna prek aria-label in vidnega opisa orodja (title oziroma .wk-tooltip); gumbi samo z ikono, brez besedilne oznake, so dovoljeni le z nastavljenim aria-label.
• Stanja: mirovanje · lebdenje/fokus (viden obroč fokusa po pogodbi v3) · aktivno za stikala (stikalo auxbarja ima aria-pressed=„true“ in razred .is-active, dokler je auxbar viden) · onemogočeno (aria-disabled, kadar dejanja v trenutnem pogledu ni mogoče uporabiti).
• Tipkovnica: premični tabindex po railu (v zaporedju tabulatorke je natanko en gumb, puščici gor/dol se premikata, Home/End skočita na konec) – enak vzorec kot pri toolbar(); Enter/Presledek sproži dejanje. Poleg gumbov ni lastne konstrukcije role: rail je skupina role=„toolbar“ z aria-orientation=„vertical“.
• Barvna semantika: dejanja v railu so običajna (nevtralna) stikala – brez posebnih modrih ali rdečih barv (pogodba v3 velja za dejanja v ukazni vrstici, ne za rail modula; uničujoč skok najprej odpre svoje pogovorno okno za potrditev).
• Razmejitev od auxbarja: stikalo auxbarja je v railu, vsebina auxbarja v območju auxbarja. Rail prikazuje stikala, auxbar lastnosti in odseke – teh dveh ne mešajte.

1. Najprej lastne oznake DokuWikija: izpišite standardne obrazce DokuWiki in jih prepustite slogom _admin-forms.css – lastno strukturo gradite šele, ko jo resnično potrebujete.
2. Gumbe razvrstite po semantiki treh barv (lasten vtičnik: razred neposredno v oznakah, kot v wkidentity; tuj zaslon: pravilo CSS z omejenim obsegom, jedra nikoli ne urejajte).
3. Ukazna vrstica namesto razpršenih gumbov: uporabite toolbar() iz API-ja pomočnika (prinese role=„toolbar“ in navigacijo s tipkovnico).
4. Upravljanje zapisov po vzorcu seznam + orodna vrstica + predal (UserManager kot zgled).
5. Zasloni z več območji (drevo + delovno področje + lastnosti + vrstica stanja): uporabite primitive .wk-shell-*, sestava mreže ostane v vtičniku (zgled wksqliteds).
6. Pred novimi abstrakcijami vedno preverite API pomočnika in katalog gradnikov – brez podvojenih API-jev in slogov.

• Pasti prevajalnika CSS (usodne za celotno spletno mesto, DokuWikijev lessphp): min()/calc() z mešanimi enotami in zaporedje znakov */ v besedilu komentarja (komentar se konča prezgodaj) – obe napaki sta se v resnici pojavili in sta potrjeni v produkciji.
• Zaslonov jedra ni mogoče urejati – njihove gumbe je mogoče obarvati le s pravili, omejenimi na ID ali atribut; če posodobitev jedra podre selektorje, se zaslon vrne na nevtralni videz (varna smer, funkcionalnost ostane).
• Skrbniško območje podeduje lupino in razrede stanj območja wikija (FluentUI: postavitev wikija (lupina dokumentacije) podrobno), vključno z mode_admin prek tpl_classes().
• Past tseed po spremembah CSS: posodobite časovni žig datoteke conf/local.php (preverjanje).

• skrbnisko_podrocje – izvedba v predlogi, vključno z zgodovino
• Styles Contract (--wk-*) – pogodba v3 (skrbniški gumbi) in skrbniški žetoni
• FluentUI: osnovna postavitev podrobno – osnovna postavitev in besednjak wk-shell-* (ADS)
• FluentUI: postavitev wikija (lupina dokumentacije) podrobno – lupina dokumentacije (območje wikija)
• FluentUI: javni API pomočnika · FluentUI: osnovni katalog gradnikov – API pomočnika in gradniki
• SQLite Data Studio: specifikacija področja (normativno) – prvi porabnik območij lupine