DGNum/demarches-normaliennes
14
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

replace fontawesome with heroicons

Browse source
This commit is contained in:
Paul Chavard 2021-04-28 16:05:44 +02:00
parent aae5f3f0db
commit 69ab7854c2
9 changed files with 21 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
app/assets/stylesheets/buttons.scss
View file

@ -130,6 +130,11 @@
}
}
.icon-size {
width: 18px;
height: 18px;
}
.state-button {
display: inline-block;
}

2
app/javascript/components/ComboMultipleDropdownList.jsx
View file

@ -241,7 +241,7 @@ function ComboboxToken({ value, ...props }) {
onRemove(value);
}}
>
<XIcon style={{ width: '15px', height: '15px' }} />
<XIcon className="icon-size" />
<span className="screen-reader-text">Désélectionner</span>
</button>
{value}

10
app/javascript/components/TypesDeChampEditor/components/MoveButton.jsx
View file

@ -1,16 +1,20 @@
import React from 'react';
import PropTypes from 'prop-types';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { ArrowDownIcon, ArrowUpIcon } from '@heroicons/react/solid';
function MoveButton({ isEnabled, icon, title, onClick }) {
return (
<button
className="button small icon-only move"
className="button small move"
disabled={!isEnabled}
title={title}
onClick={onClick}
>
<FontAwesomeIcon icon={icon} />
{icon == 'arrow-up' ? (
<ArrowUpIcon className="icon-size" />
) : (
<ArrowDownIcon className="icon-size" />
)}
</button>
);
}

5
app/javascript/components/TypesDeChampEditor/components/TypeDeChamp.jsx
View file

@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { sortableElement, sortableHandle } from 'react-sortable-hoc';
import { useInView } from 'react-intersection-observer';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { TrashIcon } from '@heroicons/react/outline';
import DescriptionInput from './DescriptionInput';
import LibelleInput from './LibelleInput';
@ -77,7 +77,8 @@ const TypeDeChamp = sortableElement(
});
}}
>
<FontAwesomeIcon icon="trash" title="Supprimer" />
<TrashIcon className="icon-size" />
<span className="screen-reader-text">Supprimer</span>
</button>
</div>
</div>

4
app/javascript/components/TypesDeChampEditor/components/TypeDeChampRepetitionOptions.jsx
View file

@ -1,6 +1,6 @@
import React, { useReducer } from 'react';
import PropTypes from 'prop-types';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { PlusIcon } from '@heroicons/react/outline';
import { SortableContainer, addChampLabel } from '../utils';
import TypeDeChamp from './TypeDeChamp';
@ -45,7 +45,7 @@ function TypeDeChampRepetitionOptions({
})
}
>
<FontAwesomeIcon icon="plus" size="sm" />
<PlusIcon className="icon-size" />
&nbsp;&nbsp;
{addChampLabel(state.isAnnotation)}
</button>

6
app/javascript/components/TypesDeChampEditor/components/TypeDeChamps.jsx
View file

@ -1,6 +1,6 @@
import React, { useReducer } from 'react';
import PropTypes from 'prop-types';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { PlusIcon, ArrowCircleDownIcon } from '@heroicons/react/outline';
import { SortableContainer, addChampLabel } from '../utils';
import TypeDeChamp from './TypeDeChamp';
@ -38,7 +38,7 @@ function TypeDeChamps({ state: rootState, typeDeChamps }) {
</SortableContainer>
{state.typeDeChamps.length === 0 && (
<h2>
<FontAwesomeIcon icon="arrow-circle-down" />
<ArrowCircleDownIcon className="icon-size" />
&nbsp;&nbsp;Cliquez sur le bouton «&nbsp;
{addChampLabel(state.isAnnotation)}&nbsp;» pour créer votre premier
champ.
@ -56,7 +56,7 @@ function TypeDeChamps({ state: rootState, typeDeChamps }) {
})
}
>
<FontAwesomeIcon icon="plus" size="sm" />
<PlusIcon className="icon-size" />
&nbsp;&nbsp;
{addChampLabel(state.isAnnotation)}
</button>

17
app/javascript/components/TypesDeChampEditor/index.jsx
View file

@ -1,27 +1,10 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faArrowCircleDown } from '@fortawesome/free-solid-svg-icons/faArrowCircleDown';
import { faArrowDown } from '@fortawesome/free-solid-svg-icons/faArrowDown';
import { faArrowsAltV } from '@fortawesome/free-solid-svg-icons/faArrowsAltV';
import { faArrowUp } from '@fortawesome/free-solid-svg-icons/faArrowUp';
import { faPlus } from '@fortawesome/free-solid-svg-icons/faPlus';
import { faTrash } from '@fortawesome/free-solid-svg-icons/faTrash';
import Flash from './Flash';
import OperationsQueue from './OperationsQueue';
import TypeDeChamps from './components/TypeDeChamps';
library.add(
faArrowCircleDown,
faArrowDown,
faArrowsAltV,
faArrowUp,
faPlus,
faTrash
);
class TypesDeChampEditor extends Component {
constructor(props) {
super(props);

3
package.json
View file

@ -1,9 +1,6 @@
{
"dependencies": {
"@babel/preset-react": "^7.12.13",
"@fortawesome/fontawesome-svg-core": "^1.2.34",
"@fortawesome/free-solid-svg-icons": "^5.15.2",
"@fortawesome/react-fontawesome": "^0.1.14",
"@heroicons/react": "^1.0.1",
"@mapbox/mapbox-gl-draw": "^1.2.2",
"@rails/actiontext": "^6.0.3",

26
yarn.lock
View file

@ -1005,32 +1005,6 @@
enabled "2.0.x"
kuler "^2.0.0"
"@fortawesome/fontawesome-common-types@^0.2.34":
version "0.2.34"
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.34.tgz#0a8c348bb23b7b760030f5b1d912e582be4ec915"
integrity sha512-XcIn3iYbTEzGIxD0/dY5+4f019jIcEIWBiHc3KrmK/ROahwxmZ/s+tdj97p/5K0klz4zZUiMfUlYP0ajhSJjmA==
"@fortawesome/fontawesome-svg-core@^1.2.34":
version "1.2.34"
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.34.tgz#1d1a7c92537cbc2b8a83eef6b6d824b4b5b46b26"
integrity sha512-0KNN0nc5eIzaJxlv43QcDmTkDY1CqeN6J7OCGSs+fwGPdtv0yOQqRjieopBCmw+yd7uD3N2HeNL3Zm5isDleLg==
dependencies:
"@fortawesome/fontawesome-common-types" "^0.2.34"
"@fortawesome/free-solid-svg-icons@^5.15.2":
version "5.15.2"
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.15.2.tgz#25bb035de57cf85aee8072965732368ccc8e8943"
integrity sha512-ZfCU+QjaFsdNZmOGmfqEWhzI3JOe37x5dF4kz9GeXvKn/sTxhqMtZ7mh3lBf76SvcYY5/GKFuyG7p1r4iWMQqw==
dependencies:
"@fortawesome/fontawesome-common-types" "^0.2.34"
"@fortawesome/react-fontawesome@^0.1.14":
version "0.1.14"
resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.14.tgz#bf28875c3935b69ce2dc620e1060b217a47f64ca"
integrity sha512-4wqNb0gRLVaBm/h+lGe8UfPPivcbuJ6ecI4hIgW0LjI7kzpYB9FkN0L9apbVzg+lsBdcTf0AlBtODjcSX5mmKA==
dependencies:
prop-types "^15.7.2"
"@heroicons/react@^1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@heroicons/react/-/react-1.0.1.tgz#66d25f6441920bd5c2146ea27fd33995885452dd"