Skip to content

Commit

Permalink
Fix inconsistent padding (#71)
Browse files Browse the repository at this point in the history 
* Fix padding

* Commit from GitHub Actions (Forui Presubmit)

* Update golden tests

* Update CHANGELOG.md
  • Loading branch information
@kawaijoe
kawaijoe authored Jul 2, 2024
1 parent 1a25474 commit 87469da
Show file tree
Hide file tree
Showing 17 changed files with 123 additions and 154 deletions.
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<a href="https://forui.dev">
<a href="https://forui.dev">
<h1 align="center">
<picture>
<source width="400" media="(prefers-color-scheme: dark)" srcset="docs/public/dark_logo.svg">
Expand Down
39 changes: 17 additions & 22 deletions docs/pages/docs/scaffold.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,28 +25,23 @@ Creates a visual scaffold for Forui widgets.
FCard(
title: const Text('Account'),
subtitle: const Text('Make changes to your account here. Click save when you are done.'),
child: Padding(
padding: const EdgeInsets.only(top: 10),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
],
),
),
],
Expand Down
95 changes: 41 additions & 54 deletions docs/pages/docs/tabs.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,66 +10,53 @@ A set of layered sections of content—known as tab entries—that are displayed
</Tabs.Tab>
<Tabs.Tab>
```dart
Padding(
padding: const EdgeInsets.all(16),
child: FTabs(
tabs: [
FTabEntry(
label: const Text('Account'),
content: FCard(
title: const Text('Account'),
subtitle: const Text('Make changes to your account here. Click save when you are done.'),
child: Padding(
padding: const EdgeInsets.only(top: 12),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
FTabs(
tabs: [
FTabEntry(
label: const Text('Account'),
content: FCard(
title: const Text('Account'),
subtitle: const Text('Make changes to your account here. Click save when you are done.'),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
],
),
),
FTabEntry(
label: const Text(Password'),
content: FCard(
title: const Text('Password'),
subtitle: const Text('Change your password here. After saving, you will be logged out.'),
child: Padding(
padding: const EdgeInsets.only(top: 12),
child: Column(
children: [
const FTextField(label: Text('Current password')),
const SizedBox(height: 10),
const FTextField(label: Text('New password')),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
FTabEntry(
label: const Text('Password'),
content: FCard(
title: const Text('Password'),
subtitle: const Text('Change your password here. After saving, you will be logged out.'),
child: Column(
children: [
const FTextField(label: Text('Current password')),
const SizedBox(height: 10),
const FTextField(label: Text('New password')),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
),
],
),
),
],
);
```
</Tabs.Tab>
Expand Down
Binary file added docs/public/banner-020724.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/public/dark_logo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/public/light_logo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions forui/CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
* Fix missing `key` parameter in `FTextField` constructors.
* **Breaking** `FButton.prefixIcon` and `FButton.suffixIcon` have been renamed to `FButton.prefix` and `FButton.suffix`.
* Split exports in `forui.dart` into sub-libraries.
* Fix padding inconsistencies in `FCard` and `FDialog`.

## 0.1.0

Expand Down
30 changes: 15 additions & 15 deletions forui/lib/src/widgets/card/card_content.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,21 +23,23 @@ final class _FCardContent extends StatelessWidget {
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (title != null)
DefaultTextStyle.merge(
style: style.titleTextStyle,
child: title!,
Padding(
padding: const EdgeInsets.only(bottom: 2),
child: DefaultTextStyle.merge(
style: style.titleTextStyle,
child: title!,
),
),
if (subtitle != null)
DefaultTextStyle.merge(
style: style.subtitleTextStyle,
child: subtitle!,
),
if (child != null)
Padding(
padding:
(title == null && subtitle == null) ? const EdgeInsets.only(top: 4) : const EdgeInsets.only(top: 10),
child: child!,
padding: const EdgeInsets.only(bottom: 2),
child: DefaultTextStyle.merge(
style: style.subtitleTextStyle,
child: subtitle!,
),
),
if (title != null && subtitle != null) const SizedBox(height: 8),
if (child != null) child!,
],
),
);
Expand Down Expand Up @@ -65,7 +67,7 @@ final class FCardContentStyle with Diagnosticable {
const FCardContentStyle({
required this.titleTextStyle,
required this.subtitleTextStyle,
this.padding = const EdgeInsets.fromLTRB(16, 16, 16, 16),
this.padding = const EdgeInsets.all(16),
});

/// Creates a [FCardContentStyle] that inherits its properties from [colorScheme] and [typography].
Expand All @@ -75,9 +77,7 @@ final class FCardContentStyle with Diagnosticable {
color: colorScheme.foreground,
height: 1.5,
),
subtitleTextStyle = typography.sm.copyWith(
color: colorScheme.mutedForeground,
),
subtitleTextStyle = typography.sm.copyWith(color: colorScheme.mutedForeground),
padding = const EdgeInsets.fromLTRB(16, 12, 16, 16);

/// Returns a copy of this [FCardContentStyle] with the given properties replaced.
Expand Down
5 changes: 3 additions & 2 deletions forui/lib/src/widgets/dialog/dialog_content.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ sealed class _FDialogContent extends StatelessWidget {
children: [
if (title != null)
Padding(
padding: const EdgeInsets.only(bottom: 12),
padding: const EdgeInsets.only(bottom: 4),
child: Semantics(
container: true,
child: DefaultTextStyle.merge(
Expand All @@ -41,7 +41,7 @@ sealed class _FDialogContent extends StatelessWidget {
),
if (body != null)
Padding(
padding: const EdgeInsets.only(bottom: 16),
padding: const EdgeInsets.only(bottom: 4),
child: Semantics(
container: true,
child: DefaultTextStyle.merge(
Expand All @@ -51,6 +51,7 @@ sealed class _FDialogContent extends StatelessWidget {
),
),
),
if (title != null && body != null) const SizedBox(height: 8),
_actions(context),
],
),
Expand Down
Binary file modified forui/test/golden/card/zinc-dark-content-card.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified forui/test/golden/card/zinc-light-content-card.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified forui/test/golden/dialog/zinc-dark-Axis.horizontal-content-dialog.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified forui/test/golden/dialog/zinc-dark-Axis.vertical-content-dialog.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified forui/test/golden/dialog/zinc-light-Axis.horizontal-content-dialog.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified forui/test/golden/dialog/zinc-light-Axis.vertical-content-dialog.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
39 changes: 17 additions & 22 deletions samples/lib/widgets/scaffold.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,28 +34,23 @@ class ScaffoldPage extends SampleScaffold {
FCard(
title: const Text('Account'),
subtitle: const Text('Make changes to your account here. Click save when you are done.'),
child: Padding(
padding: const EdgeInsets.only(top: 10),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
],
),
),
],
Expand Down
66 changes: 28 additions & 38 deletions samples/lib/widgets/tabs.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,28 +24,23 @@ class TabsPage extends SampleScaffold {
content: FCard(
title: const Text('Account'),
subtitle: const Text('Make changes to your account here. Click save when you are done.'),
child: Padding(
padding: const EdgeInsets.only(top: 10),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
child: Column(
children: [
const FTextField(
label: Text('Name'),
hint: 'John Renalo',
),
const SizedBox(height: 10),
const FTextField(
label: Text('Email'),
hint: '[email protected]',
),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
],
),
),
),
Expand All @@ -54,22 +49,17 @@ class TabsPage extends SampleScaffold {
content: FCard(
title: const Text('Password'),
subtitle: const Text('Change your password here. After saving, you will be logged out.'),
child: Padding(
padding: const EdgeInsets.only(top: 10),
child: Column(
children: [
const FTextField(label: Text('Current password')),
const SizedBox(height: 10),
const FTextField(label: Text('New password')),
Padding(
padding: const EdgeInsets.only(top: 24, bottom: 16),
child: FButton(
label: const Text('Save'),
onPress: () {},
),
),
],
),
child: Column(
children: [
const FTextField(label: Text('Current password')),
const SizedBox(height: 10),
const FTextField(label: Text('New password')),
const SizedBox(height: 16),
FButton(
label: const Text('Save'),
onPress: () {},
),
],
),
),
),
Expand Down

0 comments on commit 87469da

Please sign in to comment.