En tant qu'auto-entrepreneur avec une activité de réparation tech j'utilise Abby pour facturer mes clients mais le seul soucis de ce type de plateforme c'est qu'il faut sans cesse créer une facture manuellement à chaque nouvel utilisateur de LVL.
Sur internet le boss...
Afficher la suite...URédigé par Petit Pouyo P eAucun commentaire | |
Si vous trouvez l'aspect du back-office de PluXml un peu désuet, je vous propose de créer une feuille de style supplémentaire pour un interface plus agréable.
Que vous soyez bidouilleur ou que vous voulez vraiment rendre l'interface à votre goût je vous propose une feuille de style pour personnaliser le back-office.
Cette feuille de style (.css) est entièrement personnalisable selon vos goûts et préférences. Cette modification interne à PluXml nous rappelle que ce CMS est entièrement maniable selon vos désirs.
Encore une fois il faut remercier bazooka07 pour son partage à la communauté de PluXml.
thead,
tbody tr:not(.new) td:first-of-type:not([colspan]),
table[data-rows-num] tr[draggable] td:first-of-type,
form .sidebar {
background-color: #e0e0e0;
color: #000;
}
.menu.expanded li {
margin-left: 0.75rem;
}
.section .action-bar,
.aside {
background-color: #113867;
color: #e0e0e0;
}
.section .action-bar {
border-left: 1px;
}
.section .action-bar a {
color: inherit;
}
#responsive-menu li.active {
background-color: #3fbabb;
}
.aside .unstyled-list.profil,
.aside .menu-config {
background-color: transparent;
}
.ddcat {
width: auto;
}
/* .aside et .action-bar avec position: fixed :
* Impossible d'utiliser display: grid ou flex !
* */
@media screen and (min-width: 43rem) {
body .section {
padding: 0.5rem 1.5rem 0 0.5rem;
}
.in-action-bar { margin-top: 7.5rem; }
body { --aside-width: 17rem; }
body .main .aside { width: var(--aside-width); }
body .main .section { margin-left: var(--aside-width); width: calc(100% - var(--aside-width)); }
body .main .section .action-bar { left: var(--aside-width); }
.scrollable-table {
padding-bottom: 1rem;
}
#pagination {
margin: 0.5rem 0 0;
}
}
@media screen and (min-width: 43rem) and (max-width: 65rem) {
#article,
#statique,
#categorie,
#parametres_plugin { --aside-width: 0; }
#article .main .aside,
#statique .main .aside,
#categorie .main .aside,
#parametres_plugin .main .aside { display: none; }
#article .main.grid,
#statique .main.grid,
#categorie .main.grid,
#parametres_plugin .main.grid,
#article .action-bar,
#statique .action-bar,
#categorie .action-bar,
#parametres_plugin .action-bar { margin: 0; }
#form_article > .grid > .col {
padding-right: 0.5rem;
}
}
@media screen and (min-width: 49rem) {
#form_article > .grid {
display: grid;
grid-template-columns: 1fr 25rem;
margin-right: 0.15rem;
}
#form_article > .grid > div {
width: auto;
}
}
@media screen and (min-width: 65rem) {
body .section {
padding-left: 1.5rem;
}
#form_article > .grid {
grid-template-columns: 1fr 32rem;
}
#form_article > .grid > .col {
padding-right: 1.5rem;
}
}
Et voilà :
L'archive zip de la feuille est téléchargeable ici : https://gist.github.com/bazooka07/f38d3e305aaaa228ee4638851f732197
Ce cela ressemble à cela :
DClassé dans : PluXml ,Mots clés : personnaliser admin, personnaliser skin back-office, personnaliser back-office, personnalisation pluxml