Skip to content

Commit 1970142

Browse files
boosted-botAhmed Amine Zribi
boosted-bot
and
Ahmed Amine Zribi
authored
feat(🤖): add badge component (tokens library v0.11.0) (#238)
* chore: update tokens * feat: add 'badge' component token --------- Co-authored-by: boosted-bot <boosted-bot@users.noreply.github.com> Co-authored-by: Ahmed Amine Zribi <ahmedamine.zribi@sofrecom>
1 parent 7bda19b commit 1970142

50 files changed

Lines changed: 2146 additions & 2092 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎ouds_global_raw_tokens/lib/border_raw_tokens.dart‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,18 +16,10 @@
1616
class BorderRawTokens {
1717
static const borderBase = 4;
1818
static const borderRadius9999 = 2000.0;
19-
static const borderStyleNone = 'none';
20-
static const borderStyleSolid = 'solid';
2119
static const borderStyleDashed = 'dashed';
2220
static const borderStyleDotted = 'dotted';
23-
static const borderWidth0 = borderBase * 0.0; // 0px
24-
static const borderWidth25 = borderBase * 0.25; // 1px
25-
static const borderWidth50 = borderBase * 0.5; // 2px
26-
static const borderWidth75 = borderBase * 0.75; // 3px
27-
static const borderWidth100 = borderBase * 1.0; // 4px
28-
static const borderWidth125 = borderBase * 1.25; // 5px
29-
static const borderWidth150 = borderBase * 1.5; // 6px
30-
static const borderWidth200 = borderBase * 2.0; // 8px
21+
static const borderStyleNone = 'none';
22+
static const borderStyleSolid = 'solid';
3123
static const borderRadius0 = borderBase * 0.0; // 0px
3224
static const borderRadius25 = borderBase * 0.25; // 1px
3325
static const borderRadius50 = borderBase * 0.5; // 2px
@@ -40,4 +32,12 @@ class BorderRawTokens {
4032
static const borderRadius500 = borderBase * 5.0; // 20px
4133
static const borderRadius600 = borderBase * 6.0; // 24px
4234
static const borderRadius800 = borderBase * 8.0; // 32px
35+
static const borderWidth0 = borderBase * 0.0; // 0px
36+
static const borderWidth25 = borderBase * 0.25; // 1px
37+
static const borderWidth50 = borderBase * 0.5; // 2px
38+
static const borderWidth75 = borderBase * 0.75; // 3px
39+
static const borderWidth100 = borderBase * 1.0; // 4px
40+
static const borderWidth125 = borderBase * 1.25; // 5px
41+
static const borderWidth150 = borderBase * 1.5; // 6px
42+
static const borderWidth200 = borderBase * 2.0; // 8px
4343
}

‎ouds_global_raw_tokens/lib/color_raw_tokens.dart‎

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -16,20 +16,16 @@
1616
import 'package:flutter/material.dart';
1717

1818
class ColorRawTokens {
19-
static const colorFunctionalWhite = Color(0xffffffff);
2019
static const colorFunctionalBlack = Color(0xff000000);
21-
static const colorFunctionalGrayLight80 = Color(0xfff4f4f4);
22-
static const colorFunctionalGrayLight160 = Color(0xffeeeeee);
23-
static const colorFunctionalGrayLight240 = Color(0xffe0e0e0);
24-
static const colorFunctionalGrayLight320 = Color(0xffd6d6d6);
25-
static const colorFunctionalGrayLight400 = Color(0xffcccccc);
26-
static const colorFunctionalGrayLight480 = Color(0xffc2c2c2);
27-
static const colorFunctionalGrayLight560 = Color(0xffbbbbbb);
28-
static const colorFunctionalGrayLight640 = Color(0xffadadad);
29-
static const colorFunctionalGrayLight720 = Color(0xffa3a3a3);
30-
static const colorFunctionalGrayLight800 = Color(0xff999999);
31-
static const colorFunctionalGrayLight880 = Color(0xff8f8f8f);
32-
static const colorFunctionalGrayLight960 = Color(0xff858585);
20+
static const colorFunctionalDodgerBlue100 = Color(0xfff0faff);
21+
static const colorFunctionalDodgerBlue200 = Color(0xffbde7ff);
22+
static const colorFunctionalDodgerBlue300 = Color(0xff8ad5ff);
23+
static const colorFunctionalDodgerBlue400 = Color(0xff57c3ff);
24+
static const colorFunctionalDodgerBlue500 = Color(0xff26b2ff);
25+
static const colorFunctionalDodgerBlue600 = Color(0xff009bf0);
26+
static const colorFunctionalDodgerBlue700 = Color(0xff007abd);
27+
static const colorFunctionalDodgerBlue800 = Color(0xff00598a);
28+
static const colorFunctionalDodgerBlue900 = Color(0xff003857);
3329
static const colorFunctionalGrayDark80 = Color(0xff7a7a7a);
3430
static const colorFunctionalGrayDark160 = Color(0xff707070);
3531
static const colorFunctionalGrayDark240 = Color(0xff666666);
@@ -42,6 +38,27 @@ class ColorRawTokens {
4238
static const colorFunctionalGrayDark800 = Color(0xff1f1f1f);
4339
static const colorFunctionalGrayDark880 = Color(0xff141414);
4440
static const colorFunctionalGrayDark960 = Color(0xff0a0a0a);
41+
static const colorFunctionalGrayLight80 = Color(0xfff4f4f4);
42+
static const colorFunctionalGrayLight160 = Color(0xffeeeeee);
43+
static const colorFunctionalGrayLight240 = Color(0xffe0e0e0);
44+
static const colorFunctionalGrayLight320 = Color(0xffd6d6d6);
45+
static const colorFunctionalGrayLight400 = Color(0xffcccccc);
46+
static const colorFunctionalGrayLight480 = Color(0xffc2c2c2);
47+
static const colorFunctionalGrayLight560 = Color(0xffbbbbbb);
48+
static const colorFunctionalGrayLight640 = Color(0xffadadad);
49+
static const colorFunctionalGrayLight720 = Color(0xffa3a3a3);
50+
static const colorFunctionalGrayLight800 = Color(0xff999999);
51+
static const colorFunctionalGrayLight880 = Color(0xff8f8f8f);
52+
static const colorFunctionalGrayLight960 = Color(0xff858585);
53+
static const colorFunctionalMalachite100 = Color(0xffedfcf0);
54+
static const colorFunctionalMalachite200 = Color(0xffc1f6ca);
55+
static const colorFunctionalMalachite300 = Color(0xff94f0a4);
56+
static const colorFunctionalMalachite400 = Color(0xff67e97e);
57+
static const colorFunctionalMalachite500 = Color(0xff3de35a);
58+
static const colorFunctionalMalachite600 = Color(0xff1ecd3c);
59+
static const colorFunctionalMalachite700 = Color(0xff17a02f);
60+
static const colorFunctionalMalachite800 = Color(0xff0e621d);
61+
static const colorFunctionalMalachite900 = Color(0xff0a4715);
4562
static const colorFunctionalScarlet100 = Color(0xffffe5e6);
4663
static const colorFunctionalScarlet200 = Color(0xffffb2b3);
4764
static const colorFunctionalScarlet300 = Color(0xffff8081);
@@ -60,28 +77,7 @@ class ColorRawTokens {
6077
static const colorFunctionalSun700 = Color(0xffa38200);
6178
static const colorFunctionalSun800 = Color(0xff665100);
6279
static const colorFunctionalSun900 = Color(0xff3d3100);
63-
static const colorFunctionalMalachite100 = Color(0xffedfcf0);
64-
static const colorFunctionalMalachite200 = Color(0xffc1f6ca);
65-
static const colorFunctionalMalachite300 = Color(0xff94f0a4);
66-
static const colorFunctionalMalachite400 = Color(0xff67e97e);
67-
static const colorFunctionalMalachite500 = Color(0xff3de35a);
68-
static const colorFunctionalMalachite600 = Color(0xff1ecd3c);
69-
static const colorFunctionalMalachite700 = Color(0xff17a02f);
70-
static const colorFunctionalMalachite800 = Color(0xff0e621d);
71-
static const colorFunctionalMalachite900 = Color(0xff0a4715);
72-
static const colorFunctionalDodgerBlue100 = Color(0xfff0faff);
73-
static const colorFunctionalDodgerBlue200 = Color(0xffbde7ff);
74-
static const colorFunctionalDodgerBlue300 = Color(0xff8ad5ff);
75-
static const colorFunctionalDodgerBlue400 = Color(0xff57c3ff);
76-
static const colorFunctionalDodgerBlue500 = Color(0xff26b2ff);
77-
static const colorFunctionalDodgerBlue600 = Color(0xff009bf0);
78-
static const colorFunctionalDodgerBlue700 = Color(0xff007abd);
79-
static const colorFunctionalDodgerBlue800 = Color(0xff00598a);
80-
static const colorFunctionalDodgerBlue900 = Color(0xff003857);
81-
static const colorOpacityScarlet = Color(0x14ea0305);
82-
static const colorOpacitySun = Color(0x29ffd000);
83-
static const colorOpacityMalachite = Color(0x1f3de35a);
84-
static const colorOpacityDodgerBlue = Color(0x1426b2ff);
80+
static const colorFunctionalWhite = Color(0xffffffff);
8581
static const colorOpacityBlack0 = Color(0x00000000);
8682
static const colorOpacityBlack40 = Color(0x0a000000);
8783
static const colorOpacityBlack80 = Color(0x14000000);
@@ -107,6 +103,10 @@ class ColorRawTokens {
107103
static const colorOpacityBlack880 = Color(0xe0000000);
108104
static const colorOpacityBlack920 = Color(0xeb000000);
109105
static const colorOpacityBlack960 = Color(0xf5000000);
106+
static const colorOpacityDodgerBlue = Color(0x1426b2ff);
107+
static const colorOpacityMalachite = Color(0x1f3de35a);
108+
static const colorOpacityScarlet = Color(0x14ea0305);
109+
static const colorOpacitySun = Color(0x29ffd000);
110110
static const colorOpacityWhite0 = Color(0x00ffffff);
111111
static const colorOpacityWhite40 = Color(0x0affffff);
112112
static const colorOpacityWhite80 = Color(0x14ffffff);

‎ouds_global_raw_tokens/lib/font_raw_tokens.dart‎

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,38 @@
1616
import 'package:flutter/material.dart';
1717

1818
class FontRawTokens {
19+
static const fontLetterSpacing150 = 0.18;
20+
static const fontLetterSpacing175 = 0.19;
21+
static const fontLetterSpacing200 = 0.17;
22+
static const fontLetterSpacing250 = 0.2;
23+
static const fontLetterSpacing300 = 0.18;
24+
static const fontLetterSpacing350 = 0.0;
25+
static const fontLetterSpacing450 = -0.12;
26+
static const fontLetterSpacing550 = -0.28;
27+
static const fontLetterSpacing650 = -0.32;
28+
static const fontLetterSpacing750 = -0.36;
29+
static const fontLetterSpacing850 = -0.4;
30+
static const fontLetterSpacing950 = -0.55;
31+
static const fontLetterSpacing1050 = -0.6;
32+
static const fontLetterSpacing1150 = -0.65;
33+
static const fontLetterSpacing1250 = -0.7;
34+
static const fontLetterSpacing1450 = -0.96;
35+
static const fontLetterSpacing1850 = -1.08;
36+
static const fontLineHeight250 = 16.0;
37+
static const fontLineHeight350 = 20.0;
38+
static const fontLineHeight450 = 24.0;
39+
static const fontLineHeight550 = 28.0;
40+
static const fontLineHeight650 = 32.0;
41+
static const fontLineHeight750 = 36.0;
42+
static const fontLineHeight850 = 40.0;
43+
static const fontLineHeight950 = 44.0;
44+
static const fontLineHeight1050 = 48.0;
45+
static const fontLineHeight1150 = 52.0;
46+
static const fontLineHeight1250 = 56.0;
47+
static const fontLineHeight1350 = 60.0;
48+
static const fontLineHeight1450 = 64.0;
49+
static const fontLineHeight1850 = 72.0;
50+
static const fontLineHeight2050 = 80.0;
1951
static const fontSize150 = 12.0;
2052
static const fontSize175 = 13.0;
2153
static const fontSize200 = 14.0;
@@ -42,36 +74,4 @@ class FontRawTokens {
4274
static const fontWeight700 = FontWeight.w700;
4375
static const fontWeight800 = FontWeight.w800;
4476
static const fontWeight900 = FontWeight.w900;
45-
static const fontLineHeight250 = 16.0;
46-
static const fontLineHeight350 = 20.0;
47-
static const fontLineHeight450 = 24.0;
48-
static const fontLineHeight550 = 28.0;
49-
static const fontLineHeight650 = 32.0;
50-
static const fontLineHeight750 = 36.0;
51-
static const fontLineHeight850 = 40.0;
52-
static const fontLineHeight950 = 44.0;
53-
static const fontLineHeight1050 = 48.0;
54-
static const fontLineHeight1150 = 52.0;
55-
static const fontLineHeight1250 = 56.0;
56-
static const fontLineHeight1350 = 60.0;
57-
static const fontLineHeight1450 = 64.0;
58-
static const fontLineHeight1850 = 72.0;
59-
static const fontLineHeight2050 = 80.0;
60-
static const fontLetterSpacing150 = 0.18;
61-
static const fontLetterSpacing175 = 0.19;
62-
static const fontLetterSpacing200 = 0.17;
63-
static const fontLetterSpacing250 = 0.2;
64-
static const fontLetterSpacing300 = 0.18;
65-
static const fontLetterSpacing350 = 0.0;
66-
static const fontLetterSpacing450 = -0.12;
67-
static const fontLetterSpacing550 = -0.28;
68-
static const fontLetterSpacing650 = -0.32;
69-
static const fontLetterSpacing750 = -0.36;
70-
static const fontLetterSpacing850 = -0.4;
71-
static const fontLetterSpacing950 = -0.55;
72-
static const fontLetterSpacing1050 = -0.6;
73-
static const fontLetterSpacing1150 = -0.65;
74-
static const fontLetterSpacing1250 = -0.7;
75-
static const fontLetterSpacing1450 = -0.96;
76-
static const fontLetterSpacing1850 = -1.08;
7777
}

‎ouds_global_raw_tokens/lib/grid_raw_tokens.dart‎

Lines changed: 34 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -16,25 +16,13 @@
1616
import 'package:ouds_global_raw_tokens/dimension_raw_tokens.dart';
1717

1818
class GridRawTokens {
19-
static const gridWidth100 = 360;
20-
static const gridWidth200 = 390;
21-
static const gridWidth300 = 480;
22-
static const gridWidth400 = 768;
23-
static const gridWidth500 = 1024;
24-
static const gridWidth600 = 1440;
25-
static const gridWidth700 = 1680;
26-
static const gridWidth800 = 1920;
27-
static const gridMinWidth100 = 1;
28-
static const gridMinWidth200 = 390;
29-
static const gridMinWidth300 = 480;
30-
static const gridMinWidth400 = 736;
31-
static const gridMinWidth500 = 1024;
32-
static const gridMinWidth600 = 1320;
33-
static const gridMinWidth700 = 1640;
34-
static const gridMinWidth800 = 1880;
35-
static const gridMinWidthExtraCompact = 320;
36-
static const gridMinWidthCompact = 390;
37-
static const gridMinWidthMedium = 600;
19+
static const gridColumnCount100 = 1;
20+
static const gridColumnCount200 = 2;
21+
static const gridColumnCount400 = 4;
22+
static const gridColumnCount600 = 6;
23+
static const gridColumnCount800 = 8;
24+
static const gridColumnCount1000 = 10;
25+
static const gridColumnCount1200 = 12;
3826
static const gridMaxWidth100 = 389;
3927
static const gridMaxWidth200 = 479;
4028
static const gridMaxWidth300 = 735;
@@ -44,16 +32,35 @@ class GridRawTokens {
4432
static const gridMaxWidth650 = 1680;
4533
static const gridMaxWidth700 = 1879;
4634
static const gridMaxWidth800 = 1920;
47-
static const gridMaxWidthExtraCompact = 389;
4835
static const gridMaxWidthCompact = 599;
36+
static const gridMaxWidthExtraCompact = 389;
4937
static const gridMaxWidthMedium = 1200;
50-
static const gridColumnCount100 = 1;
51-
static const gridColumnCount200 = 2;
52-
static const gridColumnCount400 = 4;
53-
static const gridColumnCount600 = 6;
54-
static const gridColumnCount800 = 8;
55-
static const gridColumnCount1000 = 10;
56-
static const gridColumnCount1200 = 12;
38+
static const gridMinWidth100 = 1;
39+
static const gridMinWidth200 = 390;
40+
static const gridMinWidth300 = 480;
41+
static const gridMinWidth400 = 736;
42+
static const gridMinWidth500 = 1024;
43+
static const gridMinWidth600 = 1320;
44+
static const gridMinWidth700 = 1640;
45+
static const gridMinWidth800 = 1880;
46+
static const gridMinWidthCompact = 390;
47+
static const gridMinWidthExtraCompact = 320;
48+
static const gridMinWidthMedium = 600;
49+
static const gridWidth100 = 360;
50+
static const gridWidth200 = 390;
51+
static const gridWidth300 = 480;
52+
static const gridWidth400 = 768;
53+
static const gridWidth500 = 1024;
54+
static const gridWidth600 = 1440;
55+
static const gridWidth700 = 1680;
56+
static const gridWidth800 = 1920;
57+
static const gridColumnGap10 = DimensionRawTokens.dimensionBase * 0.25; // 1px
58+
static const gridColumnGap100 = DimensionRawTokens.dimensionBase * 2.0; // 8px
59+
static const gridColumnGap200 = DimensionRawTokens.dimensionBase * 4.0; // 16px
60+
static const gridColumnGap300 = DimensionRawTokens.dimensionBase * 5.0; // 20px
61+
static const gridColumnGap400 = DimensionRawTokens.dimensionBase * 6.0; // 24px
62+
static const gridColumnGap600 = DimensionRawTokens.dimensionBase * 8.0; // 32px
63+
static const gridColumnGap800 = DimensionRawTokens.dimensionBase * 10.0; // 40px
5764
static const gridMargin100 = DimensionRawTokens.dimensionBase * 4.0; // 16px
5865
static const gridMargin300 = DimensionRawTokens.dimensionBase * 6.0; // 24px
5966
static const gridMargin400 = DimensionRawTokens.dimensionBase * 7.0; // 28px
@@ -64,11 +71,4 @@ class GridRawTokens {
6471
static const gridMargin1100 = DimensionRawTokens.dimensionBase * 14.0; // 56px
6572
static const gridMargin1700 = DimensionRawTokens.dimensionBase * 20.0; // 80px
6673
static const gridMargin2500 = DimensionRawTokens.dimensionBase * 28.0; // 112px
67-
static const gridColumnGap10 = DimensionRawTokens.dimensionBase * 0.25; // 1px
68-
static const gridColumnGap100 = DimensionRawTokens.dimensionBase * 2.0; // 8px
69-
static const gridColumnGap200 = DimensionRawTokens.dimensionBase * 4.0; // 16px
70-
static const gridColumnGap300 = DimensionRawTokens.dimensionBase * 5.0; // 20px
71-
static const gridColumnGap400 = DimensionRawTokens.dimensionBase * 6.0; // 24px
72-
static const gridColumnGap600 = DimensionRawTokens.dimensionBase * 8.0; // 32px
73-
static const gridColumnGap800 = DimensionRawTokens.dimensionBase * 10.0; // 40px
7474
}

‎ouds_theme_contract/CHANGELOG.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
55
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
66

77
## [Unreleased](https://github.com/Orange-OpenSource/ouds-flutter/compare/0.3.0...develop)
8+
### Added
9+
- [Library] Tokens: `badge` ([#238](https://github.com/Orange-OpenSource/ouds-flutter/issues/#238)
810

911
### Changed
1012
- [Library] Update tokens 1.1.0 ([#225](https://github.com/Orange-OpenSource/ouds-flutter/issues/225))

‎ouds_theme_contract/lib/theme/tokens/components/ouds_badge_tokens.dart‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
//
2+
// Software Name: OUDS Flutter
3+
// SPDX-FileCopyrightText: Copyright (c) Orange SA
4+
// SPDX-License-Identifier: MIT
5+
//
6+
// This software is distributed under the MIT license,
7+
// the text of which is available at https://opensource.org/license/MIT/
8+
// or see the "LICENSE" file for more details.
9+
//
10+
// Software description: Flutter library of reusable graphical components
11+
//
12+
13+
// Tokens version 1.1.0
14+
// Generated by Tokenator
15+
16+
import 'package:flutter/material.dart';
17+
import 'package:ouds_theme_contract/ouds_tokens_provider.dart';
18+
import 'package:ouds_global_raw_tokens/dimension_raw_tokens.dart';
19+
20+
class OudsBadgeTokens {
21+
final double sizeLarge;
22+
final double sizeMedium;
23+
final double sizeSmall;
24+
final double sizeXsmall;
25+
final double spaceInset;
26+
final double spacePaddingInlineLarge;
27+
final double spacePaddingInlineMedium;
28+
29+
OudsBadgeTokens({
30+
required OudsProvidersTokens providersTokens,
31+
double? sizeLarge,
32+
double? sizeMedium,
33+
double? sizeSmall,
34+
double? sizeXsmall,
35+
double? spaceInset,
36+
double? spacePaddingInlineLarge,
37+
double? spacePaddingInlineMedium
38+
}) :
39+
sizeLarge = sizeLarge ?? DimensionRawTokens.dimension250,
40+
sizeMedium = sizeMedium ?? DimensionRawTokens.dimension200,
41+
sizeSmall = sizeSmall ?? DimensionRawTokens.dimension150,
42+
sizeXsmall = sizeXsmall ?? DimensionRawTokens.dimension100,
43+
spaceInset = spaceInset ?? DimensionRawTokens.dimensionOutOfSystem75,
44+
spacePaddingInlineLarge = spacePaddingInlineLarge ?? providersTokens.spaceTokens.paddingInline2xs,
45+
spacePaddingInlineMedium = spacePaddingInlineMedium ?? providersTokens.spaceTokens.paddingInline3xs;
46+
}

0 commit comments

Comments
 (0)