I don't see it, so I am asking them. As soon as they reply to me I will advise what it is.
-
You MUST read the Babiato Rules before making your first post otherwise you may get permanent warning points or a permanent Ban.
Our resources on Babiato Forum are CLEAN and SAFE. So you can use them for development and testing purposes. If your are on Windows and have an antivirus that alerts you about a possible infection: Know it's a false positive because all scripts are double checked by our experts. We advise you to add Babiato to trusted sites/sources or disable your antivirus momentarily while downloading a resource. "Enjoy your presence on Babiato"
Font Awesome Pro/Alphas
- Thread starter DJJigsaw
- Start date
I don't see it, so I am asking them. As soon as they reply to me I will advise what it is.
Issues with Vue 3?
Create a new component with the code below, share it to the vue with `font-awesome-icon` and ignore the one from their documentation.
Also something that they don't include in the documentation:
add this somewhere in your code in order to be able to use:
<font-awesome-icon icon="fa-brands fa-golang" />
Create a new component with the code below, share it to the vue with `font-awesome-icon` and ignore the one from their documentation.
Also something that they don't include in the documentation:
add this somewhere in your code in order to be able to use:
<font-awesome-icon icon="fa-brands fa-golang" />
Code:
import { library } from '@fortawesome/fontawesome-svg-core';
//don't know for sure if pro includes this ones as well
import { far as farFree } from '@fortawesome/free-regular-svg-icons';
import { fas as fasFree } from '@fortawesome/free-solid-svg-icons';
import { fad } from '@fortawesome/pro-duotone-svg-icons';
import { fat } from '@fortawesome/pro-thin-svg-icons';
import { fal } from '@fortawesome/pro-light-svg-icons';
import { fas } from '@fortawesome/pro-solid-svg-icons';
import { far } from '@fortawesome/pro-regular-svg-icons';
import { fab } from '@fortawesome/free-brands-svg-icons';
library.add(farFree);
library.add(fasFree);
library.add(fad);
library.add(fat);
library.add(fal);
library.add(fas);
library.add(far);
library.add(fab);
Code:
<script>
import { parse as faParse, icon as faIcon } from '@fortawesome/fontawesome-svg-core'
import { objectWithKey, classList } from '@fortawesome/vue-fontawesome/src/utils'
import { h } from "vue";
function normalizeIconArgs (icon) {
// this has everything that it needs to be rendered which means it was probably imported
// directly from an icon svg package
if (icon && typeof icon === 'object' && icon.prefix && icon.iconName && icon.icon) {
return icon
}
if (faParse.icon) {
return faParse.icon(icon)
}
if (icon === null) {
return null
}
if (typeof icon === 'object' && icon.prefix && icon.iconName) {
return icon
}
if (Array.isArray(icon) && icon.length === 2) {
return { prefix: icon[0], iconName: icon[1] }
}
if (typeof icon === 'string') {
return { prefix: 'fas', iconName: icon }
}
}
export default {
name: "font-awesome-icon",
props: {
beat: {
type: Boolean,
default: false
},
border: {
type: Boolean,
default: false
},
fade: {
type: Boolean,
default: false
},
fixedWidth: {
type: Boolean,
default: false
},
flash: {
type: Boolean,
default: false
},
flip: {
type: String,
default: null,
validator: (value) => ['horizontal', 'vertical', 'both'].indexOf(value) > -1
},
icon: {
type: [Object, Array, String],
required: true
},
mask: {
type: [Object, Array, String],
default: null
},
listItem: {
type: Boolean,
default: false
},
pull: {
type: String,
default: null,
validator: (value) => ['right', 'left'].indexOf(value) > -1
},
pulse: {
type: Boolean,
default: false
},
rotation: {
type: [String, Number],
default: null,
validator: (value) => [90, 180, 270].indexOf(parseInt(value, 10)) > -1
},
swapOpacity: {
type: Boolean,
default: false
},
size: {
type: String,
default: null,
validator: (value) => ['2xs', 'xs', 'sm', 'lg', 'xl', '2xl', '1x', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x'].indexOf(value) > -1
},
spin: {
type: Boolean,
default: false
},
spinPulse: {
type: Boolean,
default: false
},
spinReverse: {
type: Boolean,
default: false
},
transform: {
type: [String, Object],
default: null
},
symbol: {
type: [Boolean, String],
default: false
},
title: {
type: String,
default: null
},
inverse: {
type: Boolean,
default: false
}
},
setup(props) {
const icon = normalizeIconArgs(props.icon)
const classes = objectWithKey('classes', classList(props))
const transform = objectWithKey('transform', (typeof props.transform === 'string') ? faParse.transform(props.transform) : props.transform)
const mask = objectWithKey('mask', normalizeIconArgs(props.mask))
const symbol = props.symbol;
const title = props.title;
const renderedIcon = faIcon(
icon,
{ ...classes, ...transform, ...mask, symbol, title }
)
const { abstract } = renderedIcon;
// return the render function
return () => render(abstract[0])
}
}
function render(data) {
let children = [];
if (data.hasOwnProperty('children')) {
data.children.forEach(child => {
children.push(render(child))
})
}
return h(data.tag, data.attributes, children)
}
</script>
i'll follow up as they didn't do an email about it but it's added to the folder now.
Font Awesome 6 is coming February 2022!
Well, hey there.As they say, it’s time to let the cat out of the bag. Font Awesome 6 will officially release in February 2022. Yay!
So, what’s new?
More Icons
Font Awesome 6 contains over 7,000 new icons, so you’re sure to find what you need for your project. Plus, we’ve redesigned most of our icons from scratch, so they’re more consistent and easier to use.See the v6 Icons
More Styles
Font Awesome 6 includes five icons styles: solid, regular, light, duotone, and the new THIN style — not to mention all of our brand icons. And coming later in 2022 is the entirely new SHARP family of styles.More Ways to Use
Font Awesome 6 makes it even easier to use icons where you want to. More plugins and packages to match your stack including:- CSS styling toolkit
- JavaScript frameworks
- Official WordPress and Django plugins
- And more!
Want to get a jump on trying out the slick new designs?
Check out the Beta
At Font Awesome, we're all about those icons. (obvs!)
But if you can't use our icons your way, right away, we've missed the mark somehow.
That's why we make it our mission to nerd out and fine-tune the heck out of the icon tech to ensure Font Awesome icons are super easy to use where and how you want. To get icons on your site your way, you can use:
As we gear up for the official release of Font Awesome 6 (coming in February!), we can honestly say it's our most robust release to date. And as user needs change over time, we'll keep delivering the most requested tools to match your stack!
P.S. In honor of Sportsball, please enjoy our spotlight on the Wizarding World of Sports.
Happy Quidditch season!
- Dave and the Font Awesome Ravenclaws
But if you can't use our icons your way, right away, we've missed the mark somehow.
That's why we make it our mission to nerd out and fine-tune the heck out of the icon tech to ensure Font Awesome icons are super easy to use where and how you want. To get icons on your site your way, you can use:
- JavaScript Components
- Official WordPress Plugin
- CSS, SASS, and Less
- Official Django Plugin
- And more!
As we gear up for the official release of Font Awesome 6 (coming in February!), we can honestly say it's our most robust release to date. And as user needs change over time, we'll keep delivering the most requested tools to match your stack!
P.S. In honor of Sportsball, please enjoy our spotlight on the Wizarding World of Sports.
Happy Quidditch season!
- Dave and the Font Awesome Ravenclaws
same here, no email about it yet lol once it does then I will update
I guess not as it's paid for, from so many people and yeah managed well enough to handle all the traffic.
Thank you so much for this release, helped me out immensely.I will be loading in more both pro versions and alphas as they become available. So please enjoy the folder that has all the files for each versions.
File folder on MEGA
mega.nz
Found this additional information for WordPress (WP) users.. you will need this API token/code.
20901CA0-E588-4ED1-A604-4ED049C57565
Do you know anyway to add your own custom icons using the fontawesome-pro-6.0.0-beta3-web (selfhosted)?
I am not sure personally, but I will ask and see if they can give some directions for ya tho.
Hi DJ Jigsaw (real name hidden),
Right now our custom icon upload feature only works in pro kits and kits cannot be self-hosted. We are looking at ways for custom icons to be used, but no decision has been made yet.
Thanks!
Trevor
in the folder is a file with the kit code. I would assume it is what your looking for otherwise the WP API/Token code would be it to make FA Pro work.
