.om-icon { font-size: 0; //vertical-align: bottom; &::before { font-size: 1.25rem; } } .om-prev-icon { padding: 0; &:before { margin-right: 0.5em; vertical-align: middle; text-decoration: transparent; } } .om-icon-16 { font-style: normal; } .arrow-right-16 { @include newIcon("\EA6C"); } .consult-16 { @include newIcon("\EA6C"); } .add-16, .add-25 { @include newIcon("\EA12"); } .mut-add-16 { @extend .add-16; &:before { /* Permet de créer une ombre pour donner un effet de + multiple */ text-shadow: 2px -2px $blanc, -2px 2px $blanc, 4px -4px currentColor; } } .add-16-blue { @extend .add-16; color: blue; } .delete-16, .delete-25 { @include newIcon("\EC1E"); } .edit-16 { @include newIcon("\EC80"); } .pdf-16, .pdf-25, .edition-16, .affichage_reglementaire_attestation-16, .affichage_reglementaire_registre-16, .envoi_lettre_rar-16, .bordereaux-16, .bordereau_envoi_maire-16 { @include newIcon("\ECEB"); } #action-form-dossier_instruction-edition .pdf-16{ @include newIcon("\ED0F"); } .lu-16, .finalise, .marque-16, .check-16 { @include newIcon("\EB7B"); } .rediger-16 { @include newIcon("\ECDB"); #action-form-dossier_instruction-geolocalisation & { @include newIcon("\EF14"); } } .definalise, .demarque-16, .nonlu-16 { @include newIcon("\EB99"); } .reqmo-16, .import-16 { @include newIcon("\EC5A"); } .journal-instruction-16 { @include newIcon("\F1DE"); } .toutes-les-pieces-16 { @include newIcon("\ED52"); } .info-16 { @include newIcon("\EE59", text-top); } .radiation-16 { @include newIcon("\ED63"); } .radiation-16 { @include newIcon("\EA48"); } .search-16, .search-frequent-16, .loupe-16 { @include newIcon("\F0D1"); } .copy-16 { @include newIcon("\ECD3"); } .suivi-dates-16, .suivi_mise_a_jour_des_dates-16, .demandes_avis_mise_a_jour_des_dates-16 { @include newIcon("\EB21"); } .notifier_commune-16 { @include newIcon("\EEFC"); } .transferer-16 { @include newIcon("\EA68"); } .selection-document-signé { @include newIcon("\ED15"); } legend { &.collapsed, &.collapicon_plus { @include newIcon("\EA0F"); } &.collapsible:not(.collapsed), &.collapicon_less { @include newIcon("\EB84"); } } a.retour { @include newIcon("\EA58"); } .enjeu { @include newIcon("\ED85"); } .enjeu_erp-16 { @extend .enjeu; color: magenta; } .enjeu_urba-16 { @extend .enjeu; color: gold; } // TODO /* actions d'envoi en signature */ .envoyer_a_signature-16 { @include newIcon("\EA8A"); } /* action d'annulation d'envoi en signature */ .annuler_envoi_signature-16 { @include newIcon("\EB99"); } /* actions d'envoi au CL */ .envoyer_au_controle_de_legalite-16 { // Note : On garde la propriété background image au cas où l'iconographie avec // Marianne est indispensable. En attendant de créer une icone custom /* background-image: url("../img/send-to-cl-16x16.png"); */ @include newIcon("\EDD9"); } .nouveau-dossier-16 { @include newIcon("\ED5A"); } .dossier-existant-16, .dossier_instruction_recherche-16 { @include newIcon("\ED6A"); } .autre-dossier-16 { @include newIcon("\ED6A"); } .tableau-de-bord-16 { @include newIcon("\EC14"); } .consultation-retour-16 { @include newIcon("\EA5A"); } .commission-retour-16, .commissions-16 { @include newIcon("\ED6A"); } .commissions-demande-passage-16 { @include newIcon("\F1EE"); } .dossier_autorisation-16, .dossier_instruction_mes_encours-16, .dossier_instruction_tous_encours-16, .dossier_instruction_mes_clotures-16, .dossier_instruction_tous_clotures-16, .dossier_contentieux_mes_instructions-16, .dossier_contentieux_toutes_instructions-16 { @include newIcon("\ED6A"); } .messages_tous_retours-16, .messages_retours_ma_division-16, .messages_mes_retours-16, .messages_contentieux_mes_retours-16, .messages_contentieux_retours_ma_division-16, .messages_contentieux_tous_retours-16 { @include newIcon("\EEF6"); } .petitionnaire_frequent-16 { @include newIcon("\F1EE"); } .depot-electronique-16 { @include newIcon("\EBCA"); &:before { background: gold; padding: .25em; border-radius: 5px; margin-right: .5em; } } .message-manuel-16 { @include newIcon("\EF02"); } .citizen_access_key-16 { @include newIcon("\EE6F"); } .watch-16 { @include newIcon("\ECB5"); } .unwatch-16 { @include newIcon("\ECB7"); } /* Icones en 25 pixels */ .generate-25 { @include newIcon("\F0EA"); } .print-25 { @include newIcon("\F029"); } .csv-25 { display: flex; align-items: center; color: $blanc; background-color: $brandColor; border-radius: 0.25rem; padding: .25rem .75rem; transition: background 0.1s; &:hover { text-decoration: none; background-color: $brandDark; } @include newIcon("\F1DA"); &:after { content: "Exporter les données"; font-size: .9rem; padding-left: 0.5rem; font-weight: 600; } } .sig-25 { @include newIcon("\EC7A"); } #actions a.actions-password { @include newIcon("\EED0"); } #actions a.actions-logout { @include newIcon("\EEDA"); } .ui-datepicker-trigger { width: 20px; height: 20px; transition: filter 0.2s; &:hover { filter: sepia(1) brightness(50%) hue-rotate(-50deg) saturate(6) ; } } /** * Ajoute les icônes aux actions modifiant le type de rédaction */ .redac-complement-16, .redac-libre-16{ @include newIcon("\EC80"); } .preview-16 { @include newIcon("\ECB5"); } .sig-16 { @include newIcon("\EF14"); color:$bleuDark } // Couleur No géolocalisation .no-geoloc .sig-16, span.sig-16.no-geoloc { @extend .sig-16; color: $rouge } // Couleur dématérialisation / Plat'AU .consult-demat .consult-16, span.consult-16.consult-demat { @extend .consult-16; color: goldenrod; } // jQueryUI Icons /* states and images */ .ui-icon { font-size: 0; display: inline-block; &:before { display: inline-block; font-size: 1rem; width: 1em; height: 1em; vertical-align: middle; } } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon { color: $brandColor; } .ui-state-active .ui-icon { color: #454545; } .ui-state-highlight .ui-icon { color: #2e83ff; } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon { color: #cd0a0a; } /* Carat & Triangles */ .ui-icon-carat-1-n, .ui-icon-triangle-1-n { @include newIcon("\EA78"); } .ui-icon-carat-1-ne, .ui-icon-triangle-1-ne { @include newIcon("\EA78"); transform: rotate(45deg); } .ui-icon-carat-1-e, .ui-icon-triangle-1-e { @include newIcon("\EA6E"); } .ui-icon-carat-1-se, .ui-icon-triangle-1-se { @include newIcon("\EA6E"); transform: rotate(45deg); } .ui-icon-carat-1-s, .ui-icon-triangle-1-s { @include newIcon("\EA4E"); } .ui-icon-carat-1-sw, .ui-icon-triangle-1-sw { @include newIcon("\EA4E"); transform: rotate(45deg); } .ui-icon-carat-1-w, .ui-icon-triangle-1-w { @include newIcon("\EA64"); } .ui-icon-carat-1-nw, .ui-icon-triangle-1-nw { @include newIcon("\EA64"); transform: rotate(45deg); } .ui-icon-carat-2-n-s, .ui-icon-triangle-2-n-s { @include newIcon("\F327"); } .ui-icon-carat-2-e-w, .ui-icon-triangle-2-e-w { @include newIcon("\F323"); } /* Arrows */ .ui-icon-arrow-1-n { @include newIcon("\EA76"); } .ui-icon-arrow-1-ne { @include newIcon("\EA70"); } .ui-icon-arrow-1-e { @include newIcon("\EA6C"); } .ui-icon-arrow-1-se { @include newIcon("\EA6A"); } .ui-icon-arrow-1-s { @include newIcon("\EA4C"); } .ui-icon-arrow-1-sw { @include newIcon("\EA5E"); } .ui-icon-arrow-1-w { @include newIcon("\EA60"); } .ui-icon-arrow-1-nw { @include newIcon("\EA66"); } .ui-icon-arrow-2-n-s { @include newIcon("↕"); } .ui-icon-arrow-2-ne-sw { @include newIcon("⤢"); } .ui-icon-arrow-2-e-w { @include newIcon("↔"); } .ui-icon-arrow-2-se-nw { @include newIcon("⤡"); } .ui-icon-arrowstop-1-n { @include newIcon("\F2FD"); transform: rotate(90deg); } .ui-icon-arrowstop-1-e { @include newIcon("\F301"); } .ui-icon-arrowstop-1-s { @include newIcon("\F301"); transform: rotate(90deg); } .ui-icon-arrowstop-1-w { @include newIcon("\F2FD"); } /* Arrowthick */ .ui-icon-arrowthick-1-n { @include newIcon("\EA75"); } .ui-icon-arrowthick-1-ne { @include newIcon("\EA6F"); } .ui-icon-arrowthick-1-e { @include newIcon("\EA6B"); } .ui-icon-arrowthick-1-se { @include newIcon("\EA69"); } .ui-icon-arrowthick-1-s { @include newIcon("\EA4B"); } .ui-icon-arrowthick-1-sw { @include newIcon("\EA5D"); } .ui-icon-arrowthick-1-w { @include newIcon("\EA5F"); } .ui-icon-arrowthick-1-nw { @include newIcon("\EA65"); } .ui-icon-arrowthick-2-n-s { @include newIcon("⬍"); } .ui-icon-arrowthick-2-ne-sw { @include newIcon("⬍"); transform: rotate(45deg); } .ui-icon-arrowthick-2-e-w { @include newIcon("⬌"); } .ui-icon-arrowthick-2-se-nw { @include newIcon("⬌"); transform: rotate(45deg); } .ui-icon-arrowthickstop-1-n { @include newIcon("\F2FC"); transform: rotate(90deg); } .ui-icon-arrowthickstop-1-e { @include newIcon("\F300"); } .ui-icon-arrowthickstop-1-s { @include newIcon("\F300"); transform: rotate(90deg); } .ui-icon-arrowthickstop-1-w { @include newIcon("\F2FC"); } /* Curved arrows */ .ui-icon-arrowreturnthick-1-w { @include newIcon("\EA57"); } .ui-icon-arrowreturnthick-1-n { @include newIcon("\F2E8"); } .ui-icon-arrowreturnthick-1-e { @include newIcon("\EA59"); } .ui-icon-arrowreturnthick-1-s { @include newIcon("\F2E6"); } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; @include newIcon("\EA58"); } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; @include newIcon("\F2E9"); } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; @include newIcon("\EA5A"); } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; @include newIcon("\F2E7"); } .ui-icon-arrowrefresh-1-w { @include newIcon("\F080"); transform: rotate(90deg); } .ui-icon-arrowrefresh-1-n { @include newIcon("\F080"); transform: rotate(180deg); } .ui-icon-arrowrefresh-1-e { @include newIcon("\F080"); transform: rotate(270deg); } .ui-icon-arrowrefresh-1-s { @include newIcon("\F080"); } /* Misc arrows */ .ui-icon-arrow-4 { @include newIcon("\EC60"); } .ui-icon-arrow-4-diag { @include newIcon("\EC60"); transform: rotate(45deg); } .ui-icon-extlink { @include newIcon("\ECAF"); } .ui-icon-newwin { @include newIcon("\F2C3"); } .ui-icon-refresh { @include newIcon("\F074"); } .ui-icon-shuffle { @include newIcon("\F124"); } .ui-icon-transfer-e-w { background-position: -96px -80px; @include newIcon("\EA62"); } .ui-icon-transferthick-e-w { background-position: -112px -80px; @include newIcon("\EA61"); } /* Misc */ .ui-icon-folder-collapsed { background-position: 0 -96px; @include newIcon("\ED52"); } .ui-icon-folder-open { @include newIcon("\ED70"); } .ui-icon-document { @include newIcon("\ECEB"); } .ui-icon-document-b { @include newIcon("\ECC7"); } .ui-icon-note { @include newIcon("\EADF"); } .ui-icon-mail-closed { @include newIcon("\EEF6"); } .ui-icon-mail-open { @include newIcon("\EEFA"); } .ui-icon-suitcase { @include newIcon("\F1B9"); } .ui-icon-comment { @include newIcon("\EF48"); } .ui-icon-person { @include newIcon("\F264"); } .ui-icon-print { @include newIcon("\F029"); } .ui-icon-trash { @include newIcon("\EC2A"); } .ui-icon-locked { @include newIcon("\EECE"); } .ui-icon-unlocked { @include newIcon("\EED2"); } .ui-icon-bookmark { @include newIcon("\EAE5"); } .ui-icon-tag { @include newIcon("\F023"); } .ui-icon-home { @include newIcon("\EE19"); } .ui-icon-flag { @include newIcon("\ED3B"); } .ui-icon-calendar { @include newIcon("\EB20"); } .ui-icon-cart { @include newIcon("\F11E"); } .ui-icon-pencil { @include newIcon("\EFE0"); } .ui-icon-clock { @include newIcon("\F20F"); } .ui-icon-disk { @include newIcon("\F0B0"); } .ui-icon-calculator { @include newIcon("\EB1F"); } .ui-icon-zoomin { @include newIcon("\F2DB"); } .ui-icon-zoomout { @include newIcon("\F2DD"); } .ui-icon-search { @include newIcon("\F0D1"); } .ui-icon-wrench { @include newIcon("\F21B"); } .ui-icon-gear { @include newIcon("\F0E9"); } .ui-icon-heart { @include newIcon("\EE0A"); } .ui-icon-star { @include newIcon("\F186"); } .ui-icon-link { @include newIcon("\EEB2"); } .ui-icon-cancel { @include newIcon("\F3A1"); } .ui-icon-plus, .ui-icon-plusthick { @include newIcon("\EA13"); } .ui-icon-minus, .ui-icon-minusthick { @include newIcon("\F1AF"); } .ui-icon-close, .ui-icon-closethick { @include newIcon("\EB99"); } .ui-icon-key { @include newIcon("\EE6F"); } .ui-icon-lightbulb { @include newIcon("\EEA9"); } .ui-icon-scissors { @include newIcon("\F0C2"); } .ui-icon-clipboard { @include newIcon("\EB91"); } .ui-icon-copy { @include newIcon("\ECD5"); } .ui-icon-contact { @include newIcon("\F389"); } .ui-icon-image { @include newIcon("\EE44"); } .ui-icon-video { @include newIcon("\ED21"); } .ui-icon-script { background-position: -240px -128px; @include newIcon("\ECF9"); } /* Alerts */ .ui-icon-alert { @include newIcon("\EA21"); } .ui-icon-info { @include newIcon("\EE59"); } .ui-icon-notice { @include newIcon("\ECA1"); } .ui-icon-help { @include newIcon("\F045"); } .ui-icon-check { @include newIcon("\EB7B"); } .ui-icon-bullet { @include newIcon("\EB7C"); } .ui-icon-radio-off { @include newIcon("\EB7D"); } .ui-icon-radio-on { @include newIcon("\F050"); } .ui-icon-pin-w { @include newIcon("\F036"); transform: rotate(90deg); } .ui-icon-pin-s { @include newIcon("\F036"); } /* Media */ .ui-icon-play { @include newIcon("\F00A"); } .ui-icon-pause { @include newIcon("\EFD7"); } .ui-icon-seek-next { @include newIcon("\F176"); } .ui-icon-seek-prev { @include newIcon("\F085"); } .ui-icon-seek-end { @include newIcon("\F143"); } .ui-icon-seek-start, .ui-icon-seek-first { @include newIcon("\F13F"); } .ui-icon-stop { @include newIcon("\F1A0"); } .ui-icon-eject { @include newIcon("\EC87"); } .ui-icon-volume-off { @include newIcon("\F29B"); } .ui-icon-volume-on { @include newIcon("\F2A1"); } /* Power */ .ui-icon-power { @include newIcon("\F126"); } .ui-icon-signal-diag, .ui-icon-signal { @include newIcon("\F09E"); } .ui-icon-battery-0 { @include newIcon("\EAAC"); } .ui-icon-battery-1 { @include newIcon("\EAAA"); } .ui-icon-battery-2 { @include newIcon("\EAB4"); } .ui-icon-battery-3 { @include newIcon("\EAB6"); } .ui-icon-circle-plus, .ui-icon-circlesmall-plus { @include newIcon("\EA11"); } .ui-icon-circle-minus, .ui-icon-circlesmall-minus { @include newIcon("\EE57"); } .ui-icon-circle-close, .ui-icon-circlesmall-close { @include newIcon("\EB97"); } .ui-icon-circle-arrow-e, .ui-icon-circle-triangle-e { @include newIcon("\EA68"); } .ui-icon-circle-arrow-s, .ui-icon-circle-triangle-s { @include newIcon("\EA4A"); } .ui-icon-circle-arrow-w, .ui-icon-circle-triangle-w { @include newIcon("\EA5C"); } .ui-icon-circle-arrow-n, .ui-icon-circle-triangle-n { @include newIcon("\EA72"); } .ui-icon-circle-zoomin { @include newIcon("\F2DB"); } .ui-icon-circle-zoomout { @include newIcon("\F2DD"); } .ui-icon-circle-check { @include newIcon("\EB81"); } .ui-icon-squaresmall-plus { @include newIcon("\EA10"); } .ui-icon-squaresmall-minus { @include newIcon("\EE56"); } .ui-icon-squaresmall-close { @include newIcon("\EB96"); } .ui-icon-grip-dotted-vertical, .ui-icon-grip-dotted-horizontal { @include newIcon("⦙⦙"); &::before { text-align: center; font-weight: 900 } } .ui-icon-grip-solid-vertical, .ui-icon-grip-solid-horizontal { @include newIcon("∥"); &::before { text-align: center; font-weight: 900 } } .ui-icon-grip-dotted-horizontal, .ui-icon-grip-solid-horizontal { transform: rotate(90deg); } .ui-icon-grip-diagonal-se, .ui-icon-gripsmall-diagonal-se { color: $gris20; @include newIcon("\EDDE"); clip-path: polygon(120% 0%, 0% 120%, 100% 100%); position: absolute; } .om-icon-fix { display: inline-block; float: none; }