From f21995712db77b20efa167b4624cdea6cbc40f5d Mon Sep 17 00:00:00 2001 From: Volpeon Date: Wed, 22 Feb 2023 09:05:16 +0100 Subject: More avatar sizes --- src/_declare-vars.scss | 4 ++-- src/objects/_action-menu.scss | 2 +- src/objects/_avatar.scss | 17 ++++++++++++++++- 3 files changed, 19 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/_declare-vars.scss b/src/_declare-vars.scss index d95c7fc..8597398 100644 --- a/src/_declare-vars.scss +++ b/src/_declare-vars.scss @@ -40,8 +40,8 @@ --900: iro.fn-px-to-rem(72px), --1000: iro.fn-px-to-rem(80px), --1200: iro.fn-px-to-rem(96px), - --1700: iro.fn-px-to-rem(136px), - --2300: iro.fn-px-to-rem(184px), + --1600: iro.fn-px-to-rem(128px), + --2000: iro.fn-px-to-rem(160px), --2400: iro.fn-px-to-rem(192px), --2500: iro.fn-px-to-rem(200px), --2600: iro.fn-px-to-rem(208px), diff --git a/src/objects/_action-menu.scss b/src/objects/_action-menu.scss index 5675ac4..3061293 100644 --- a/src/objects/_action-menu.scss +++ b/src/objects/_action-menu.scss @@ -116,7 +116,7 @@ @include iro.bem-elem('icon-slot') { display: flex; justify-content: center; - width: 1.2em; + width: fn.foreign-dim(--icon, --size); } } } diff --git a/src/objects/_avatar.scss b/src/objects/_avatar.scss index 51b144a..958d939 100644 --- a/src/objects/_avatar.scss +++ b/src/objects/_avatar.scss @@ -21,6 +21,21 @@ @include iro.props-namespace('avatar') { @include iro.props-store(( --dims: ( + --400: ( + --size: fn.global-dim(--size --1600), + --font-size: fn.global-dim(--font-size --800), + --indicator-size: fn.global-dim(--size --400), + ), + --300: ( + --size: fn.global-dim(--size --1200), + --font-size: fn.global-dim(--font-size --600), + --indicator-size: fn.global-dim(--size --300), + ), + --200: ( + --size: fn.global-dim(--size --800), + --font-size: fn.global-dim(--font-size --300), + --indicator-size: fn.global-dim(--size --225), + ), --150: ( --size: fn.global-dim(--size --650), --font-size: fn.global-dim(--font-size --200), @@ -124,7 +139,7 @@ } } - @each $size in 50 75 150 { + @each $size in 50 75 150 200 300 400 { @include iro.bem-modifier($size) { font-size: fn.dim(--#{$size} --font-size); -- cgit v1.2.3-54-g00ecf