Ecole directe css user script (pour rendre la page des messages utilisables sur mobile)

README.md

Quid?

Rend l'interface web d'ecole directe utilisable sur smartphone.

Installation

Testé avec firefox uniquement:

• installer l'extension stylus
• ajouter un script utilisateur pour ecole directe et y copier le contenu du css dans ce gist (attention, il faut le mettre dans @-moz-document domain("ecoledirecte.com") { ... } s'il est présent à la création du script
• enjoy!

ecoledirecte.css

 @media screen and (max-width: 767px) {

        #container-menu {
            width: 40px;
        }

        #container-menu .ed-espace-title {
            max-width: 35px;
        }

        /* Inline | https://www.ecoledirecte.com/1/5346/formulaires-et-sondages */
        .ed-menu-list-wrapper {
            /* margin: 0 50px 20px; */
            margin: 0 12px 20px;
        }

        /* Inline | https://www.ecoledirecte.com/Compte */
        .resizePage[_ngcontent-ng-c1566484873] {
            /* margin-left: 110px; */
            margin-left: 40px;
        }

        /* styles-IHCOIVRL.css | https://www.ecoledirecte.com/styles-IHCOIVRL.css */
        h3:not(.popover-header) {
            /* font-size: 17px; */
            font-size: 12px;
        }

        .sticky {
            position: unset;
        }

        .double-padding {
            /* padding: 1px 40px; */
            padding: 1px 10px;
        }

        .row > * {
            padding-right: unset;
            padding-left: calc(var(--bs-gutter-x) * .5);
        }

        .container-bg {
            box-shadow: unset;
            border: 1px solid var(--light-placeholder-color);
        }

        .simple-padding {
            /* padding: 1px 20px; */
            padding: 1px 14px;
        }

        /* Inline | https://www.ecoledirecte.com/1/5346/Messagerie */
        virtual-scroller,
        .page-messagerie .messages-listing {
            height: unset;
        }


        .page-messagerie .inbox .btn-compose {
            /* margin: 40px 0; */
            margin: 11px 0;
        }

        .page-messagerie .message-detail {
            /* padding: 10px 20px 0; */
            padding: 10px 4px 0;
        }
    }