font_awesome 5.10.1

This library contains a dart package useful to develop web-applications using fontawesome icons

The iconic font and CSS framework #

Font Awesome is a full suite of 675 pictographic icons for easy scalable vector graphics on websites, created and maintained by [Dave Gandy](https://twitter.com/davegandy). Stay up to date with the latest release and announcements on Twitter: [@fontawesome](http://twitter.com/fontawesome).

Get started at <https://fontawesome.com/!>

Usage in Web and CSS #

1 - Create a new project with next structure:

[project_root]
  ├─ analisys_options.yaml
  ├─ pubspec.yaml
  ├─ web
  │  ├─ index.html
  │  ├─ style.css
  │  └─ ... other files and folders ...

2 - In the pubspec.yaml file add the font_awesome dependency as below:

name: web_css_sample
description: An absolute bare-bones web app.

environment:
  sdk: '>=2.4.0 <3.0.0'

dependencies:
#  font_awesome: any # uncomment and change for latest version

dev_dependencies:
  build_runner: ^1.5.0
  build_web_compilers: ^2.1.0
  pedantic: ^1.7.0

3 - In styles.css file import the css file from font_awesome library:

@import url(https://fonts.googleapis.com/css?family=Roboto);

@import url(/packages/font_awesome/css/all.css); /* font_awesome css file is imported here */

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: 'Roboto', sans-serif;
}

#output {
  padding: 20px;
  text-align: center;
}

4 - In index.html add the needed component and classes:

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="scaffolded-by" content="https://github.com/google/stagehand">
    <title>web_css_sample</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="icon" href="favicon.ico">
    <script defer src="main.dart.js"></script>
</head>

<body>

  <div id="output"></div>

<!--  Next code will show an icon star from font_awesome library-->
  <p>
      Star Icon: <i class="fa fa-star"></i>
  </p>
</body>
</html>

5 - Run next command to start development server:

webdev serve --auto refresh

6 - Once you are ready to build and deploy your project run next command:

webdev build

Usage in Web and Sass #

1 - Create a new project with next structure:

[project_root]
  ├─ analisys_options.yaml
  ├─ pubspec.yaml
  ├─ web
  │  ├─ index.html
  │  ├─ style.scss
  │  └─ ... other files and folders ...

2 - In the pubspec.yaml file add the font_awesome and sass_builder dependencies as below:

name: web_sass_sample
description: An absolute bare-bones web app.
# version: 1.0.0
#homepage: https://www.example.com
#author: luis <luisvargastijerino@gmail.com>

environment:
  sdk: '>=2.4.0 <3.0.0'

dependencies:
#  font_awesome: any # uncomment and change for latest version

dev_dependencies:
  build_runner: ^1.5.0
  build_web_compilers: ^2.1.0
  pedantic: ^1.7.0
  sass_builder: ^2.1.2

Note

During development sass_builder compiles the scss files whenever they change and generates a bundled css file that only exist in memory. During final build it generates a css file in the build folder.

3 - In styles.css file import the css file from font_awesome library:

@import url(https://fonts.googleapis.com/css?family=Roboto);

// If fonts are in different location change the path with next line:
// $fa-font-path:         "/<path to your>/font_awesome/webfonts" !default;

// We import font_awesome sass files here
@import "package:font_awesome/scss/fontawesome";
@import "package:font_awesome/scss/solid";

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: 'Roboto', sans-serif;
}

#output {
  padding: 20px;
  text-align: center;
}

4 - In index.html add the needed component and classes:

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="scaffolded-by" content="https://github.com/google/stagehand">
    <title>web_sass_sample</title>
    <link rel="stylesheet" href="styles.css"> <!-- We import the `styles.css` file instead `styles.scss` -->
    <link rel="icon" href="favicon.ico">
    <script defer src="main.dart.js"></script>
</head>

<body>

  <div id="output"></div>

  <!--  Next code will show an icon star from font_awesome library-->
  <p>
      Star Icon: <i class="fa fa-star"></i>
  </p>
</body>
</html>

5 - Run next command to start development server:

webdev serve --auto refresh

6 - Once you are ready to build and deploy your project run next command:

webdev build

License #

Contributing #

Please read through our contributing guidelines. Included are directions for opening issues, coding standards, and notes on development.

Author #

Dart Package Maintainer #

5.10.1 #

  • Add files from v5.10.1

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  font_awesome: ^5.10.1

2. Install it

You can install packages from the command line:

with pub:


$ pub get

with Flutter:


$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

Popularity:
Describes how popular the package is relative to other packages. [more]
88
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
80
Overall:
Weighted score of the above. [more]
90
Learn more about scoring.

We analyzed this package on Sep 10, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.5.0
  • pana: 0.12.21

Platforms

Detected platforms: Flutter, web, other

No libraries.

Maintenance suggestions

The package description is too short. (-20 points)

Add more detail to the description field of pubspec.yaml. Use 60 to 180 characters to describe the package, what it does, and its target use case.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0 <3.0.0