izaliamae/glitch-soc
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

[Glitch] Fix pixel alignment for some composer icons

Browse source 
Port 25ffe0af45 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Claire 2024-02-23 16:32:13 +01:00
parent 2dc244784c
commit ad0be125f5
23 changed files with 33 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
app/javascript/flavours/glitch/features/compose/components/content_type_button.jsx
View file

@ -2,6 +2,9 @@ import { useCallback } from 'react';
import { useIntl, defineMessages } from 'react-intl';
import SmallCodeIcon from '@/material-icons/400-20px/code.svg?react';
import SmallDescriptionIcon from '@/material-icons/400-20px/description.svg?react';
import SmallMarkdownIcon from '@/material-icons/400-20px/markdown.svg?react';
import CodeIcon from '@/material-icons/400-24px/code.svg?react';
import DescriptionIcon from '@/material-icons/400-24px/description.svg?react';
import MarkdownIcon from '@/material-icons/400-24px/markdown.svg?react';
@ -48,9 +51,9 @@ export const ContentTypeButton = () => {
}[contentType];
const iconComponent = {
'text/plain': DescriptionIcon,
'text/markdown': MarkdownIcon,
'text/html': CodeIcon,
'text/plain': SmallDescriptionIcon,
'text/markdown': SmallMarkdownIcon,
'text/html': SmallCodeIcon,
}[contentType];
return (

2
app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.jsx
View file

@ -10,7 +10,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import { supportsPassiveEvents } from 'detect-passive-events';
import Overlay from 'react-overlays/Overlay';
import MoodIcon from '@/material-icons/400-24px/mood.svg?react';
import MoodIcon from '@/material-icons/400-20px/mood.svg?react';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { useSystemEmojiFont } from 'flavours/glitch/initial_state';
import { assetHost } from 'flavours/glitch/utils/config';

4
app/javascript/flavours/glitch/features/compose/components/federation_button.jsx
View file

@ -2,6 +2,8 @@ import { useCallback } from 'react';
import { useIntl, defineMessages } from 'react-intl';
import SmallShareIcon from '@/material-icons/400-20px/share.svg?react';
import SmallShareOffIcon from '@/material-icons/400-20px/share_off.svg?react';
import ShareIcon from '@/material-icons/400-24px/share.svg?react';
import ShareOffIcon from '@/material-icons/400-24px/share_off.svg?react';
import { changeComposeAdvancedOption } from 'flavours/glitch/actions/compose';
@ -37,7 +39,7 @@ export const FederationButton = () => {
<DropdownIconButton
disabled={isEditing}
icon={do_not_federate ? 'link-slash' : 'link'}
iconComponent={do_not_federate ? ShareOffIcon : ShareIcon}
iconComponent={do_not_federate ? SmallShareOffIcon : SmallShareIcon}
onChange={handleChange}
options={options}
title={intl.formatMessage(messages.change_federation_settings)}

2
app/javascript/flavours/glitch/features/compose/components/poll_button.jsx
View file

@ -3,7 +3,7 @@ import { PureComponent } from 'react';
import { defineMessages, injectIntl } from 'react-intl';
import BarChart4BarsIcon from '@/material-icons/400-24px/bar_chart_4_bars.svg?react';
import BarChart4BarsIcon from '@/material-icons/400-20px/bar_chart_4_bars.svg?react';
import { IconButton } from '../../../components/icon_button';

2
app/javascript/flavours/glitch/features/compose/components/thread_mode_button.jsx
View file

@ -2,7 +2,7 @@ import { useCallback } from 'react';
import { useIntl, defineMessages } from 'react-intl';
import QuickreplyIcon from '@/material-icons/400-24px/quickreply.svg?react';
import QuickreplyIcon from '@/material-icons/400-20px/quickreply.svg?react';
import { changeComposeAdvancedOption } from 'flavours/glitch/actions/compose';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { useAppSelector, useAppDispatch } from 'flavours/glitch/store';

2
app/javascript/flavours/glitch/features/compose/components/upload.jsx
View file

@ -9,7 +9,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import spring from 'react-motion/lib/spring';
import CloseIcon from '@/material-icons/400-24px/close.svg?react';
import CloseIcon from '@/material-icons/400-20px/close.svg?react';
import EditIcon from '@/material-icons/400-24px/edit.svg?react';
import WarningIcon from '@/material-icons/400-24px/warning.svg?react';
import { Blurhash } from 'flavours/glitch/components/blurhash';

2
app/javascript/flavours/glitch/features/compose/components/upload_button.jsx
View file

@ -6,7 +6,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { connect } from 'react-redux';
import PhotoLibraryIcon from '@/material-icons/400-24px/photo_library.svg?react';
import PhotoLibraryIcon from '@/material-icons/400-20px/photo_library.svg?react';
import { IconButton } from 'flavours/glitch/components/icon_button';
const messages = defineMessages({

2
app/javascript/flavours/glitch/features/compose/containers/spoiler_button_container.js
View file

@ -2,7 +2,7 @@ import { injectIntl, defineMessages } from 'react-intl';
import { connect } from 'react-redux';
import WarningIcon from '@/material-icons/400-24px/warning.svg?react';
import WarningIcon from '@/material-icons/400-20px/warning.svg?react';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { changeComposeSpoilerness } from '../../../actions/compose';

12
app/javascript/flavours/glitch/styles/components.scss
View file

@ -669,12 +669,12 @@ body > [data-popper-placement] {
}
.icon-button.compose-form__upload__delete {
padding: 3px;
padding: 2px;
border-radius: 50%;
.icon {
width: 18px;
height: 18px;
width: 20px;
height: 20px;
}
}
@ -769,12 +769,12 @@ body > [data-popper-placement] {
}
.icon-button {
padding: 3px;
padding: 2px;
}
.icon-button .icon {
width: 18px;
height: 18px;
width: 20px;
height: 20px;
}
}

1
app/javascript/material-icons/400-20px/code-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M336-240 96-480l240-240 51 51-189 189 189 189-51 51Zm288 0-51-51 189-189-189-189 51-51 240 240-240 240Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 209 B

1
app/javascript/material-icons/400-20px/code.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M336-240 96-480l240-240 51 51-189 189 189 189-51 51Zm288 0-51-51 189-189-189-189 51-51 240 240-240 240Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 209 B

1
app/javascript/material-icons/400-20px/description-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M336-240h288v-72H336v72Zm0-144h288v-72H336v72ZM263.717-96Q234-96 213-117.15T192-168v-624q0-29.7 21.15-50.85Q234.3-864 264-864h312l192 192v504q0 29.7-21.162 50.85Q725.676-96 695.96-96H263.717ZM528-624h168L528-792v168Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 322 B

1
app/javascript/material-icons/400-20px/description.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M336-240h288v-72H336v72Zm0-144h288v-72H336v72ZM263.717-96Q234-96 213-117.15T192-168v-624q0-29.7 21.15-50.85Q234.3-864 264-864h312l192 192v504q0 29.7-21.162 50.85Q725.676-96 695.96-96H263.717ZM528-624v-168H264v624h432v-456H528ZM264-792v189-189 624-624Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 357 B

1
app/javascript/material-icons/400-20px/markdown-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="m600-384 96-96-34-34-38 38v-100h-48v100l-38-39-34 35 96 96ZM168-192q-29.7 0-50.85-21.162Q96-234.324 96-264.04v-432.243Q96-726 117.15-747T168-768h624q29.7 0 50.85 21.162Q864-725.676 864-695.96v432.243Q864-234 842.85-213T792-192H168Zm72-192h48v-144h24v96h48v-96h24v144h48v-168q0-10.2-6.9-17.1-6.9-6.9-17.1-6.9H264q-10.2 0-17.1 6.9-6.9 6.9-6.9 17.1v168Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 456 B

1
app/javascript/material-icons/400-20px/markdown.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="m600-384 96-96-34-34-38 38v-100h-48v100l-38-39-34 35 96 96ZM168-192q-29.7 0-50.85-21.162Q96-234.324 96-264.04v-432.243Q96-726 117.15-747T168-768h624q29.7 0 50.85 21.162Q864-725.676 864-695.96v432.243Q864-234 842.85-213T792-192H168Zm0-72h624v-432H168v432Zm0 0v-432 432Zm72-120h48v-144h24v96h48v-96h24v144h48v-168q0-10.2-6.9-17.1-6.9-6.9-17.1-6.9H264q-10.2 0-17.1 6.9-6.9 6.9-6.9 17.1v168Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 493 B

1
app/javascript/material-icons/400-20px/quickreply-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M750-48v-192h-78v-240h192l-60 156h84L750-48ZM96-96v-696q0-29 21.5-50.5T168-864h624q30 0 51 21.5t21 50.5v240H600v312H240L96-96Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 232 B

1
app/javascript/material-icons/400-20px/quickreply.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M96-96v-696q0-29 21.5-50.5T168-864h624q29.7 0 50.85 21.5Q864-821 864-792v240h-72v-240H168v522l42-42h390v72H240L96-96Zm72-216v-480 480ZM750-48v-192h-78v-240h192l-60 156h84L750-48Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 284 B

1
app/javascript/material-icons/400-20px/share-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M696-96q-50 0-85-35t-35-85q0-8 1-14.5t3-14.5L342-390q-15 16-35.354 23T264-360q-50 0-85-35t-35-85q0-50 35-85t85-35q22 0 42.5 7.5T342-570l238-145q-2-8-3-14.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-22.292 0-42.646-7T618-654L380-509q2 8 3 14.5t1 14.5q0 8-1 14.5t-3 14.5l238 145q15-17 35.354-23.5T696-336q50 0 85 35t35 85q0 50-35 85t-85 35Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 463 B

1
app/javascript/material-icons/400-20px/share.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M696-96q-50 0-85-35t-35-85q0-8 1-14.5t3-14.5L342-390q-15 16-35.354 23T264-360q-50 0-85-35t-35-85q0-50 35-85t85-35q22 0 42.5 7.5T342-570l238-145q-2-8-3-14.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-22.292 0-42.646-7T618-654L380-509q2 8 3 14.5t1 14.5q0 8-1 14.5t-3 14.5l238 145q15-17 35.354-23.5T696-336q50 0 85 35t35 85q0 50-35 85t-85 35Zm0-600q20.4 0 34.2-13.8Q744-723.6 744-744q0-20.4-13.8-34.2Q716.4-792 696-792q-20.4 0-34.2 13.8Q648-764.4 648-744q0 20.4 13.8 34.2Q675.6-696 696-696ZM264-432q20.4 0 34.2-13.8Q312-459.6 312-480q0-20.4-13.8-34.2Q284.4-528 264-528q-20.4 0-34.2 13.8Q216-500.4 216-480q0 20.4 13.8 34.2Q243.6-432 264-432Zm432 264q20.4 0 34.2-13.8Q744-195.6 744-216q0-20.4-13.8-34.2Q716.4-264 696-264q-20.4 0-34.2 13.8Q648-236.4 648-216q0 20.4 13.8 34.2Q675.6-168 696-168Zm0-576ZM264-480Zm432 264Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 936 B

1
app/javascript/material-icons/400-20px/share_off-fill.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M240.226-432Q320-432 376-375.774t56 136Q432-160 375.774-104t-136 56Q160-48 104-104.226t-56-136Q48-320 104.226-376t136-56ZM239-212l56 56 29-29-56-56 56-56-29-29-56 56-56-56-29 29 56 56-56 56 29 29 56-56Zm457-412q-22.292 0-42.646-7T618-654L380-509q3 17 3.5 25.5T382-462q-31-20-67.196-31-36.195-11-74.804-11-26 0-49.5 4.5T144-486q2-48 37-81t83-33q22.292 0 42.646 7.5T342-570l238-145q-2-8-3-14.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35Zm0 528q-50 0-85-35t-35-85q0-8 1-14.5t3-14.5l-82-50q-8-35-23.5-65.5T436-417l182 111q15-17 35.354-23.5T696-336q50 0 85 35t35 85q0 50-35 85t-85 35Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 702 B

1
app/javascript/material-icons/400-20px/share_off.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 -960 960 960" width="20"><path d="M696-696q20.4 0 34.2-13.8Q744-723.6 744-744q0-20.4-13.8-34.2Q716.4-792 696-792q-20.4 0-34.2 13.8Q648-764.4 648-744q0 20.4 13.8 34.2Q675.6-696 696-696Zm0 528q20.4 0 34.2-13.8Q744-195.6 744-216q0-20.4-13.8-34.2Q716.4-264 696-264q-20.4 0-34.2 13.8Q648-236.4 648-216q0 20.4 13.8 34.2Q675.6-168 696-168Zm0-576Zm0 528ZM239.774-48Q160-48 104-104.226t-56-136Q48-320 104.226-376t136-56Q320-432 376-375.774t56 136Q432-160 375.774-104t-136 56ZM144-486q2-48 37-81t83-33q22.292 0 42.646 7.5T342-570l238-145q-2-8-3-14.5t-1-14.5q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-22.292 0-42.646-7T618-654L380-509q3 17 3.5 25.5T382-462q-31-20-67.196-31-36.195-11-74.804-11-26 0-49.5 4.5T144-486ZM696-96q-50 0-85-35t-35-85q0-8 1-14.5t3-14.5l-82-50q-8-35-23.5-65.5T436-417l182 111q15-17 35.354-23.5T696-336q50 0 85 35t35 85q0 50-35 85t-85 35ZM239-212l56 56 29-29-56-56 56-56-29-29-56 56-56-56-29 29 56 56-56 56 29 29 56-56Z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 1,014 B

1
app/javascript/material-icons/400-24px/quickreply-fill.svg
View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M760-40v-200h-80v-240h200l-68 160h88L760-40ZM80-80v-720q0-33 23.5-56.5T160-880h640q33 0 56.5 23.5T880-800v240H600v320H240L80-80Z"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 234 B

1
app/javascript/material-icons/400-24px/quickreply.svg
View file

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M80-80v-720q0-33 23.5-56.5T160-880h640q33 0 56.5 23.5T880-800v240h-80v-240H160v525l46-45h394v80H240L80-80Zm80-240v-480 480ZM760-40v-200h-80v-240h200l-68 160h88L760-40Z"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 273 B