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

Jump to bottom

🐛 [firebase_ui_oauth_google] Google Icon in GoogleSignInButton doesn't fit properly in dark mode #16

Open
flying-wizzy opened this issue May 31, 2023 · 2 comments · May be fixed by #438
Open

🐛 [firebase_ui_oauth_google] Google Icon in GoogleSignInButton doesn't fit properly in dark mode #16

flying-wizzy opened this issue May 31, 2023 · 2 comments · May be fixed by #438
Labels
auth Keep Open Keep PR or issue open oauth

Comments

@flying-wizzy
Copy link

Bug report

Describe the bug
When the GoogleSignInButton enters dark mode, the background color of the icon has an ugly overlay with the button color. Tested on Pixel 6 Pro Android Device with "UpsideDownCake" Api and useMaterial3: true.

Steps to reproduce

Steps to reproduce the behavior:

  1. Create a GoogleSignInButton and switch your theme to dark mode. Observe.

Expected behavior

I would expect either:

  • no ugly color overlay or
  • no background color of the Google icon

Flutter doctor

Run flutter doctor and paste the output below:

Click To Expand 
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.10.2, on Microsoft Windows [Version 10.0.19045.2965], locale de-DE)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.2)
[√] Chrome - develop for the web                                                
[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.3.6)   
[√] Android Studio (version 2022.1)                                             
[√] Android Studio (version 2022.2)                                             
[√] VS Code (version 1.74.2)                                                    
[√] Connected device (4 available)                                              
[√] Network resources                                                           

• No issues found!

Flutter dependencies

Run flutter pub deps -- --style=compact and paste the output below:

Click To Expand 
Dart SDK 3.0.2
Flutter SDK 3.10.2
mwe 1.0.0+1

dependencies:
- background_downloader 7.2.0 [flutter logging http path_provider path async mime collection]
- chewie 1.5.0 [cupertino_icons flutter provider video_player wakelock]
- cupertino_icons 1.0.5
- firebase_auth 4.6.2 [firebase_auth_platform_interface firebase_auth_web firebase_core firebase_core_platform_interface flutte
r meta]
- firebase_core 2.13.1 [firebase_core_platform_interface firebase_core_web flutter meta]
- firebase_database 10.2.2 [firebase_core firebase_core_platform_interface firebase_database_platform_interface firebase_databa
se_web flutter]
- firebase_ui_auth 1.4.2 [email_validator firebase_auth firebase_core firebase_dynamic_links firebase_ui_localizations firebase
_ui_oauth firebase_ui_shared flutter flutter_localizations]
- firebase_ui_database 1.3.2 [collection firebase_database firebase_ui_localizations flutter]
- firebase_ui_localizations 1.5.0 [flutter flutter_localizations path]
- firebase_ui_oauth_apple 1.2.2 [firebase_auth firebase_ui_oauth flutter]
- firebase_ui_oauth_google 1.2.2 [firebase_auth firebase_ui_oauth flutter google_sign_in]
- flex_color_scheme 7.1.2 [flex_seed_scheme flutter meta]
- flutter 0.0.0 [characters collection js material_color_utilities meta vector_math sky_engine]
- flutter_localizations 0.0.0 [flutter intl characters clock collection js material_color_utilities meta path vector_math]     
- flutter_markdown 0.6.15 [flutter markdown meta path]
- flutter_native_splash 2.3.0 [args flutter flutter_web_plugins js html image meta path universal_io xml yaml]
- flutter_platform_widgets 3.3.5 [flutter cupertino_icons]
- flutter_svg 2.0.6 [flutter vector_graphics vector_graphics_codec vector_graphics_compiler]
- fluttertoast 8.2.2 [flutter flutter_web_plugins]
- http 0.13.6 [async http_parser meta]
- internet_connection_checker 1.0.0+1
- intl 0.18.0 [clock meta path]
- native_device_orientation 1.1.4 [flutter meta]
- package_info_plus 3.1.2 [ffi flutter flutter_web_plugins http meta path package_info_plus_platform_interface win32]
- path_provider 2.0.15 [flutter path_provider_android path_provider_foundation path_provider_linux path_provider_platform_inter
face path_provider_windows]
- provider 6.0.5 [collection flutter nested]
- shared_preferences 2.1.1 [flutter shared_preferences_android shared_preferences_foundation shared_preferences_linux shared_pr
eferences_platform_interface shared_preferences_web shared_preferences_windows]
- sqflite 2.2.8+4 [flutter sqflite_common path]
- video_player 2.6.1 [flutter html video_player_android video_player_avfoundation video_player_platform_interface video_player_
web]

dev dependencies:
- flutter_launcher_icons 0.13.1 [args checked_yaml cli_util image json_annotation path yaml]
- flutter_lints 2.0.1 [lints]
- flutter_test 0.0.0 [flutter test_api path fake_async clock stack_trace vector_math async boolean_selector characters collecti
on js matcher material_color_utilities meta source_span stream_channel string_scanner term_glyph]

transitive dependencies:
- _flutterfire_internals 1.3.2 [collection firebase_core firebase_core_platform_interface flutter meta]
- archive 3.3.7 [crypto path pointycastle]
- args 2.4.1
- async 2.11.0 [collection meta]
- boolean_selector 2.1.1 [source_span string_scanner]
- characters 1.3.0
- checked_yaml 2.0.3 [json_annotation source_span yaml]
- cli_util 0.4.0 [meta path]
- clock 1.1.1
- collection 1.17.1
- convert 3.1.1 [typed_data]
- crypto 3.0.3 [typed_data]
- csslib 0.17.3 [source_span]
- desktop_webview_auth 0.0.12 [crypto flutter http flutter_web_plugins plugin_platform_interface]
- email_validator 2.1.17
- fake_async 1.3.1 [clock collection]
- ffi 2.0.2
- file 6.1.4 [meta path]
- firebase_auth_platform_interface 6.15.2 [_flutterfire_internals collection firebase_core flutter meta plugin_platform_interfa
ce]
- firebase_auth_web 5.5.2 [firebase_auth_platform_interface firebase_core firebase_core_web flutter flutter_web_plugins http_pa
rser js meta]
- firebase_core_platform_interface 4.8.0 [collection flutter flutter_test meta plugin_platform_interface]
- firebase_core_web 2.5.0 [firebase_core_platform_interface flutter flutter_web_plugins js meta]
- firebase_database_platform_interface 0.2.5+2 [_flutterfire_internals collection firebase_core flutter meta plugin_platform_in
terface]
- firebase_database_web 0.2.3+2 [firebase_core firebase_core_web firebase_database_platform_interface flutter flutter_web_plugi
ns js]
- firebase_dynamic_links 5.3.2 [firebase_core firebase_core_platform_interface firebase_dynamic_links_platform_interface flutte
r meta plugin_platform_interface]
- firebase_dynamic_links_platform_interface 0.2.6+2 [_flutterfire_internals firebase_core flutter meta plugin_platform_interfac
e]
- firebase_ui_oauth 1.4.2 [desktop_webview_auth firebase_auth firebase_ui_auth firebase_ui_shared flutter_svg flutter]
- firebase_ui_shared 1.3.0 [flutter]
- flex_seed_scheme 1.3.0 [collection flutter meta]
- flutter_web_plugins 0.0.0 [flutter js characters collection material_color_utilities meta vector_math]
- google_identity_services_web 0.2.1 [js meta]
- google_sign_in 6.1.3 [flutter google_sign_in_android google_sign_in_ios google_sign_in_platform_interface google_sign_in_web]
- google_sign_in_android 6.1.14 [flutter google_sign_in_platform_interface]
- google_sign_in_ios 5.6.2 [flutter google_sign_in_platform_interface]
- google_sign_in_platform_interface 2.4.1 [flutter plugin_platform_interface quiver]
- google_sign_in_web 0.12.0+1 [flutter flutter_web_plugins google_identity_services_web google_sign_in_platform_interface http 
js]
- html 0.15.3 [csslib source_span]
- http_parser 4.0.2 [collection source_span string_scanner typed_data]
- image 4.0.17 [archive meta xml]
- js 0.6.7 [meta]
- json_annotation 4.8.1 [meta]
- lints 2.1.0
- logging 1.2.0
- markdown 7.1.0 [args meta]
- matcher 0.12.15 [async meta stack_trace term_glyph test_api]
- material_color_utilities 0.2.0
- meta 1.9.1
- mime 1.0.4
- nested 1.0.0 [flutter]
- package_info_plus_platform_interface 2.0.1 [flutter meta plugin_platform_interface]
- path 1.8.3
- path_parsing 1.0.1 [vector_math meta]
- path_provider_android 2.0.27 [flutter path_provider_platform_interface]
- path_provider_foundation 2.2.3 [flutter path_provider_platform_interface]
- path_provider_linux 2.1.11 [ffi flutter path path_provider_platform_interface xdg_directories]
- path_provider_platform_interface 2.0.6 [flutter platform plugin_platform_interface]
- path_provider_windows 2.1.6 [ffi flutter path path_provider_platform_interface win32]
- petitparser 5.4.0 [meta]
- platform 3.1.0
- plugin_platform_interface 2.1.4 [meta]
- pointycastle 3.7.3 [collection convert js]
- process 4.2.4 [file path platform]
- quiver 3.2.1 [matcher]
- shared_preferences_android 2.1.4 [flutter shared_preferences_platform_interface]
- shared_preferences_foundation 2.2.2 [flutter shared_preferences_platform_interface]
- shared_preferences_linux 2.2.0 [file flutter path path_provider_linux path_provider_platform_interface shared_preferences_pla
tform_interface]
- shared_preferences_platform_interface 2.2.0 [flutter plugin_platform_interface]
- shared_preferences_web 2.1.0 [flutter flutter_web_plugins shared_preferences_platform_interface]
- shared_preferences_windows 2.2.0 [file flutter path path_provider_platform_interface path_provider_windows shared_preferences
_platform_interface]
- sky_engine 0.0.99
- source_span 1.9.1 [collection path term_glyph]
- sqflite_common 2.4.5 [synchronized path meta]
- stack_trace 1.11.0 [path]
- stream_channel 2.1.1 [async]
- string_scanner 1.2.0 [source_span]
- synchronized 3.1.0
- term_glyph 1.2.1
- test_api 0.5.1 [async boolean_selector collection meta source_span stack_trace stream_channel string_scanner term_glyph match
er]
- typed_data 1.3.2 [collection]
- universal_io 2.2.0 [collection meta typed_data]
- vector_graphics 1.1.6 [flutter vector_graphics_codec]
- vector_graphics_codec 1.1.6
- vector_graphics_compiler 1.1.6 [args meta path_parsing xml vector_graphics_codec]
- vector_math 2.1.4
- video_player_android 2.4.8 [flutter video_player_platform_interface]
- video_player_avfoundation 2.4.6 [flutter video_player_platform_interface]
- video_player_platform_interface 6.1.0 [flutter plugin_platform_interface]
- video_player_web 2.0.16 [flutter flutter_web_plugins video_player_platform_interface]
- wakelock 0.6.2 [flutter meta wakelock_macos wakelock_platform_interface wakelock_web wakelock_windows]
- wakelock_macos 0.4.0 [flutter flutter_web_plugins wakelock_platform_interface]
- wakelock_platform_interface 0.3.0 [flutter meta]
- wakelock_web 0.4.0 [flutter flutter_web_plugins js wakelock_platform_interface]
- wakelock_windows 0.2.1 [flutter wakelock_platform_interface win32]
- win32 3.1.4 [ffi]
- xdg_directories 1.0.0 [meta path process]
- xml 6.3.0 [collection meta petitparser]
- yaml 3.1.2 [collection source_span string_scanner]

uglyoverlay
@danagbemava-nc danagbemava-nc changed the title 🐛 [firebase_ui_oauth_google] Ugly overlaying color in GoogleSignInButton in dark mode 🐛 [firebase_ui_oauth_google] Google Icon in GoogleSignInButton doesn't fit properly in dark mode Jun 1, 2023
@danagbemava-nc
Copy link
Contributor

danagbemava-nc commented Jun 1, 2023 •
edited
Loading

Reproduces using the package code sample. It may not fit properly in light mode as well, but it is visible in dark mode.

code sample 
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_ui_auth/firebase_ui_auth.dart';
import 'package:firebase_ui_oauth_google/firebase_ui_oauth_google.dart';
import 'package:flutter/material.dart';

import 'firebase_options.dart';

Future<void> main() async {
    WidgetsFlutterBinding.ensureInitialized();
    await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);

    FirebaseUIAuth.configureProviders([
        GoogleProvider(clientId: 'clientId'),
    ]);

    runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key}) ;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(brightness: Brightness.dark),
      home: SignInScreen(
        actions: [
          AuthStateChangeAction<SignedIn>((context, state) {
            // redirect to other screen
          })
        ],
      ),
    );
  }
}

@lesnitsky lesnitsky transferred this issue from firebase/flutterfire Aug 18, 2023
@cnkygmr cnkygmr mentioned this issue Sep 2, 2024
Open
1 task
@github-actions GitHub Actions
Copy link

Hello 👋, to help manage issues we automatically close stale issues.

This issue has been automatically marked as stale because it has not had activity for quite some time. Has this issue been fixed, or does it still require attention?

This issue will be closed in 15 days if no further activity occurs.

Thank you for your contributions.

@github-actions github-actions bot added the Stale Issue with no recent activity label Nov 12, 2024
@russellwheatley russellwheatley added Keep Open Keep PR or issue open and removed Stale Issue with no recent activity labels Nov 12, 2024
@flying-wizzy flying-wizzy linked a pull request Nov 20, 2024 that will close this issue
Open
11 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
auth Keep Open Keep PR or issue open oauth
Projects
None yet
Milestone
No milestone
3 participants
@russellwheatley @flying-wizzy @danagbemava-nc