[Bug Report][3.0.0-beta.10] size not working for v-rating

[LeoTuet]

Environment

Vuetify Version: 3.0.0-beta.10
Vue Version: 3.2.38
Browsers: Chrome 104.0.0.0
OS: Linux x86_64

Steps to reproduce

Add the size prop to the Rating component and set it to any numeric string value.

Expected Behavior

The stars of the Rating component adapt to the set size.

Actual Behavior

The stars format to a fixed size with no spacing whatsoever.

Reproduction Link

https://codepen.io/leotuet/pen/bGMVYqg?editors=101

[KaelWD]

Buttons and chips have some pretty complex css to generate the correct sizes:

vuetify/packages/vuetify/src/components/VChip/_mixins.scss

Lines 8 to 85 in 7fe2e26

	@mixin chip-sizes {
	@each $sizeName, $multiplier in settings.$size-scales {
	$size: map.get($chip-sizes, "font-size") + math.div(2 * $multiplier, 16);
	$height: map.get($chip-sizes, "height") + (6 * $multiplier);
	$padding: math.round(math.div($height, $chip-padding-ratio));
	.v-chip.v-chip--size-#{$sizeName} {
	--v-chip-size: #{$size};
	--v-chip-height: #{$height};
	font-size: $size;
	padding: 0 $padding;
	.v-avatar {
	--v-avatar-height: #{$height - 6};
	@at-root #{selector.append('.v-chip--pill', &)} {
	--v-avatar-height: #{$height};
	}
	}
	.v-chip__filter,
	.v-chip__prepend,
	> .v-avatar--start,
	> .v-icon--start {
	margin-inline-end: $padding * .5;
	}
	.v-chip__filter,
	.v-chip__prepend,
	.v-icon--start {
	margin-inline-start: -$padding * .5;
	}
	.v-avatar--start {
	margin-inline-start: -$padding * .7;
	@at-root #{selector.append('.v-chip--pill', &)} {
	margin-inline-start: -$padding;
	}
	}
	.v-chip__append,
	.v-chip__close,
	> .v-avatar--end,
	> .v-icon--end {
	margin-inline-start: $padding * .5;
	margin-inline-end: -$padding * .5;
	}
	.v-avatar--end,
	.v-icon--end {
	@at-root #{selector.append('.v-chip--pill', &)} {
	margin-inline-end: -$padding;
	+ .v-chip__close {
	margin-inline-start: $padding;
	}
	}
	}
	}
	}
	}
	@mixin chip-density($properties, $densities) {
	@each $density, $multiplier in $densities {
	$value: calc(var(--v-chip-height) + #{$multiplier * settings.$spacer});
	&.v-chip--density-#{$density} {
	@if meta.type-of($properties) == "list" {
	@each $property in $properties {
	#{$property}: $value;
	}
	} @else {
	#{$properties}: $value;
	}
	}
	}
	}

I've made buttons work with just a basic width/height for now, but that needs to be refactored to be based off a single value to be able to set font size too.

[KaelWD]

Follow #15515 for that.