aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/settings/supportFerdi/SupportFerdiDashboard.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/settings/supportFerdi/SupportFerdiDashboard.tsx')
-rw-r--r--src/components/settings/supportFerdi/SupportFerdiDashboard.tsx155
1 files changed, 20 insertions, 135 deletions
diff --git a/src/components/settings/supportFerdi/SupportFerdiDashboard.tsx b/src/components/settings/supportFerdi/SupportFerdiDashboard.tsx
index acebc979f..948d0c1d1 100644
--- a/src/components/settings/supportFerdi/SupportFerdiDashboard.tsx
+++ b/src/components/settings/supportFerdi/SupportFerdiDashboard.tsx
@@ -1,6 +1,4 @@
1import { defineMessages, useIntl } from 'react-intl'; 1import { defineMessages, useIntl } from 'react-intl';
2import { mdiOpenInNew } from '@mdi/js';
3import { Icon } from '../../ui/icon';
4 2
5const messages = defineMessages({ 3const messages = defineMessages({
6 headline: { 4 headline: {
@@ -9,60 +7,17 @@ const messages = defineMessages({
9 }, 7 },
10 aboutIntro: { 8 aboutIntro: {
11 id: 'settings.supportFerdi.aboutIntro', 9 id: 'settings.supportFerdi.aboutIntro',
12 defaultMessage: 10 defaultMessage: 'Special thanks goes to these awesome people:',
13 '<p>Ferdi is an open-source and a community-lead application.</p><p>Thanks to the people who make this possbile:</p>',
14 },
15 textListContributors: {
16 id: 'settings.supportFerdi.textListContributors',
17 defaultMessage: 'Full list of contributors',
18 },
19 textListContributorsHere: {
20 id: 'settings.supportFerdi.textListContributorsHere',
21 defaultMessage: 'here',
22 },
23 textVolunteers: {
24 id: 'settings.supportFerdi.textVolunteers',
25 defaultMessage:
26 'The development of Ferdi is done by volunteers. People who use Ferdi like you. They maintain, fix, and improve Ferdi in their spare time.',
27 },
28 textSupportWelcome: {
29 id: 'settings.supportFerdi.textSupportWelcome',
30 defaultMessage:
31 'Support is always welcome. You can find a list of the help we need',
32 },
33 textSupportWelcomeHere: {
34 id: 'settings.supportFerdi.textSupportWelcomeHere',
35 defaultMessage: 'here',
36 },
37 textExpenses: {
38 id: 'settings.supportFerdi.textExpenses',
39 defaultMessage:
40 'While volunteers do most of the work, we still need to pay for servers and certificates. As a community, we are fully transparent on funds we collect and spend - see our',
41 },
42 textOpenCollective: {
43 id: 'settings.supportFerdi.textOpenCollective',
44 defaultMessage: 'Open Collective',
45 },
46 textDonation: {
47 id: 'settings.supportFerdi.textDonation',
48 defaultMessage:
49 'If you feel like supporting Ferdi development with a donation, you can do so on both,',
50 },
51 textDonationAnd: {
52 id: 'settings.supportFerdi.textDonationAnd',
53 defaultMessage: 'and',
54 },
55 textGitHubSponsors: {
56 id: 'settings.supportFerdi.textGitHubSponsors',
57 defaultMessage: 'GitHub Sponsors',
58 }, 11 },
12 about: {
13 id: 'settings.supportFerdi.about',
14 defaultMessage: 'The development of Ferdi is done by contributors. People who use Ferdi like you. They maintain, fix, and improve Ferdi in their spare time.',
15 }
59}); 16});
60 17
61const SupportFerdiDashboard = () => { 18const SupportFerdiDashboard = () => {
62 const intl = useIntl(); 19 const intl = useIntl();
63 20
64 const aboutIntro = intl.formatMessage(messages.aboutIntro);
65
66 return ( 21 return (
67 <div className="settings__main"> 22 <div className="settings__main">
68 <div className="settings__header"> 23 <div className="settings__header">
@@ -74,16 +29,6 @@ const SupportFerdiDashboard = () => {
74 <div> 29 <div>
75 <p className="settings__support-badges"> 30 <p className="settings__support-badges">
76 <a 31 <a
77 href="https://github.com/getferdi/ferdi"
78 target="_blank"
79 rel="noreferrer"
80 >
81 <img
82 alt="GitHub Stars"
83 src="https://img.shields.io/github/stars/getferdi/ferdi?style=social"
84 />
85 </a>
86 <a
87 href="https://twitter.com/getferdi/" 32 href="https://twitter.com/getferdi/"
88 target="_blank" 33 target="_blank"
89 rel="noreferrer" 34 rel="noreferrer"
@@ -94,104 +39,44 @@ const SupportFerdiDashboard = () => {
94 /> 39 />
95 </a> 40 </a>
96 <a 41 <a
97 href="https://opencollective.com/getferdi#section-contributors" 42 href="https://github.com/getferdi/ferdi"
98 target="_blank" 43 target="_blank"
99 rel="noreferrer" 44 rel="noreferrer"
100 > 45 >
101 <img 46 <img
102 alt="Open Collective backers" 47 alt="GitHub Stars"
103 src="https://img.shields.io/opencollective/backers/getferdi?logo=open-collective" 48 src="https://img.shields.io/github/stars/getferdi/ferdi?style=social"
104 /> 49 />
105 </a> 50 </a>
51 <a target="_blank" href="https://crowdin.com/project/getferdi">
52 <img src="https://badges.crowdin.net/getferdi/localized.svg" alt="Crowdin"/>
53 </a>
106 <a 54 <a
107 href="https://opencollective.com/getferdi#section-contributors" 55 href="https://opencollective.com/getferdi#section-contributors"
108 target="_blank" 56 target="_blank"
109 rel="noreferrer" 57 rel="noreferrer"
110 > 58 >
111 <img 59 <img
112 alt="Open Collective sponsors" 60 alt="Open Collective backers"
113 src="https://img.shields.io/opencollective/sponsors/getferdi?logo=open-collective" 61 src="https://img.shields.io/opencollective/backers/getferdi?logo=open-collective"
114 />
115 </a>
116 </p>
117 <span dangerouslySetInnerHTML={{ __html: aboutIntro }} />
118 <br />
119 <br />
120 <p>
121 <a href="#contributors-via-opencollective">
122 <img
123 alt="GitHub contributors (non-exhaustive)"
124 width="100%"
125 src="https://opencollective.com/getferdi/contributors.svg?width=642&button=false"
126 /> 62 />
127 </a> 63 </a>
128 </p> 64 </p>
65 <p>{intl.formatMessage(messages.aboutIntro)}</p>
129 <p> 66 <p>
130 {intl.formatMessage(messages.textListContributors)}
131 <a 67 <a
132 href="https://github.com/getferdi/ferdi#contributors-" 68 href="https://github.com/getferdi/ferdi#contributors-"
133 target="_blank" 69 target="_blank"
134 className="link"
135 rel="noreferrer" 70 rel="noreferrer"
136 > 71 >
137 {' '} 72 <img
138 {intl.formatMessage(messages.textListContributorsHere)} 73 alt="GitHub contributors (non-exhaustive)"
139 <Icon icon={mdiOpenInNew} /> 74 width="100%"
140 </a> 75 src="https://opencollective.com/getferdi/contributors.svg?width=600&avatarHeight=42&button=off"
141 <br /> 76 />
142 <br />
143 </p>
144 <p>{intl.formatMessage(messages.textVolunteers)}</p>
145 <p>
146 {intl.formatMessage(messages.textSupportWelcome)}
147 <a
148 href="https://help.getferdi.com/general/support"
149 target="_blank"
150 className="link"
151 rel="noreferrer"
152 >
153 {' '}
154 {intl.formatMessage(messages.textSupportWelcomeHere)}
155 <Icon icon={mdiOpenInNew} />
156 </a>
157 </p>
158 <p>
159 {intl.formatMessage(messages.textExpenses)}
160 <a
161 href="https://opencollective.com/getferdi#section-budget"
162 target="_blank"
163 className="link"
164 rel="noreferrer"
165 >
166 {' '}
167 {intl.formatMessage(messages.textOpenCollective)}
168 <Icon icon={mdiOpenInNew} />
169 </a>
170 </p>
171 <p>
172 {intl.formatMessage(messages.textDonation)}
173 <a
174 href="https://opencollective.com/getferdi#section-contribute"
175 target="_blank"
176 className="link"
177 rel="noreferrer"
178 >
179 {' '}
180 {intl.formatMessage(messages.textOpenCollective)}
181 <Icon icon={mdiOpenInNew} />
182 </a>{' '}
183 {intl.formatMessage(messages.textDonationAnd)}
184 <a
185 href="https://github.com/sponsors/getferdi"
186 target="_blank"
187 className="link"
188 rel="noreferrer"
189 >
190 {' '}
191 {intl.formatMessage(messages.textGitHubSponsors)}
192 <Icon icon={mdiOpenInNew} />
193 </a> 77 </a>
194 </p> 78 </p>
79 <p className="settings__message">{intl.formatMessage(messages.about)}</p>
195 </div> 80 </div>
196 </div> 81 </div>
197 </div> 82 </div>