Skip to content
This repository has been archived by the owner on Jul 28, 2024. It is now read-only.

[FRNT-536, FRNT-435] Rewrite Button on box model #110

Merged
merged 1 commit into from
May 7, 2021

Conversation

tatinacher
Copy link
Member

Rewrite Button on box model

  • FRNT-536
  • FRNT-435

@tatinacher tatinacher added the @atoms Changes inside atoms label May 6, 2021
@tatinacher tatinacher marked this pull request as draft May 6, 2021 12:07
@tatinacher tatinacher force-pushed the fix/FRNT-536-rewrite-button-on-box-model branch from 6762c05 to 3701b5b Compare May 6, 2021 12:10
@tatinacher tatinacher marked this pull request as ready for review May 6, 2021 12:10
Comment on lines +9 to +13
button {
padding: 0;
margin: 0;
}

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Лучше не добавлять глобальные стили, ведь тогда не получится встроить библиотеку компонентов в сущетсвующий проект, ведь можем спокойно получить конфликт стилей

@@ -40,10 +41,11 @@ export const Button = styled(ButtonBase)`
--local-shape-color: var(--woly-shape-default);
--local-border-color: var(--woly-shape-default);

${box};
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Почему бы не удалить переменные local-vertical, gap, compensate из компонента?

@@ -6,6 +6,11 @@ export const Global = styled.div`
font-family: 'Helvetica Neue', sans-serif;
}

button {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

а мы здесь будем сброс стилей описывать для компонентов?

);
--local-gap: calc(1px * var(--woly-component-level) * var(--woly-main-level));
--local-compensate: var(--local-vertical);
& > * {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

мб стоит отступы между блоками делами делать? читать не очень

@@ -40,10 +41,11 @@ export const Button = styled(ButtonBase)`
--local-shape-color: var(--woly-shape-default);
--local-border-color: var(--woly-shape-default);

${box};

box-sizing: border-box;
display: flex;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Снимок экрана 2021-05-07 в 14 44 06

прокинула кнопке размер N и она размерам не соответствует из-за бордера

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Мне кажется, было бы хорошо делать примеры с самими мелкими элементами, т.к. они чаще всего будут вложенными и на них будет ломаться box model

@sergeysova sergeysova merged commit 32e84f2 into master May 7, 2021
@sergeysova sergeysova deleted the fix/FRNT-536-rewrite-button-on-box-model branch May 7, 2021 12:34
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
@atoms Changes inside atoms
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants