Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Photos picker: Media library: Update Google Photos icon #96870

Merged
merged 1 commit into from
Nov 28, 2024
Merged

Photos picker: Media library: Update Google Photos icon #96870

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion client/my-sites/media-library/data-source.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import PopoverMenu from 'calypso/components/popover-menu';
import PopoverMenuItem from 'calypso/components/popover-menu/item';
import { canCurrentUser } from 'calypso/state/selectors/can-current-user';
import { getSelectedSiteId } from 'calypso/state/ui/selectors';
import GooglePhotosIcon from './google-photos-icon';
import OpenverseIcon from './openverse-icon';
import PexelsIcon from './pexels-icon';

Expand Down Expand Up @@ -54,7 +55,7 @@ export class MediaLibraryDataSource extends Component {
sources.push( {
value: 'google_photos',
label: translate( 'Google Photos' ),
icon: <Gridicon icon="image-multiple" size={ 24 } />,
icon: <GooglePhotosIcon className="gridicon" />,
} );
}
if ( config.isEnabled( 'external-media/free-photo-library' ) && includeExternalMedia ) {
Expand Down
36 changes: 36 additions & 0 deletions client/my-sites/media-library/google-photos-icon.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
const GooglePhotosIcon = ( props ) => (
<svg
style={ {
padding: '2px',
width: '20px',
height: '18px',
} }
width="46"
height="46"
viewBox="0 0 46 46"
xmlns="http://www.w3.org/2000/svg"
{ ...props }
>
<g clip-path="url(#clip0_3_5000)">
<path
opacity="0.4"
d="M11.5 10.4553C17.8511 10.4553 23 15.6034 23 21.9553V23.0001H1.04475C0.467797 23.0001 0 22.5323 0 21.9553C0 15.6034 5.14888 10.4553 11.5 10.4553Z"
/>
<path d="M35.5447 11.5C35.5447 17.8511 30.3966 23 24.0447 23H23V1.04475C23 0.467797 23.4678 0 24.0447 0C30.3966 0 35.5447 5.14888 35.5447 11.5Z" />
<path
opacity="0.8"
d="M34.5 35.5447C28.1489 35.5447 23 30.3966 23 24.0447V23H44.9553C45.5322 23 46 23.4678 46 24.0447C46 30.3966 40.8511 35.5447 34.5 35.5447Z"
/>
<path
opacity="0.6"
d="M10.4553 34.5C10.4553 28.1489 15.6034 23 21.9553 23H23V44.9553C23 45.5322 22.5322 46 21.9553 46C15.6034 46 10.4553 40.8511 10.4553 34.5Z"
/>
</g>
<defs>
<clipPath id="clip0_3_5000">
<rect width="46" height="46" fill="white" />
</clipPath>
</defs>
</svg>
);
export default GooglePhotosIcon;