Material-ui: [рдХреЛрд░] рдПрдХ рдЕрдзрд┐рдХ рдкрд░рд┐рд╖реНрдХреГрдд рд╕реНрдЯрд╛рдЗрд▓ рд╕рдорд╛рдзрд╛рди рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред

рдХреЛ рдирд┐рд░реНрдорд┐рдд 22 рдЕрдкреНрд░реИрд▓ 2016  ┬╖  100рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: mui-org/material-ui

@ рдХреИрд▓рдореЙрд▓ / рдореИрдЯреЗрд░рд┐рдпрд▓-рдпреВрдИ рдХреГрдкрдпрд╛ рдХреБрдЫ рдЗрдирдкреБрдЯ рдЫреЛрдбрд╝ рджреЗрдВ рдЬрдм рдЖрдк material рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ

рд╣рдореЗрдВ 0.16.0 рд▓рд┐рдП рдПрдХ рд╕реНрдЯрд╛рдЗрд▓ рд╕рдорд╛рдзрд╛рди рдкрд░ рдирд┐рд░реНрдгрдп рд▓реЗрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рдЬреЛ рд▓рдВрдмреЗ рд╕рдордп рддрдХ рдЦрдбрд╝реЗ рдореБрджреНрджреЛрдВ рдХреЛ рд╕рдВрдмреЛрдзрд┐рдд рдХрд░рдиреЗ рдореЗрдВ рдорджрдж рдХрд░реЗрдЧрд╛ред рдкреНрд░рджрд░реНрд╢рди рдХреЗ рдореБрджреНрджреЛрдВ рдХреЗ рдмрд╛рд╣рд░, рдЗрд╕ рддрдереНрдп рдХреЗ рд▓рд┐рдП рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рднреА рдЬрдЧрд╣ рд╣реИрдХ рдФрд░ рдкреНрд░реЙрдкреНрд╕ рд╣реИрдВ рдХрд┐ рд╣рдо рд╕реАрдПрд╕рдПрд╕ рдореЗрдВ рдХреБрдЫ рд╢рдХреНрддрд┐рд╢рд╛рд▓реА рд╡рд┐рд╢реЗрд╖рддрд╛рдУрдВ рдХреЛ рдпрд╛рдж рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдЬреЛ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ - рдЫрджреНрдо рдХрдХреНрд╖рд╛рдПрдВ, рдореАрдбрд┐рдпрд╛ рдХреНрд╡реЗрд░реА (рдмрд┐рдирд╛ рдорд┐рд▓рд╛рди рдХреЗ) ), рдЖрджрд┐ред

рдореИрдВ рдЬреЛ рд╕рдордЭрддрд╛ рд╣реВрдВ, рдЙрд╕рд╕реЗ рдЖрдо рд╕рд╣рдорддрд┐ рдпрд╣ рд╣реИ рдХрд┐ рд╣рдо рдПрдХ рдЬреЗрдПрд╕ рд╢реИрд▓реА рд╕рдорд╛рдзрд╛рди рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдЬрд┐рд╕рдореЗрдВ рдбреЛрдо рдореЗрдВ рд╡рд╛рд╕реНрддрд╡рд┐рдХ рд╕реНрдЯрд╛рдЗрд▓рд╢реАрдЯ рдХреЗ рд▓рд┐рдП рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд▓рд┐рдЦрдиреЗ рдХреА рдХреНрд╖рдорддрд╛ рд╣реИред

рдпрд╣рд╛рдБ рдХреБрдЫ рдмрдирд╛рдП рдЧрдП рд╕рдорд╛рдзрд╛рди рд╣реИрдВ рдЬреЛ рдпрд╣ рдХрд░рддреЗ рд╣реИрдВ:
https://github.com/rofrischmann/react-look
https://github.com/Khan/aphrodite
https://github.com/jsstyles/react-jss

рдирдП рд╕рдорд╛рдзрд╛рди (IMO) рдХреЛ рд▓рд╛рдЧреВ рдХрд░рддреЗ рд╕рдордп рд╣рдореЗрдВ рдХреБрдЫ рдмрд┐рдВрджреБрдУрдВ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ:

  1. рдХреНрдпрд╛ рдпрд╣ рд╣рдорд╛рд░реЗ рд▓рдХреНрд╖реНрдпреЛрдВ рдХреЗ рд╕рд╛рде рд╕рдВрд░реЗрдЦрд┐рдд рд╣реИ? (рд╣рд▓реНрдХреЗ рд╕реЗ рдКрдкрд░ рд╕реЗ рдЫреБрдЖ)
  2. рдореАрдбрд┐рдпрд╛ рдХреЗ рдкреНрд░рд╢реНрдиреЛрдВ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдирд╛ рдЬреЛ рдЙрдЪреНрдЪ рд╕реНрддрд░ рдХреЗ рдмреНрд░реЗрдХрдкреЙрдЗрдВрдЯ рдХрд╛ рдкрд╛рд▓рди рдХрд░рддреЗ рд╣реИрдВ рдХрд▓реНрдкрдирд╛ рдореЗрдВ рд╡рд┐рд╕реНрддреГрдд рд░реВрдк рд╕реЗ рдПрдХ рд╕реНрдЯрд╛рдЗрд▓рд╢реАрдЯ рдорд┐рд╢реНрд░рдг рдХреЗ рд╕рд╛рде рдШрдЯрдХреЛрдВ рдореЗрдВ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ (рдпрд╛ рдЬреЛ рднреА рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рд╣рдо рдЙрдиреНрд╣реЗрдВ рдХреЙрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ)ред рдпрджрд┐ рд╣рдо рд╢реИрд▓реА рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЛ рдУрд╡рд░рд╣реЙрд▓ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рддреЛ рдЗрд╕ рдкреБрд╕реНрддрдХрд╛рд▓рдп рдореЗрдВ рдмреЗрд╣рддрд░ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛рд╢реАрд▓ UI рд╕рдорд░реНрдерди рдХреЗ рд▓рд┐рдП рдмреАрдЬ рдмреЛрдиреЗ рдХрд╛ рдпрд╣ рдЙрдкрдпреБрдХреНрдд рдЕрд╡рд╕рд░ рд╣реИред рдпрд╣ рдФрд░ рднреА рдмреЗрд╣рддрд░ рд╣реЛрдЧрд╛ рдЕрдЧрд░ рдпреЗ рдЙрдкрдХрд░рдг рдпреВрдЬрд░рд▓реИрдВрдб рдореЗрдВ рднреА рдЙрдкрд▓рдмреНрдз рд╣реЛрдВ if
  3. рдХреНрдпрд╛ рд╣рдореЗрдВ рд▓реЗрдмрд░ рдХреЗ рдлреНрд▓реЗрдХреНрд╕рдмреЙрдХреНрд╕ рд▓реЗрдЖрдЙрдЯ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЛ рдПрдХреАрдХреГрдд рдХрд░рдиреЗ рдореЗрдВ рдорджрдж рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд▓реЗрдЖрдЙрдЯ рд╣реЗрд▓реНрдкрд░ рдШрдЯрдХреЛрдВ рдФрд░ / рдпрд╛ рдорд┐рдХреНрд╕рд┐рдиреНрд╕ рдХрд╛ рдирд┐рд░реНрдорд╛рдг рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП?
  4. рдХреНрдпрд╛ рдирдП рд╕рдорд╛рдзрд╛рди рдХреЗ рд╕рд░реНрд╡реЛрддреНрддрдо рдЙрдкрдпреЛрдЧ рдХреЛ рдЕрдзрд┐рдХрддрдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдереАрдорд┐рдВрдЧ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ? рдЬрдмрдХрд┐ рдереАрдорд┐рдВрдЧ рд▓рдЧрд╛рддрд╛рд░ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХрд╛ рдПрдХ рдШрдЯрдХ рд╣реИ, рд╣рдореЗрдВ рдХрдИ рд╕рд╛рдорд╛рдиреНрдп рд╕рд╛рдордЧреНрд░реА рд╢реИрд▓рд┐рдпреЛрдВ рдЬреИрд╕реЗ рд╡реИрд╢реНрд╡рд┐рдХ рдХреАрд▓рд╛рдЗрди / рдлрд╝реЙрдиреНрдЯ рдЖрдХрд╛рд░ / рд░рд┐рдХреНрддрд┐ / рдорд╛рд░реНрдЬрд┐рди / рдЖрджрд┐ рдХреЗ рд▓рд┐рдП рдЪрд░ рдмрдирд╛рдиреЗ рдкрд░ рднреА рдзреНрдпрд╛рди рджреЗрдирд╛ рдЪрд╛рд╣рд┐рдПред рдореИрдВ рджреГрдврд╝рддрд╛ рд╕реЗ рд╕рд▓рд╛рд╣ рджреЗрддрд╛ рд╣реВрдВ рдХрд┐ рд╣рдо рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдЯрд╛рдЗрдкреЛрдЧреНрд░рд╛рдлреА рдЧрд╛рдЗрдб рд╕реЗ рдореЗрд▓ рдЦрд╛рддреЗ рд╣реБрдП рдкреВрд░реНрд╡рдирд┐рд░реНрдзрд╛рд░рд┐рдд рдкреНрд░рдХрд╛рд░ рдХреА рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рдирд┐рд░реНрдорд╛рдг рдХрд░рдХреЗ рдЕрдкрдиреА рдЯрд╛рдЗрдкреЛрдЧреНрд░рд╛рдлреА рдХреА рд╕реНрдерд┐рд░рддрд╛ рдореЗрдВ рд╕реБрдзрд╛рд░ рдХрд░реЗрдВ, рдФрд░ рдЗрди рд╡реИрд╢реНрд╡рд┐рдХ рдкреНрд░рдХрд╛рд░ рдХреЗ рд╕реНрдЯрд╛рдЗрд▓ рд╡реЗрд░рд┐рдПрдмрд▓реНрд╕ рдХреЛ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рдореЗрдВ рдпрдерд╛рд╕рдВрднрд╡ рд╕рд░реНрд╡реЛрддреНрддрдо рддрд░реАрдХреЗ рд╕реЗ рдШрдЯрдХ рддрддреНрд╡реЛрдВ рдХрд╛ рдорд┐рд▓рд╛рди рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВред
  5. рдпрджрд┐ рд▓рд╛рдЗрдмреНрд░реЗрд░реА рдХрд╛ рдЙрдкрдпреЛрдЧ react-look рдЬрд┐рддрдирд╛ рдмрдбрд╝рд╛ рд╣реИ, рддреЛ рдХреЛрд╢рд┐рд╢ рдХрд░реЗрдВ рдФрд░ рджреЗрдЦреЗрдВ рдХрд┐ рд╣рдо рдиреНрдпреВрдирддрдо рдмрд┐рд▓реНрдб рдЖрдХрд╛рд░ рдХреЗ рд▓рд┐рдП рдореЙрдбреНрдпреВрд▓ рдХреИрд╕реЗ рдЖрдпрд╛рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдпрджрд┐ рд╣рдо рдмрд┐рд▓реНрдб рдЖрдХрд╛рд░ рдкрд░ рдкреНрд░рднрд╛рд╡ рдХреЛ рдХрдо рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рдореИрдВрдиреЗ рдорд╣рд╕реВрд╕ рдХрд┐рдпрд╛ рдХрд┐ 9kb рдЙрд╕ https://github.com/rofrischmann/inline-style-prefixer рд╣реИ рдЬрд┐рд╕реЗ рд╣рдо рдкрд╣рд▓реЗ рд╕реЗ рд╣реА ... of
discussion performance umbrella

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдХреНрдпрд╛ рд╕реНрдЯрд╛рдЗрд▓ рд╕рдорд╛рдзрд╛рди рдХреЛ рдЕрдВрддрд┐рдо рд░реВрдк рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ?

рд╕рднреА 100 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдХреБрдЫ рдФрд░ рд╕рд╡рд╛рд▓:
6) рдХреНрдпрд╛ рд╣рдо xxxxStyle рдкреНрд░реЙрдкреНрд╕ рдХреЛ рдирд┐рдХрд╛рд▓рдиреЗ рдпрд╛ рд╣рдЯрд╛рдиреЗ рдХрд╛ рд▓рдХреНрд╖реНрдп рд░рдЦреЗрдВрдЧреЗ рдФрд░ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдбрд┐рдВрдЧ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд▓рд┐рдП xxxClassName рдХрд░рдирд╛ рд╣реЛрдЧрд╛? рдпрд╛ рдпреЗ рддрд╛рд░реАрдл рд╣реЛрдЧреА?
7) рдХреНрдпрд╛ рд╣рдо CSS рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдиреЗ рджреЗрдВрдЧреЗ рдФрд░ рд╣рдорд╛рд░реЗ рдШрдЯрдХреЛрдВ рдХреЗ рдЗрдВрдЯрд░рдлреЗрд╕ рдХреЛ рд╕рд░рд▓ рдХрд░реЗрдВрдЧреЗред рддреЛ рдЕрдЧрд░ рдореИрдВ IconMenu рдореЗрдВ menuItemStyle рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ, рддреЛ рдХреНрдпрд╛ рдореИрдВ style = StyleSheet.create({ IconMenu: {MenuItem: { color:red }}) рдкреНрд░рдХрд╛рд░ рдУрд╡рд░рд░рд╛рдЗрдб рдмрдирд╛рдКрдВ?

@chrismcv рдореЗрд░реА рд╡реНрдпрдХреНрддрд┐рдЧрдд рд░рд╛рдп рд╣реИ рдХрд┐ рд╣рдореЗрдВ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдЗрди рд╕реБрдкрд░ рд╡рд┐рд╢рд┐рд╖реНрдЯ рдкреНрд░реЙрдкреНрд╕ рдХреЛ рд╣рдЯрд╛рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рдорд╛рдзрд╛рди рдХрд╛ рд▓рд╛рдн рдЙрдард╛рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рдЬреЛ рд╣рдо рдкреНрд░рд╕реНрддрд╛рд╡рд┐рдд рджреЗрдЦ рд░рд╣реЗ рд╣реИрдВ: [TextField] рдЪрд▓

рдЗрд╕рд╕реЗ рдкрд╣рд▓реЗ рдХрд┐ рд╣рдо рдпрд╣ рдЬрд╛рдирддреЗ рд╣реИрдВ, рд▓реЛрдЧ рд╣рд░ рд╕рдВрднрд╡ рдлрд╝реЛрдХрд╕ / рд╕рдХреНрд░рд┐рдп / рд╣реЛрд╡рд░ / рдЬреЛ рднреА рд░рд╛рдЬреНрдп рдХреЗ рд▓рд┐рдП рдЙрдкрд╕рдореБрдЪреНрдЪрдп рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд▓рд┐рдП рд╕рд╣рд╛рд░рд╛ рдорд╛рдВрдЧрдиреЗ рдЬрд╛ рд░рд╣реЗ рд╣реИрдВред

рдореИрдВ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдореБрджреНрджреЛрдВ рдХреЛ рджреЗрдЦрддрд╛ рд╣реВрдВ рдЬреЛ "рдХреИрд╕реЗ XXX рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рдирд╛ рд╣реИ", "YYYY рдХреЗ рдЕрдВрджрд░ XXX рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ", " somethingInsideToTheLeftButSlightlyMiddleFocusHoverActiveStyle рдХреЛ XXX рдХреГрдкрдпрд╛ рдЬреЛрдбрд╝реЗрдВ"

@chrismcv 6. 6. рдЕрдзрд┐рдХ рд╕рд╛рдорд╛рдиреНрдп xxxxStyle рдкреНрд░реЙрдкреНрд╕ рдмрдирд╛рдо рдХреНрд▓рд╛рд╕рдиреЗрдо рдХреЗ рд╕рдВрдмрдВрдз рдореЗрдВ, рдЖрдкрдХреЛ рдХреНрдпрд╛ рд▓рдЧрддрд╛ рд╣реИ? рд╣рдорд╛рд░реЗ рдХреБрдЫ рдШрдЯрдХреЛрдВ рдХреЗ рд╕рд╛рде рдЖрдк рдПрдХ рдпрд╛ рджреВрд╕рд░реЗ рддрд░реАрдХреЗ рд╕реЗ рдкрд╣реБрдВрдЪрдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реЛрдиреЗ рдЬрд╛ рд░рд╣реЗ рд╣реИрдВ (рд╕реМрднрд╛рдЧреНрдп рд╕реЗ рд╣рдо :hover рдЖрджрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реЛрдВрдЧреЗ!)ред

@chrismcv рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ xxxxStyle рдкреНрд░реЙрдкреНрд╕ style рдкреНрд░реЙрдкрд░реНрдЯреА рдореЗрдВ рдЬрд╛рдиреЗ рдЪрд╛рд╣рд┐рдП, рди рдХрд┐ className -рдПрдлрд╝рд╛рдЗрдиреНрдб рд╕реНрдЯрд╛рдЗрд▓ рдСрдмреНрдЬреЗрдХреНрдЯ рдореЗрдВред

@nathanmark рд╡рд╛рд░реНрддрд╛рд▓рд╛рдк рдХреЛ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред рдпрд╣ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдкреНрд░рдореБрдЦ рдореБрджреНрджреЛрдВ рдореЗрдВ рд╕реЗ рдПрдХ рд╣реИ рдЬрд┐рд╕реЗ рд╣рдореЗрдВ рдЕрдЧрд▓реА рд░рд┐рд▓реАрдЬ рдХреЗ рд▓рд┐рдП рд╕рдВрдмреЛрдзрд┐рдд рдХрд░рдирд╛ рд╣реИ majorред

рдкреНрд░рджрд░реНрд╢рди рдХреЗ рдореБрджреНрджреЛрдВ рдХреЗ рдмрд╛рд╣рд░

рдореЗрд░реЗ рд▓рд┐рдП, рдпрд╣ рдПрдХ рдореБрдЦреНрдп рдЪрд┐рдВрддрд╛ рд╣реИ рдЬрд┐рд╕рдХрд╛ рд╕рдорд╛рдзрд╛рди рд╣рдо рдЪреБрди рд▓реЗрдВрдЧреЗред
рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдХрдИ рдорд╛рдирдХ рдирд╣реАрдВ рд╣реИрдВ, рд╣рдо рдХрд▓реНрдкрдирд╛ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдХрд┐ рд╣рдордиреЗ рдЕрдкрдиреЗ рд╡рд░реНрддрдорд╛рди рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЗ рд╕рд╛рде рдХрдИ рд╕реАрдкреАрдпреВ рдЪрдХреНрд░ рдЦреЛ рджрд┐рдПред рд╕реАрдкреАрдпреВ рдЪрдХреНрд░ рд╣рдорд╛рд░реА рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓реА рд╡рд╕реНрддреБ рдХреЗ рд▓рд┐рдП рд╕реНрдореГрддрд┐ рдЖрд╡рдВрдЯрди рдФрд░ рдХрдЪрд░рд╛ рд╕рдВрдЧреНрд░рд╣ рдореЗрдВ рдЦреЛ рдЬрд╛рддреЗ рд╣реИрдВред

@oliviertassinari

рдореИрдВ рдЗрд╕ рд╕рдордп JS рд╕реНрдЯрд╛рдЗрд▓ рд╕рдорд╛рдзрд╛рдиреЛрдВ рдХреЗ рдПрдХ рдЬреЛрдбрд╝реЗ рдХреЗ рд╕рд╛рде рдЦреЗрд▓ рд░рд╣рд╛ рд╣реВрдВред рдпрд╣ рджрд┐рд▓рдЪрд╕реНрдк рд╣реИ рд▓реЗрдХрд┐рди рд╕реНрдкрд╖реНрдЯ рд╣реИ рдХрд┐ рдЕрднреА рднреА "рд╢реБрд░реБрдЖрддреА рджрд┐рди" рд╣реИрдВ рдЗрд╕рд▓рд┐рдП рдмреЛрд▓рдирд╛ рд╣реИред

рдПрдХ рдмрд╛рдд рдЬреЛ рдореИрдВ рд╕реЛрдЪ рд░рд╣рд╛ рдерд╛ - рдЧрддрд┐рд╢реАрд▓ рд╢реИрд▓реА рдЧреБрдгреЛрдВ рдХреЗ рдмрд╛рд╣рд░ (рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП, рдпрджрд┐ рдШрдЯрдХ рдореЗрдВ color рдкреНрд░реЛрдк рд╣реИ), рддреЛ рдХреНрдпрд╛ рд╣рдореЗрдВ рдЖрдзрд╛рд░ рд╢реИрд▓реА рд╡рд╕реНрддреБ рдмрдирд╛рдиреЗ рдХреЗ рддрд░реАрдХреЗ рдХреЛ рдмрджрд▓рдирд╛ рдЪрд╛рд╣рд┐рдП?

рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдЬреИрд╕реЗ рдЬреЗрдПрд╕ рд╢реИрд▓реА рдХреЗ рдХрд╛рдореЛрдВ рдХреЗ рд╕рд╛рде, рдЕрдзрд┐рдХрддрдо рдкреНрд░рджрд░реНрд╢рди рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЛ рдЙрдирдХреЗ StyleSheet.create() рдкрджреНрдзрддрд┐ рдХрд╛ рдПрдХ рдмрд╛рд░ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП рдФрд░ рдХреБрдВрдЬреА (рд╕реАрдПрд╕рдПрд╕ "рдХрдХреНрд╖рд╛рдПрдВ") рдХреЛ рдЙрд╕ рд╡рд╕реНрддреБ рдореЗрдВ рд╕рд╣рд╛рд░рд╛ / рд░рд╛рдЬреНрдпреЛрдВ рдХреЗ рд▓рд┐рдП рдЬреИрд╕реЗ open={true} рд╕рд╢рд░реНрдд рдЧреБрдгреЛрдВ рдХреЗ рдПрдХ рдЬреЛрдбрд╝реЗ рдХреЗ рд╕рд╛рде рд╢реИрд▓реА рд╡рд╕реНрддреБ рд╢рд╛рдмреНрджрд┐рдХ рд░реВрдк рд╕реЗ рдЧрддрд┐рд╢реАрд▓ рд░реВрдк рд╕реЗ рдирд┐рд░реНрдорд╛рдг рдХрд░рдиреЗ рдФрд░ рд╣рд░ рдПрдХ рд╢реИрд▓реА рдХреЗ рд▓рд┐рдП рдЗрд╕реЗ рдкреНрд░рд╕реНрддреБрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕реНрдЯрд╛рдЗрд▓рд╢реАрдЯ рдлреИрдХреНрдЯреНрд░реА рд╡рд┐рдзрд┐ рдХреЛ рдкрд╛рд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рдмрдЬрд╛рдпред

рднрд▓реЗ рд╣реА рд╕реНрдЯрд╛рдЗрд▓рд╢реАрдЯ рд╕реЗрд▓реЗрдХреНрдЯрд░реНрд╕ рдЗрд╕ рдЕрд░реНрде рдореЗрдВ рдХреИрд╢реНрдб рд╣реЛ рдЬрд╛рддреЗ рд╣реИрдВ рдХрд┐ рд╡реЗ рдХреЗрд╡рд▓ рдПрдХ рдмрд╛рд░ рд╣реА DOM рдореЗрдВ рд▓рд┐рдЦреЗ рдЧрдП рд╣реИрдВ (рдФрд░ рдХреЗрд╡рд▓ render() рд▓рд┐рдП рдЖрд╡рд╢реНрдпрдХ рд╣реЛрдиреЗ рдкрд░ DOM рдХреЗ рд▓рд┐рдП рд▓рд┐рдЦреЗ рдЧрдП рдХреБрдЫ рдкрд░рд┐рд╡рд╛рджреЛрдВ рдореЗрдВ), рд╣рдо рдЕрднреА рднреА рдХреБрдЫ рдЧрдгрдирд╛рдУрдВ рдХреЗ рд╕рд╛рде рд╕рдВрд╕рд╛рдзрдиреЛрдВ рдХреЛ рдмрд░реНрдмрд╛рдж рдХрд░ рд░рд╣реЗ рд╣реИрдВред + рдСрдмреНрдЬреЗрдХреНрдЯ рдирд┐рд░реНрдорд╛рдг + рдХрдЪрд░рд╛ рд╕рдВрдЧреНрд░рд╣ рдЬреИрд╕рд╛ рдХрд┐ рдЖрдкрдиреЗ рдКрдкрд░ рдмрддрд╛рдпрд╛ рдХрд┐ рдпрджрд┐ рд╣рдо рдПрдХ рдирдИ рд╢реИрд▓реА рдХреА рд╡рд╕реНрддреБ рдмрдирд╛ рд░рд╣реЗ рд╣реИрдВ, рддреЛ рд╣рд░ рдПрдХ рдмрд╕ рдЙрд╕реЗ рдлреЗрдВрдХ рджрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред

рд╣рдореНрдордо ... рдореИрдВрдиреЗ рдХрд▓ (рд░рд╡рд┐рд╡рд╛рд░) рдпрд╣рд╛рдВ рдПрдХ рдЯрд┐рдкреНрдкрдгреА рдЫреЛрдбрд╝ рджреАред рдХреНрдпрд╛ рдпрд╣ рдирд╖реНрдЯ рд╣реЛ рдЧрдпрд╛?

@rvbyron рдореБрдЭреЗ рдпрд╣ рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдпрд╛рдж рд╣реИред рдореИрдВ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рд╣рд╛рд▓рд╛рдВрдХрд┐ рдЗрд╕реЗ рд╣рдЯрд╛ рдирд╣реАрдВ рдерд╛ред

@rvbyron рдореБрдЭреЗ рднреА рдпрд╛рдж рд╣реИред рдореБрдЭреЗ рдХреБрдЫ рдирд╣реАрдВ рдкрддрд╛ рдХрд┐рдХреНрдпрд╛ рд╣реБрдЖ?

@rvbyron - рдореЗрд░реЗ рдИрдореЗрд▓ рдореЗрдВ рдерд╛, рдЗрд╕рд▓рд┐рдП рдпрд╣рд╛рдБ рдЙрджреНрдзреГрдд рд░реВрдк рдореЗрдВ!

рдЦреИрд░, рдореИрдВ рдПрдХ рдХреЗ рд▓рд┐рдП рдХрдИ рдЪреАрдЬреЗрдВ рджреЗрдЦрдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛ред

рдП) рд╣рд╛рдВ, рд╣рд░ рддрд░рд╣ рд╕реЗ рдкреБрд╕реНрддрдХрд╛рд▓рдп рд╕реНрддрд░ рдкрд░ рддрддреНрд╡ рдХреА рд╢реИрд▓реА рдкреИрд░рд╛рдореАрдЯрд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рдЫреБрдЯрдХрд╛рд░рд╛ рдкрд╛рдПрдВред рд╕рднреА рдШрдЯрдХреЛрдВ рдХреЛ рдХреНрд▓рд╛рд╕рдиреЗрдо рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред рдШрдЯрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рд╢реИрд▓реА рд╕реАрдПрд╕рдПрд╕ рдСрдлрд╝рд░ рдХреЗ рд╕рднреА рдкрд╛рд╡рд░ рдХреЛ рдирд╖реНрдЯ рдХрд░ рджреЗрддреА рд╣реИред
рдмреА) рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдХрд┐ рдкреНрд░рддреНрдпреЗрдХ рдШрдЯрдХ рдХреЗ рдореВрд▓ рддрддреНрд╡ рдХреЗ рд╕рд╛рде рдХреНрд▓рд╛рд╕рдиреЗрдо рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рд░реВрдк рд╕реЗ рдЬреБрдбрд╝рд╛ рд╣реБрдЖ рд╣реЛ (рдЬреИрд╕реЗ рдХрд┐ RaisedButton рдШрдЯрдХ рдХрд╛ рдореВрд▓ рд░реВрдк рд╕реЗ className = "mui-рдЙрдард╛рдпрд╛-рдмрдЯрди" рдШрдЯрдХ рдХреЗ рдореВрд▓ рддрддреНрд╡ рдкрд░ рд╣реЛрдЧрд╛)ред рдпрд╣ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреЛ рдмрд╣реБрдд рдЖрд╕рд╛рди рдмрдирд╛ рджреЗрдЧрд╛ред рд╡рд╣ рднреА рд╡рд┐рдиреНрдпрд╛рд╕ рдпреЛрдЧреНрдп рд╣реЛ рд╕рдХрддрд╛ рд╣реИред
рд╕реА) рдкреВрд░реА рддрд░рд╣ рд╕реЗ muiTheme.js рдлрд╝рд╛рдЗрд▓реЛрдВ рд╕реЗ рдмрд╛рд╣рд░ рдереАрдо рдкреНрд░рд╛рдкреНрдд рдХрд░реЗрдВред рдПрдХ рдереАрдорд┐рдВрдЧ muiTheme.SCSS рдлрд╝рд╛рдЗрд▓ рдЗрд╕ рдорд╛рдорд▓реЗ рдореЗрдВ рдмрд╣реБрдд рдмреЗрд╣рддрд░ рд╣реЛрдЧреА рдХрд┐ рдпрд╣ рдереАрдо рдирд┐рд░реНрдорд╛рддрд╛ рджреНрд╡рд╛рд░рд╛ рдЪреБрдиреА рдЧрдИ рдХрд┐рд╕реА рднреА рд╕рдВрдкрддреНрддрд┐ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрдЧрд╛ рдФрд░ рди рдХрд┐ рдХреЗрд╡рд▓ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рдШрдЯрдХ рджреНрд╡рд╛рд░рд╛ рдЕрдиреБрдордд рд╣реИред рдмреЗрд╢рдХ рдЗрд╕рдХреЗ рд▓рд┐рдП рд╢рд╛рдпрдж рдмреА рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдФрд░ рд╕рдХреНрд░рд┐рдп рд╣реЛрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрдЧреАред
рдбреА) рд░рд┐рдПрдХреНрдЯ-рд▓реБрдХ рдПрдХ рдЕрдЪреНрдЫрд╛ рд╕рдордЭреМрддрд╛ рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ JSON рдСрдмреНрдЬреЗрдХреНрдЯреНрд╕ рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдкреНрд░реЙрдкрд░реНрдЯреАрдЬ рдореЗрдВ рдкрд░рд┐рд╡рд░реНрддрд┐рдд рдХрд░рддрд╛ рд╣реИред рдпрд╣ рдЪреАрдЬреЛрдВ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдирд╛ рдЖрд╕рд╛рди рдмрдирд╛рддрд╛ рд╣реИред рд╣рд╛рд▓рд╛рдБрдХрд┐, рдЬреИрд╕рд╛ рдХрд┐ рдореИрдВрдиреЗ рдКрдкрд░ C рдореЗрдВ рдХрд╣рд╛ рд╣реИ, рдореИрдВ рдЕрднреА рднреА SCSS рдореЗрдВ рдереАрдо рдмреЗрд╕ рдмрдирд╛рдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛ред рдореИрдВ рдмрд╣реБрдд рдЦреБрд▓рд╛ рд╣реВрдВ рдЬрд┐рд╕ рдкрд░ CSS рд╕рд╣рд╛рдпрддрд╛ рдкреИрдХреЗрдЬ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИред рд▓реЗрдХрд┐рди рдореИрдВ рдЙрд╕ рдЪреАрдЬрд╝ рд╕реЗ рджреВрд░ рд░рд╣реВрдБрдЧрд╛ рдЬреЛ рдХреНрд▓рд╛рд╕рдиреЗрдо рдкреИрд░рд╛рдореАрдЯрд░ рдкрд░ рддрддреНрд╡ рдХреА рд╢реИрд▓реА рдкреИрд░рд╛рдореАрдЯрд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рддреА рдереАред

@chrismcv рдзрдиреНрдпрд╡рд╛рдж рджреЛрд╕реНрдд!

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ @rvbyron рдХреЛ рдЬреЛ рдХрд╣рдирд╛ рд╣реИ рд╡рд╣ рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдХреБрдЫ рдорд╛рдпрдиреЛрдВ рдореЗрдВ, JS рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдирд┐рдпрдорд┐рдд рд╕реАрдПрд╕рдПрд╕ рд╕реЗ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдмрджрд▓рд╛рд╡ рд╣реИред рдЕрдзрд┐рдХрд╛рдВрд╢ рд▓реЛрдЧ рдЕрдкрдиреЗ рджрд┐рди рдХреЗ рдХрд╛рдо рдореЗрдВ рдЬреЗрдПрд╕ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдФрд░ рдЗрд╕рдХреЗ рд▓рд┐рдП рдПрдХ рдЕрд▓рдЧ рддрд░реАрдХреЗ рдХреА рд╕реЛрдЪ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ + рдпрд╣ рдЙрди рдбрд┐рдЬрд╛рдЗрдирд░реЛрдВ рдХреЗ рд▓рд┐рдП рдХрдард┐рди рдмрдирд╛рддрд╛ рд╣реИ рдЬреЛ рдЖрдорддреМрд░ рдкрд░ рдЙрди рдкрд░рд┐рдпреЛрдЬрдирд╛рдУрдВ рдореЗрдВ рдпреЛрдЧрджрд╛рди рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдЬреЛ рдЬреЗрдПрд╕ рдореЗрдВ рдЗрддрдиреЗ рдХреБрд╢рд▓ рдирд╣реАрдВ рд╣реИрдВред

рдпрд╣рд╛рдВ рд╕рднреА рдХреЛрдгреЛрдВ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░рдирд╛ рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╣реИред

@oliviertassinari @chrismcv

рдПрдХ рдмрд╛рдд рдЬреЛ рдореБрдЭреЗ react-look рдмрд╛рд░реЗ рдореЗрдВ рдорд╣рд╕реВрд╕ рд╣реБрдИ, рд╡рд╣ рдпрд╣ рд╣реИ рдХрд┐ рдЖрдкрдХреЛ рдЕрдкрдиреЗ рд╕рднреА рдШрдЯрдХреЛрдВ рдХреЛ look HC рдореЗрдВ рд▓рдкреЗрдЯрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ ред рдпрд╣ рдмрд╣реБрдд рдЖрдХреНрд░рд╛рдордХ рд▓рдЧрддрд╛ рд╣реИ, рдпрд╣ render() рдлрдВрдХреНрд╢рди рдХреЛ рд╣рд╛рдИрдЬреИрдХ рднреА рдХрд░рддрд╛ рд╣реИ, super.render() рдХреЛ const рд╕реНрдЯреЛрд░ рдХрд░рддрд╛ рд╣реИ рдФрд░ рдЗрд╕ рддрд░рд╣ рд╕реЗ рд╕реНрдЯрд╛рдЗрд▓ рд░рд┐рдЬрд╝реЙрд▓реНрдпреВрд╢рди рдСрдкрд░реЗрд╢рди рдХрд░рддрд╛ рд╣реИред рдЦрд╛рди / рдХрд╛рдореЛрддреНрддреЗрдЬрдХ рдЬреИрд╕реЗ рдХреБрдЫ рдЕрдиреНрдп рд╕рдорд╛рдзрд╛рдиреЛрдВ рдХреЗ рд▓рд┐рдП styles.xxxx Stylesheet.create() className={} рдЕрдВрджрд░ Stylesheet.create() рд▓рдЧрднрдЧ рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдЖрд╡рд░рдг рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрддреА рд╣реИред

рд╕реАрдПрд╕рдПрд╕ рдХреЗ рд▓рд┐рдП render() рдлрд╝рдВрдХреНрд╢рди рдХрд╛ рдЕрдкрд╣рд░рдг рдХрд░рдирд╛ рдореБрдЭреЗ рдЕрдзрд┐рдХ рдЗрдВрдЬреАрдирд┐рдпрд░ рд▓рдЧрддрд╛ рд╣реИред рдпрд╣ рдореБрдЭреЗ рдмрддрд╛рддрд╛ рд╣реИ рдХрд┐ рдЗрд╕ рдкреНрд░рдХрд╛рд░ рдХреА рдЧрд╣рди рдПрдХреАрдХреГрдд рд╢реИрд▓рд┐рдпреЛрдВ рдХреА рдХрд╛рд░реНрдпрдХреНрд╖рдорддрд╛ рдХреЗ рд▓рд┐рдП рдЯреВрд▓реАрдВрдЧ / рд╕рдорд░реНрдерди рдореЗрдВ рдирд┐рд░реНрдорд┐рдд рд░рд┐рдПрдХреНрдЯ рдмрд╕ рдирд╣реАрдВ рд╣реИ, рдореБрдЭреЗ рдпрдХреАрди рд╣реИ рдХрд┐ рд╣рдорд╛рд░реЗ рд╕рднреА рдШрдЯрдХреЛрдВ рдХреЗ рд▓рд┐рдП рд░реЗрдВрдбрд░ рдХреЛ рдирд┐рдпрдВрддреНрд░рд┐рдд рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рд╕реАрдПрд╕рдПрд╕ рд╣реЗрд▓реНрдкрд░ рдПрдЪрдУрд╕реА рдХреЗ рд╡рд┐рдЪрд╛рд░ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдирд╣реАрдВ рд╣реИред

рд╡рд┐рдЪрд╛рд░?

рд╣рд╛рдп рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдЯреАрдо!

рдХреБрдЫ рд╕рдордп рд╕реЗ рдЖрдк рдХрд╛ рдЕрдиреБрд╕рд░рдг рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдФрд░ рдЕрдм, рдЗрд╕ рд╡рд┐рд╖рдп рдХреЛ рджреЗрдЦрдХрд░, рдореИрдВ рдХреБрдЫ рд╡рд┐рдЪрд╛рд░реЛрдВ рдХреЗ рд╕рд╛рде рдпреЛрдЧрджрд╛рди рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рдерд╛ рдХрд┐ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рд╕реЗ рд╕реАрдПрд╕рдПрд╕ рдореЗрдВ рдЬрд╛рдирд╛ рдПрдХ рдЕрдЪреНрдЫрд╛ рд╡рд┐рдЪрд╛рд░ рдХреНрдпреЛрдВ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдореИрдВрдиреЗ рдЗрд╕ рд░реЗрдкреЛ рдореЗрдВ рдмрд╣реБрдд рд╕рд╛рд░реА рдЪрд░реНрдЪрд╛рдПрдБ рдкрдврд╝реА рд╣реИрдВ, рдЬреЛ рдкреНрд░рддрд┐рдкрд╛рджрди рдкреНрд░рджрд░реНрд╢рди, рд╕реНрдЯрд╛рдЗрд▓ рд╡рд╛рд▓реЗ рдмрдЪреНрдЪреЛрдВ / рдиреЗрд╕реНрдЯреЗрдб рддрддреНрд╡реЛрдВ, рдореАрдбрд┐рдпрд╛ рдХреЗ рдкреНрд░рд╢реНрдиреЛрдВ, рдЫрджреНрдо рддрддреНрд╡реЛрдВ, рдЖрджрд┐ рдХреЛ рдХрд╡рд░ рдХрд░рддреА рд╣реИрдВ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рдХреБрдЫ рдФрд░ рдкрд░ рдзреНрдпрд╛рди рдХреЗрдВрджреНрд░рд┐рдд рдХрд░реВрдБрдЧрд╛, рдЬрд┐рд╕рдХреА рдореИрдВрдиреЗ рдЕрднреА рддрдХ рдЪрд░реНрдЪрд╛ рдирд╣реАрдВ рдХреА рд╣реИ, рд▓реЗрдХрд┐рди рдЬреЛ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдкреНрд░рд╛рд╕рдВрдЧрд┐рдХ рднреА рд╣реИред рдФрд░ рдпрд╣ рд╕реНрдЯрд╛рдЗрд▓ рд╕рдВрдЧрдарди рд╣реИред рдпрд╣реА рд╣реИ рдЬреЛ рдореЗрд░рд╛ рдорддрд▓рдм рд╣реИ:

  • рдХреБрдЫ рд╢реИрд▓рд┐рдпреЛрдВ рдШрдЯрдХ рдЪреВрдХ рд╕реЗ рдЖрддреЗ рд╣реИрдВ (рдЬреЛ рдиреЛрдб рдлрд╝реЛрд▓реНрдбрд░ рдореЗрдВ рд╕реЗрдЯ рдХрд┐рдП рдЬрд╛рддреЗ рд╣реИрдВ рдФрд░ рд╕реНрдкрд░реНрд╢ рдХрд░рдиреЗ рдпреЛрдЧреНрдп рдирд╣реАрдВ рд╣реЛрддреЗ рд╣реИрдВ)
  • рдХреБрдЫ рдШрдЯрдХ рдорд╛рдкрджрдВрдбреЛрдВ рд╕реЗ рдЖрддреЗ рд╣реИрдВ (рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЕрд╡рддрд╛рд░ рдШрдЯрдХ рдкреИрд░рд╛рдореАрдЯрд░ size={40} рд╕реЗрдЯ рдХреА рдЪреМрдбрд╝рд╛рдИ, рдКрдВрдЪрд╛рдИ рдФрд░ рд▓рд╛рдЗрди-рдКрдБрдЪрд╛рдИ рд╕реЗ 40px )
  • рдЬрдм рдШрдЯрдХ рдбрд┐рдлреЙрд▓реНрдЯ рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ (рдереАрдо рд░рдВрдЧ) рддреЛ рд╢реИрд▓реА рдереАрдо рдЕрдиреБрдХреВрд▓рди рд╕реНрдерд╛рди рд╕реЗ рдЖрддреА рд╣реИрдВ
  • рдЬрдм рдмрд╛рдХреА рдШрдЯрдХ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ рддреЛ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдПрдХ рдШрдЯрдХ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рд╕реЗ рдЖрддрд╛ рд╣реИ, рдЬреЛ рдХреЛрдб рдореЗрдВ рдПрдХ рдФрд░ рд╣рд┐рд╕реНрд╕рд╛ рд╣реИ

рдЬрдм рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░рдиреЗ рдХреА рдмрд╛рдд рдЖрддреА рд╣реИ рддреЛ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдХрдо рд╕реЗ рдХрдо 4 рдЕрд▓рдЧ-рдЕрд▓рдЧ рд╕реНрдерд╛рди (the) рд╣реИрдВ, рдЬрд┐рд╕рд╕реЗ рдореБрджреНрджреЛрдВ рдХреА рдЬрд╛рдВрдЪ рдХрд░рдирд╛ рдореБрд╢реНрдХрд┐рд▓ рд╣реЛ рдЬрд╛рддрд╛ рд╣реИред

рдЬрдм рд╢реИрд▓рд┐рдпрд╛рдБ css рдХреЗ рд╕рд╛рде рдЖрддреА рд╣реИрдВ, рддреЛ рдЖрдк рдЪрдпрдирдХрд░реНрддрд╛ рдХреЛ рджреЗрдЦреЗрдВрдЧреЗ рдФрд░ рдареАрдХ рд╕реЗ рдЬрд╛рди рдкрд╛рдПрдВрдЧреЗ рдХрд┐ рдХрд╣рд╛рдБ рдареАрдХ рдХрд░рдирд╛ рд╣реИред рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рдпрд╣ рд╕рдордЭрдиреЗ рдореЗрдВ рд╕рдордп рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╡рд┐рд╢реЗрд╖ рд╕рдВрдкрддреНрддрд┐ рдХрд╣рд╛рдВ рд╕реЗ рдЖрддреА рд╣реИ, рдФрд░ рдХрд╣рд╛рдВ рдФрд░ рдХреНрдпрд╛ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред рдФрд░ рдЕрдЧрд░ рдбреЗрд╡рд▓рдкрд░ рдЗрд╕реЗ рдЧрд▓рдд рд╕реНрдерд╛рди рдкрд░ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд░рддрд╛ рд╣реИ (рдЪрд▓реЛ size рдкреИрд░рд╛рдореАрдЯрд░ рдХреЗ рдмрдЬрд╛рдп styles рдХреНрд╖реЗрддреНрд░ рдореЗрдВ рдХрд╣реЗрдВ, рдХреНрдпреЛрдВрдХрд┐ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдХреБрдЫ рднреА рдирд╣реАрдВ рдмрддрд╛рддрд╛ рд╣реИ рдХрд┐ size рд╢реИрд▓реА рд╣реИ) рдпрд╣ рдкреНрд░рднрд╛рд╡рд┐рдд рдХрд░реЗрдЧрд╛ рдкреВрд░реЗ width=height=line-height=40px рдмреНрд▓реЙрдХ рдкреНрд░рджрд░реНрд╢рди, рдпрд╛ рдлрд┐рд░ рд╕реЗ width/height/line-height рд▓рд┐рдЦрдиреЗ рдХрд╛ рдиреЗрддреГрддреНрд╡ рдХрд░реЗрдВрдЧреЗ рдЬреЛ size рдкреИрд░рд╛рдореАрдЯрд░ рдХреЛ рдЕрдиреБрдкрдпреБрдХреНрдд рдмрдирд╛ рджреЗрдЧрд╛ред

рдЗрд╕рдХреЗ рдЕрд▓рд╛рд╡рд╛, рдпрд╣ рднреА рдЬрд╛рдВрдЪрдирд╛ рдХрдард┐рди рд╣реЛ рдЬрд╛рддрд╛ рд╣реИ рдХрд┐ рдХреМрди рд╕реЗ рдореВрд▓ рддрддреНрд╡реЛрдВ рдореЗрдВ рд╡рд┐рд╢рд┐рд╖реНрдЯ рдЧреБрдг рд▓рд╛рдЧреВ рд╣реИрдВ, рдХреНрдпреЛрдВрдХрд┐ рдЖрдк рдирд┐рд░реАрдХреНрд╖рдХ рдореЗрдВ рд╕рднреА рджреЗрдЦ рд╕рдХрддреЗ рд╣реИрдВ element.style ред
image

рдЬрдм рд╢реИрд▓реА рдЪрдпрдирдХрд░реНрддрд╛рдУрдВ (рд╡рд░реНрдЧ рдирд╛рдореЛрдВ) рдХреЗ рд╕рд╛рде рдЖрддреА рд╣реИ рддреЛ рдпрд╣ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рд╢реИрд▓реА рд╕рдВрд░рдЪрдирд╛ рдкрд░ рдЕрдзрд┐рдХ рдирд┐рдпрдВрддреНрд░рдг рджреЗрддреА рд╣реИред

рдЕрдкрдбреЗрдЯ: рд╕реБрдЭрд╛рд╡ рдХрд╛ рдЙрд▓реНрд▓реЗрдЦ рдХрд░рдирд╛ рди рднреВрд▓реЗрдВ (рдЬреЛ рдЗрд╕ рд╡рд┐рд╖рдп рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╣реИ):

/component
--component.js
--component.css (or sass that is converted to css when the page is rendering)

рдпрд╣ рд╕рдВрд░рдЪрдирд╛ рдШрдЯрдХ рдХреЛ рджрд╛рдпрд░реЗ рдореЗрдВ рд░рдЦреЗрдЧреА, рд▓реЗрдХрд┐рди рд╕реНрдЯрд╛рдЗрд▓ рдкрд░ рдЕрдзрд┐рдХ рдирд┐рдпрдВрддреНрд░рдг рджреЗрдЧреАред рдФрд░ рдПрдХ рдмреАрдИрдПрдо рд╡рд░реНрдЧрдирд╛рдо рд╕рдореНрдореЗрд▓рди рдЕрдирд╛рд╡рд╢реНрдпрдХ рдШреЛрдВрд╕рд▓реЗ рдХреЗ рд╢рд┐рдХрд╛рд░ рд╕реЗ рдмрдЪрдиреЗ рдореЗрдВ рдорджрдж рдХрд░реЗрдЧрд╛:

.mui-component {}
.mui-component__child {}

рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдиреЗ, рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░рдиреЗ рдФрд░ рдмрдирд╛рдП рд░рдЦрдиреЗ рдореЗрдВ рдХреМрди рд╕реА рд╕рдордЧреНрд░ рдорджрдж рдХрд░реЗрдЧрд╛ред

@chrismcv

рдИрдореЗрд▓ рдХреЛ рдЦреЛрдЬрдиреЗ рдФрд░ рдЯрд┐рдкреНрдкрдгреА рдореЗрдВ рд░рдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!

рджреЛрдиреЛрдВ рджреБрдирд┐рдпрд╛ рд╡реНрдпрд╡рд╣рд╛рд░ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЗ рд╕рд░реНрд╡рд╢реНрд░реЗрд╖реНрда?

рд╕реНрдЯрд╛рдЗрд▓ рддрдХрдиреАрдХ рдХреЗ рдЖрдпрд╛рдд рдХреА "рд╡реНрдпрд╡рд╣рд╛рд░" рдЕрд╡рдзрд╛рд░рдгрд╛ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреНрдпрд╛ рдЬреЛ рдЖрдкрдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рд╕рдмрд╕реЗ рдЙрдкрдпреБрдХреНрдд рд╣реИред "StyleTheme" рдпрд╛ "ClassTheme" рдХрд╛ рдПрдХ рдЖрдпрд╛рдд рд╡реНрдпрд╡рд╣рд╛рд░ рдХрд╛ рдЪрдпрди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрд╕реНрддреЗрдорд╛рд▓ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред StyleTheme рдЖрдЬ muiTheme рдСрдмреНрдЬреЗрдХреНрдЯ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХрд╛ рдЙрд▓реНрд▓реЗрдЦ рдХрд░ рд╕рдХрддрд╛ рд╣реИ рдФрд░ рдШрдЯрдХ рдХреЗрдВрджреНрд░рд┐рдд рд╕реНрдЯрд╛рдЗрд▓ рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЛ рдЦреБрд╢ рдХрд░ рд╕рдХрддрд╛ рд╣реИред рдпрд╛, ClassTheme рдЬреЛ SCSS рдлрд╝рд╛рдЗрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдЧрд╛ рдЬреЛ рдХрд┐ muiTheme.js рдСрдмреНрдЬреЗрдХреНрдЯ (synced) рд╕реЗ рдмрдирд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ рдЬреЛ CSS рд╕реЗрдВрдЯреНрд░рд┐рдХ рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЛ рдЦреБрд╢ рдХрд░рддрд╛ рд╣реИред рдЗрд╕рдХрд╛ рдорддрд▓рдм рдпрд╣ рд╣реЛрдЧрд╛ рдХрд┐ рд╕рднреА рдШрдЯрдХреЛрдВ рдХреЛ рд░реЗрдВрдбрд░ рддрддреНрд╡реЛрдВ рдореЗрдВ {... theme.ComponentName} рдХреЛ рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрдЧреАред

рдПрдХ рдмрд╣реБрдд рд╣реА рд╕рд░рд▓ рдЙрджрд╛рд╣рд░рдг рдкреНрд░рд╕реНрддреБрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП, рд░рд╛рдЙрдВрдбрдмрдЯрди рдШрдЯрдХ рдХреЗ рдкрд╛рд╕ рд░реЗрдВрдбрд░ рд╡рд┐рдзрд┐ рд╣реЛрдЧреА рдЬреИрд╕реЗ:

render() {
    return (<button {...theme.RoundButton} />);
}

StyleTheme рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЗ рд▓рд┐рдП, рд╡рд┐рд╖рдпред RoundButton рдореЗрдВ рд╢рд╛рдорд┐рд▓ рд╣реЛрдВрдЧреЗ:

{ 
    style: {
        display: 'inline-block';
        borderRadius: '20px';
        width: '40px';
        height: '40px';
    }
}

ClassTheme рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЗ рд▓рд┐рдП, рд╡рд┐рд╖рдпред RoundButton рдореЗрдВ рд╢рд╛рдорд┐рд▓ рд╣реЛрдВрдЧреЗ:

{ 
    className: 'mui-round-button'
}

рджреЛрдиреЛрдВ рдХреЗ рд╕рдВрдпреЛрдЬрди рдХреЛ ClassStyleTheme рд╡реНрдпрд╡рд╣рд╛рд░ рдХреЗ рд░реВрдк рдореЗрдВ рдкреБрдирдГ рдкреНрд░рд╛рдкреНрдд рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ, рд╡рд┐рд╖рдп .oundButton рдореЗрдВ рджреЛрдиреЛрдВ рд╢рд╛рдорд┐рд▓ рд╣реЛрдВрдЧреЗ:

{ 
    className: 'mui-round-button',
    style: {
        display: 'inline-block';
        borderRadius: '20px';
        width: '40px';
        height: '40px';
    }
}

Mui-theme.scss рдлрд╝рд╛рдЗрд▓ muiTheme.js рдлрд╝рд╛рдЗрд▓ рд╕реЗ рдЬрдирд░реЗрдЯ рдХреА рдЬрд╛рдПрдЧреА рдФрд░ SCSS рдореЗрдВ рдкрд░рд┐рд▓рдХреНрд╖рд┐рдд рд╣реЛрддреА рд╣реИ рдЬрд┐рд╕рдореЗрдВ JS рдлрд╝рд╛рдЗрд▓ рд╕рдореНтАНрдорд┐рд▓рд┐рдд рд╣реИред рдЬреЗрдПрд╕ рдирд╛рдореЛрдВ рдХреЗ рдКрдВрдЯ рдЖрд╡рд░рдг рдХреЛ рдЕрдзрд┐рдХ рдорд╛рдирдХ рд╡рд░реНрдЧ рдирд╛рдореЛрдВ рдореЗрдВ рдкрд░рд┐рд╡рд░реНрддрд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛:

mui-round-button {
    display: inline-block;
    border-radius: 20px;
    width: 40px;
    height: 40px;
}

MUI рдШрдЯрдХреЛрдВ рдХреЗ рд▓рд┐рдП рдХрд┐рд╕реА рднреА рд╕реАрдПрд╕рдПрд╕ рдЕрдиреБрдХреВрд▓рди рдмрд╕ mui-theme.scss рдлрд╝рд╛рдЗрд▓ рд▓реЛрдб рд╣реЛрдиреЗ рдХреЗ рдмрд╛рдж рд╕рдорд╛рди рдХрдХреНрд╖рд╛рдПрдВ рднрд░реА рд╣реЛрдВрдЧреА, рдЬрд┐рд╕рд╕реЗ рдореБрдИ-рдереАрдо рдЧреБрдгреЛрдВ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХреЗрдЧрд╛ред

@oliviertassinari

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ scss (рдирд╛рдорд╕реНрдерд╛рди / рд╣реИрд╢рд┐рдВрдЧ рдХреЗ рд▓рд┐рдП + рд╕реАрдПрд╕рдПрд╕ рдореЙрдбреНрдпреВрд▓) рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рдмрд╣реБрдд рд╕рд╛рд░реЗ рд▓рд╛рдн рд╣реИрдВред рдХреНрдпрд╛ рдпрд╣ рдХреБрдЫ рдРрд╕рд╛ рд╣реИ рдЬрд┐рд╕рдХрд╛ рдЖрдк 100% рд╡рд┐рд░реЛрдз рдХрд░ рд░рд╣реЗ рд╣реИрдВ? рдореИрдВ рд╢рд╛рдпрдж рдереЛрдбрд╝рд╛ рдкрдХреНрд╖рдкрд╛рддреА рд╣реВрдВ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рд╡рд╣реА рд╣реИ рдЬреЛ рдореИрдВ рдХрд╛рдо рдореЗрдВ рдЗрд╕реНрддреЗрдорд╛рд▓ рдХрд░рдиреЗ рдХрд╛ рдЖрджреА рд╣реВрдВ, рд▓реЗрдХрд┐рди рдмрд╣реБрдд рд╕рд╛рд░реЗ рд▓реЛрдЧ рдПрдХ рд╣реА рдирд╛рд╡ рдореЗрдВ рд╣реИрдВред

рдЬреЗрдПрд╕ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреА рд╕реНрдерд┐рддрд┐ рдХреЗ рд╕рд╛рде рдореЗрд░реА рдореБрдЦреНрдп рд╕рдорд╕реНрдпрд╛ рдпрд╣ рд╣реИ рдХрд┐ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╕рднреА рд╕рдорд╛рдзрд╛рди рдЕрднреА рднреА рдкреНрд░рдЧрддрд┐ рдкрд░ рд╣реИрдВред рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рд╕рд╛рд░реЗ рд╡рд╛рд╕реНрддрд╡рд┐рдХ рд╡рд┐рд╢реНрд╡ рдкреНрд░рджрд░реНрд╢рди рдореВрд▓реНрдпрд╛рдВрдХрди рдирд╣реАрдВ рд╣реИрдВ, рд╣рдо рдЬрд┐рди рдХрд╛рд░реНрдпреЛрдВ рдХреЛ рджреЗрдЦ рд░рд╣реЗ рд╣реИрдВ, рд╡реЗ рдЕрдкреНрд░рдорд╛рдгрд┐рдд рд╣реИрдВ рдФрд░ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдЬреИрд╕реЗ рд╣рдо рдЕрдкрдирд╛ рдмрд╣реБрдд рд╕рд╛рд░рд╛ рд╕рдордп рдЬреЗрдПрд╕ рдХреА рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдареАрдХ рд╕реЗ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдореЗрдВ рдмрд┐рддрд╛ рд░рд╣реЗ рд╣реИрдВред рдЗрд╕ рджрд╛рдпрд┐рддреНрд╡ рдХрд╛ рдореБрдЦреНрдп рд▓рдХреНрд╖реНрдп рд╕рд╛рдордЧреНрд░реА рдбрд┐рдЬрд╛рдЗрди рдХрд▓реНрдкрдирд╛ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдирд╛ рд╣реИ рдФрд░ рдореИрдВ рдорджрдж рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛, рд▓реЗрдХрд┐рди рдпрд╣ рдорд╣рд╕реВрд╕ рдХрд░рддрд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рдЗрд╕ рд╕рдордп рд╣рдорд╛рд░реА рдмрд╛рдзрд╛ рд╣реИред (рд╣рдо рдкреВрд░реНрдг рдкреНрд░рднрд╛рд╡ рдХреЗ рдореБрджреНрджреЛрдВ рдХреЛ рд╣рд▓ рдХрд░рдиреЗ рдХреА рдЬрд░реВрд░рдд рд╣реИ)

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рд╣рдорд╛рд░реА рдЕрд▓рдЧ-рдЕрд▓рдЧ рдЪрд┐рдВрддрд╛рдПрдБ рд╣реИрдВред

  1. рд╕реНрдерд┐рд░ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдХрд╣рд╛рдБ рд░рдЦрд╛ рдЬрд╛рдП (рдЖрд╕рд╛рди, рдПрдХ рд╕реАрдПрд╕рдПрд╕ рдлрд╝рд╛рдЗрд▓ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ)
  2. рдЗрдирдкреБрдЯ рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдХреБрдЫ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдХреИрд╕реЗ рд╕реНрд╡рд┐рдЪ рдХрд░реЗрдВ (рдХреНрд▓рд╛рд╕рдиреЗрдо рд╕реНрд╡рд┐рдЪ)
  3. рдЧрддрд┐рд╢реАрд▓ рд╢реИрд▓реА рдХреИрд╕реЗ рд▓рд╛рдЧреВ рдХрд░реЗрдВ (рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпрд╛рдБ рдРрд╕рд╛ рдХрд░ рд╕рдХрддреА рд╣реИрдВ)

рдЬрдм рдЖрдк рдХреЛрдИ рдПрдкреНрд▓рд┐рдХреЗрд╢рди рд▓рд┐рдЦ рд░рд╣реЗ рд╣реЛрдВ рддреЛ рд╕рдм рдЕрдЪреНрдЫрд╛ рд▓рдЧрддрд╛ рд╣реИ, рдЖрдкрдХреЗ рдХреЛрдб рдХреЗ рдмрд╛рд╣рд░ рдХрд┐рд╕реА рдХреЛ рднреА рдХреБрдЫ рднреА рдмрджрд▓рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред

рд▓реЗрдХрд┐рди рдкреБрд╕реНрддрдХрд╛рд▓рдпреЛрдВ рдХреЗ рд╕рд╛рде рдЪреАрдЬреЗрдВ рдЕрд▓рдЧ рд╣реИрдВ, рдЙрдкрд░реЛрдХреНрдд рд╕рднреА рдЪрд┐рдВрддрд╛рдПрдВ рд╣реИрдВ, рд╕рд╛рде рд╣реА рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╣реИрдВ:

  1. рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рд╕реНрдерд┐рд░ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреИрд╕реЗ рд╕рдХреНрд╖рдо рдХрд░реЗрдВ?
  2. рдереАрдо рдХреЛ рдЗрд╕ рддрд░рд╣ рд╕реЗ рдХреИрд╕реЗ рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛рдП рдХрд┐ рдЙрд╕реЗ рд╕реНрд╡рд┐рдЪ рдХрд░рдирд╛, рдХрд╕реНрдЯрдорд╛рдЗрдЬрд╝ рдХрд░рдирд╛ рдФрд░ рдЕрд▓рдЧ рдХрд░рдирд╛ (рдЕрд▓рдЧ-рдЕрд▓рдЧ рд╕рдмрдЯреНрд░реА рдЕрд▓рдЧ рдереАрдо) рдЖрд╕рд╛рди рд╣реЛ?
  3. рд╡реИрд╢реНрд╡рд┐рдХ рдирд╛рдо рд╕реНрдерд╛рди рдХреЛ рдкреНрд░рджреВрд╖рд┐рдд рдХрд░рдиреЗ рд╕реЗ рдХреИрд╕реЗ рдмрдЪреЗрдВ рддрд╛рдХрд┐ рд╣рдо рджреВрд╕рд░реЛрдВ рдХреЗ рд╕рд╛рде рдЕрдЪреНрдЫрд╛ рдЦреЗрд▓ рд╕рдХреЗрдВ?
  4. рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдЗрдирд▓рд╛рдЗрди рдЧрддрд┐рд╢реАрд▓ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдХреИрд╕реЗ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ?
  5. рдЯреНрд░рд╛рдВрд╕рдлрд╛рд░реНрдорд░! (рдЖрд░рдЯреАрдПрд▓, рдЙрдкрд╕рд░реНрдЧрдХрд░реНрддрд╛, рдЖрджрд┐)

рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдЕрднреА рдЬреЛ рдХреБрдЫ рднреА рд╣реИ, рд╡рд╣ рдЗрди рдЪрд┐рдВрддрд╛рдУрдВ рдХреЗ рд╕рд╛рде рдЙрди рд╕рднреА рдЪрд┐рдВрддрд╛рдУрдВ рдХреЛ рд╕рдВрднрд╛рд▓рддрд╛ рд╣реИ:

  1. рдкреНрд░рджрд░реНрд╢рди!
  2. рдЧрд╣рд░реА рдиреЗрд╕реНрдЯреЗрдб рдШрдЯрдХреЛрдВ рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░рдирд╛ рдХрдард┐рди рд╣реИ, рдЬреИрд╕рд╛ рдХрд┐ @nathanmark рдиреЗ рдХрд╣рд╛: somethingInsideToTheLeftButSlightlyMiddleFocusHoverActiveStyle
  3. рд╣рдо рдХреБрдЫ рд╕реАрдПрд╕рдПрд╕ рд╕реБрд╡рд┐рдзрд╛рдУрдВ рдХреА рд╢рдХреНрддрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рдпрджрд┐ рд╣рдо рдЕрдкрдирд╛ рд╕реНрдЯрд╛рдЗрд▓ рдЕрдкреНрд░реЛрдЪ рдмрджрд▓рддреЗ рд╣реИрдВ рддреЛ рд╣рдореЗрдВ рдпрд╣ рд╕рдм рдлрд┐рд░ рд╕реЗ рдХрд░рдирд╛ рд╣реЛрдЧрд╛ред рдпрджрд┐ рдпрд╣ рдЖрддрд╛ рд╣реИ рдХрд┐ рд╣рдореЗрдВ рдкреНрд░рд╡рд╛рд╕ рд╢реБрд░реВ рдХрд░рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рдЙрди рд╕рднреА рдХрд╛ рдЬрд╡рд╛рдм рджреЗрдирд╛ рд╕реБрдирд┐рд╢реНрдЪрд┐рдд рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред

рдореЗрд░реА рд╡рд┐рдирдореНрд░ рд░рд╛рдп рдореЗрдВ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╕реАрдПрд╕рдПрд╕ рдФрд░ рдХрднреА рднреА рдЗрд╕рдХрд╛ рд╕рдВрдХрд▓рди рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рднрд╡рд┐рд╖реНрдп рдХреЗ рд╣рд┐рд╕реНрд╕реЗ рдирд╣реАрдВ рд╣реИрдВред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╣рдо рд╕рднреА рд╕рд╣рдордд рд╣реИрдВ рдХрд┐ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдиреЗ рд╣рдорд╛рд░реЗ рдЬреАрд╡рди рдХреЛ рдмрд╣реБрдд рдЖрд╕рд╛рди рдмрдирд╛ рджрд┐рдпрд╛ рд╣реИред рдИрдорд╛рдирджрд╛рд░реА рд╕реЗ, рдореИрдВ рдХреЗрд╡рд▓ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рджреЗрдЦ рд░рд╣рд╛ рд╣реВрдБ :hover !

рд╣рдо рдЙрди рдореБрджреНрджреЛрдВ рдХреЛ рдереЛрдбрд╝рд╛ рдбрд┐рдЬрд╛рдЗрди рдХрд░рдиреЗ рдХреЗ рд╕рд╛рде рд╣рд▓ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

  1. рд╢реИрд▓рд┐рдпреЛрдВ рдХреА рд╡рд╕реНрддреБ рдХреЛ рдпрд╛рдж рдХрд░реЗрдВ, рдРрд╕реЗ рдШрдЯрдХ рдЬрд┐рдирдХреЗ рд▓рд┐рдП рд░рд╛рдЬреНрдп рд╣реИ, рд╣рдо рд░рд╛рдЬреНрдп рдХреЛ рддреЛрдбрд╝ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ рдЗрд╕реЗ рдПрдХ рдЫреЛрдЯреЗ рдШрдЯрдХ рдореЗрдВ рд░рдЦ рд╕рдХрддреЗ рд╣реИрдВ рддрд╛рдХрд┐ рдЗрд╕рдореЗрдВ рдореМрдЬреВрдж рд╢реИрд▓реА рд╡рд╕реНрддреБ рдХреЛ рдкрд╛рд░рд┐рдд рдкреНрд░реЙрдкреНрд╕ рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдпрд╛рдж рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХреЗ рдЬреЛ рдЙрдЪреНрдЪ рдШрдЯрдХ рдХреА рд╕реНрдерд┐рддрд┐ рд╣реИред рдпрд╣ рдЖрд╕рд╛рдиреА рд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рдпреЛрдЧреНрдп рд╣реИ!
  2. рдЙрдиреНрд╣реЗрдВ рддреЛрдбрд╝ рджреЛ! рдХреНрдпреЛрдВ рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдмрд╣реБрдд рд╕реА ListItem L somethingInsideToTheLeftButSlightlyMiddleFocusHoverActiveStyle рдЬреИрд╕реЗ рдордареЛрдВ рдХреЛ рдЬреЛрдбрд╝рдирд╛ рдирд╣реАрдВ рд╣реИ
  3. рд╣реБрдВрд╣! рд╣рдо рд╕рднреА рдХреЛ :hover рд╕рд╛рде рдкреНрд░рджрд░реНрд╢рди рдорд┐рд▓рддрд╛ рд╣реИ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╣рдо рдЙрд╕ рддрдХ рд░рд╣ рд╕рдХрддреЗ рд╣реИрдВ рдЬрдм рддрдХ рдХрд┐ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдпрд╛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдЗрд╕рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреБрдЫ рдирд╣реАрдВ рдХрд░рддреА рд╣реИред

рдореЗрд░рд╛ рдХрд╣рдирд╛ рд╣реИ, рд╣рдо рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдЕрдкрдиреЗ рдореМрдЬреВрджрд╛ рд╕реНрдЯрд╛рдЗрд▓ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЗ рд╕рд╛рде рдмрдбрд╝реА рд╕рдВрдЦреНрдпрд╛ рдореЗрдВ рдЪрд┐рдВрддрд╛рдУрдВ рдХреЛ рд╕рдВрдмреЛрдзрд┐рдд рдХрд░рддреЗ рд╣реИрдВред рдЗрд╕рдХреА рд╕реАрдорд╛рдПрдБ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рд╣рдо рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рдЖрд╕рдкрд╛рд╕ рдХреЗ рд╕рднреА рдкреИрдЯрд░реНрди рдХрд╛ рдкрд╛рд▓рди рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВред рдЕрдЧрд░ рд╣рдо рдЕрдкрдиреЗ рдШрдЯрдХреЛрдВ рдХреЛ рддреЛрдбрд╝рдирд╛ рд╢реБрд░реВ рдХрд░рддреЗ рд╣реИрдВ рдФрд░ рдЙрдиреНрд╣реЗрдВ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдмрдирд╛ рджреЗрддреЗ рд╣реИрдВ рддреЛ рд╣рдореЗрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдХрд┐рд╕реА рднреА рдЪреАрдЬ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЪрд┐рдВрддрд╛ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред MeuItem рдореИрдВрдиреЗ рдЗрд╕реЗ рдмрд╛рд╣рд░ рдирд┐рдХрд╛рд▓ рджрд┐рдпрд╛ рдФрд░ рдЗрд╕реЗ рдмрдирд╛рдиреЗ рдпреЛрдЧреНрдп рдмрдирд╛ рджрд┐рдпрд╛, рдЖрдк рджреЗрдЦрддреЗ рд╣реИрдВ рдХрд┐ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдХрд┐рддрдирд╛ рдЖрд╕рд╛рди рд╣реИ рдФрд░ рд╢реБрджреНрдз рдкреНрд░рддрд┐рдкрд╛рджрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдЗрд╕рдХреЗ рдкреНрд░рджрд░реНрд╢рди рдХреЛ рдХреИрд╕реЗ рдмреЗрд╣рддрд░ рдмрдирд╛рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ!

рдЗрд╕рд▓рд┐рдП рд╣рдорд╛рд░реЗ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рдмрджрд▓рдиреЗ рдФрд░ рдЗрди рд╕рднреА рдореБрджреНрджреЛрдВ рдХреЛ рдлрд┐рд░ рд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рдмрдЬрд╛рдп, рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдкрд╣рд▓реЗ рд╕реЗ рдореМрдЬреВрдж рд╕реБрдзрд╛рд░ рдХреЗ рд╕рдордп рдХрд╛ рдирд┐рд╡реЗрд╢ рдХрд░реЗрдВред рд╣рдореЗрдВ рдореАрдбрд┐рдпрд╛ рдХреЗ рдкреНрд░рд╢реНрдиреЛрдВ рдХрд╛ рд╕рдорд░реНрдерди рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ, рд╣рдо рдЕрдкрдиреЗ рдШрдЯрдХреЛрдВ рдХреЛ рдЗрд╕ рддрд░рд╣ рд╕реЗ рдмрджрд▓ рд╕рдХрддреЗ рд╣реИрдВ рдХрд┐ рджреВрд╕рд░реЛрдВ рдХреЗ рд▓рд┐рдП рдЙрди рдкрд░ рдЬрд╡рд╛рдмрджреЗрд╣реА рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдирд╛ рдЖрд╕рд╛рди рд╣реЛред рдбрд┐рдмрдЧ рдХрд░рдирд╛ рдореБрд╢реНрдХрд┐рд▓ рд╣реИ? рдпрджрд┐ рд╣рдо рдЕрдкрдиреЗ рдШрдЯрдХреЛрдВ рдХреЛ рддреЛрдбрд╝рддреЗ рд╣реИрдВ рддреЛ рдЗрдирдмрд┐рд▓реНрдб рд╕реНрдЯрд╛рдЗрд▓реНрд╕ рдЫреЛрдЯреЗ рдФрд░ рдкрдврд╝рдиреЗ рдореЗрдВ рдЖрд╕рд╛рди рд╣реЛрдВрдЧреЗред рд╣рд╛рд▓рд╛рдВрдХрд┐ рдмрд╣рд╕! рдореЗрд░рд╛ рдорддрд▓рдм рд╣реИ рдХрд┐ рдЖрдкрдХреЛ рдпрд╣ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдмреНрд░реЗрдХ рдкреЙрдЗрдВрдЯ рд╣реИ рдХрд┐ Object.assign рдореЗрдВ рднрд╛рдЧ рд▓реЗрдиреЗ рдХреЗ рд▓рд┐рдП рдпрд╣ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐ рд╢реИрд▓реА рдХрд╣рд╛рдБ рд╕реЗ рдЖ рд░рд╣реА рд╣реИред

рдпрд╣ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдореЗрд░реА рдЕрдкрдиреА рд░рд╛рдп рд╣реИ рдореИрдВ рдЪрд░реНрдЪрд╛ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдЦреБрд▓рд╛ рд╣реВрдВред

@alitaheri

рдЖрдк рдХреБрдЫ рдмреЗрд╣рддрд░реАрди рдмрд┐рдВрджреБ рдЙрдард╛рддреЗ рд╣реИрдВред рдзрдиреНрдпрд╡рд╛рджред рдореИрдВ рд╕реЛрдЪ рд░рд╣рд╛ рдерд╛ рдХрд┐ рдХрд┐рд╕реА рдкреНрд░рдХрд╛рд░ рдХрд╛ рд╣рд╛рдЗрдмреНрд░рд┐рдб рд╕рдорд╛рдзрд╛рди рдПрдХ рд╕рдВрднрд╛рд╡рдирд╛ рд╣реИред рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдХреЛрдИ рдлрд░реНрдХ рдирд╣реАрдВ рдкрдбрд╝рддрд╛ рдХрд┐ рд╣рдо рдХрд┐рд╕ рдХреЛрдг рдкрд░ рд▓реЗ рдЬрд╛рддреЗ рд╣реИрдВ рдореБрджреНрджреЛрдВ рдХрд╛ рдПрдХ рдЧреБрдЪреНрдЫрд╛ рд╣реИ what

рдореЗрд░реЗ рдкрд╛рд╕ рдЕрдЧрд▓реЗ рд╕рдкреНрддрд╛рд╣ рдЗрд╕ рдкрд░ рдХрд╛рдо рдХрд░рдиреЗ рдХрд╛ рд╕рдордп рд╣реИ - рдЪрд▓реЛ рдПрдХ рдЪреИрдЯ рдХрд░реЗрдВ рдФрд░ рджреЗрдЦреЗрдВ рдХрд┐ рдХреНрдпрд╛ рд╣рдо рдПрдХ рдЪрддреБрд░ рд╡рд┐рдЪрд╛рд░ рдХреЗ рд╕рд╛рде рдЖ рд╕рдХрддреЗ рд╣реИрдВред

рдореИрдВ рдкрд░рд┐рд╡рд░реНрддрди рдХреА рдорд╛рддреНрд░рд╛ рдХреЛ рдХрдо рдХрд░рдиреЗ рдФрд░ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рд╣рд▓ рдХрд┐рдП рдЧрдП рдореБрджреНрджреЛрдВ рдХреЛ рдлрд┐рд░ рд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рд╕реЗ рд╕рд╣рдордд рд╣реВрдВред рдореЗрд░реЗ рдорди рдореЗрдВ рдпрд╣рд╛рдБ 2 рдорд╣рддреНрд╡рдкреВрд░реНрдг рд▓рдХреНрд╖реНрдп рд╣реИрдВ:

  1. рдкреНрд░рджрд░реНрд╢рди
  2. рдбреЗрд╡рд▓рдкрд░ рдХрд╛ рдЕрдиреБрднрд╡ (рдЬреЗрдПрд╕ рд╢реИрд▓реА рдХреА рд▓рд┐рдмрд╛рд╕ рдпрд╣рд╛рдБ рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЛ рдЕрдкрдиреЗ рдЕрдиреБрдкреНрд░рдпреЛрдЧреЛрдВ рдореЗрдВ рдЖрд╕рд╛рдиреА рд╕реЗ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рдХреНрд╖рдо рдХрд░рдХреЗ рдмрд╣реБрдд рдорджрдж рдХрд░рддреА рд╣реИ)

рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рдФрд░ рдЕрдзрд┐рдХ рд╕реЛрдЪрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ more рд▓реЗрдХрд┐рди рдЬрдм рддрдХ рд╣рдо рдЙрди 2 рдмрд┐рдВрджреБрдУрдВ рдХреЛ рд╣рд▓ рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдмрдВрдзрди рдХрд░рддреЗ рд╣реИрдВ рдореИрдВ рдЕрдкрдиреЗ рд╕рдорд╛рдзрд╛рди рд╕реЗ рдЦреБрд╢ рд░рд╣реВрдВрдЧрд╛ред

рдПрдХ рдФрд░ рдпрд╛рджреГрдЪреНрдЫрд┐рдХ рдиреЛрдЯ - рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдЕрдЧрд░ рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдЗрдирд▓рд╛рдЗрди / jsstyle рдХреЗ рд▓рд┐рдП рдХреБрдЫ рдХреЛрдб рдХрдиреНрд╡реЗрдВрд╢рди рдФрд░ рдбрд┐рдЬрд╛рдЗрди рдкреИрдЯрд░реНрди рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рддрд░реАрдХрд╛ рд╣реИ / рдЬреЛ рднреА рд▓рд┐рдмрд╛рд╕ рдореЗрдВ рд╣реЛрдВред

рдХреНрдпрд╛ рдпрд╣ рдХреБрдЫ рдРрд╕рд╛ рд╣реИ рдЬрд┐рд╕рдХрд╛ рдЖрдк 100% рд╡рд┐рд░реЛрдз рдХрд░ рд░рд╣реЗ рд╣реИрдВ?

@ рдиреНрд╣рд╛рдВрд╕рдорд╛рд░реНрдХ рдореИрдВ рдореГрдд-рдЕрдВрдд рд╣реИ ред
рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХреЗ рдореБрдЦреНрдп рд▓рд╛рднреЛрдВ рдореЗрдВ рд╕реЗ рдПрдХ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреА рдкреНрд░рддрд┐рдкрд╛рджрди рд╡рд┐рд╢рд┐рд╖реНрдЯрддрд╛ рдХреЛ рджреВрд░ рдХрд░рдирд╛ рд╣реИ: DOMред
рдЬрд╣рд╛рдВ рддрдХ тАЛтАЛрдореБрдЭреЗ рдкрддрд╛ рд╣реИ, рд░рд┐рдПрдХреНрдЯ рдХреЛрд░ рдЯреАрдо рдХрд╛ рджреАрд░реНрдШрдХрд╛рд▓рд┐рдХ рд▓рдХреНрд╖реНрдп рдХреНрд░реЙрд╕-рдкреНрд▓реЗрдЯрдлреЙрд░реНрдо рдШрдЯрдХ рд▓рд┐рдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рдПрдкреАрдЖрдИ рдкреНрд░рджрд╛рди рдХрд░рдирд╛ рд╣реИред рджрд░рдЕрд╕рд▓, рд╡реЗ рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдЗрд╕ рджрд┐рд╢рд╛ рдореЗрдВ

рдореИрдВ @alitaheri рд╕реЗ рдкреВрд░реА рддрд░рд╣ рд╕рд╣рдордд рд╣реВрдВред рд╣рдо рдЙрди рджреЛ рдЪрд░рдгреЛрдВ рд╕реЗ рд╢реБрд░реВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:

  • рд╣рд░ рдЬрдЧрд╣ getStyles рдкреИрдЯрд░реНрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ рддрд╛рдХрд┐ рд╣рдо рдмрд╛рдж рдореЗрдВ рдЖрд╕рд╛рдиреА рд╕реЗ рдкреНрд░рд╡рд╛рд╕ рдХрд░ рд╕рдХреЗрдВред
    рдХреНрдпрд╛ рд╣рдо рдПрдХ рдХреЛрдбреЗрдо рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рдкрд╛рдПрдВрдЧреЗ? рдХреМрди рдЬрд╛рдиреЗред
  • @Alitaheri рджреНрд╡рд╛рд░рд╛ рдкреНрд░рд╕реНрддрд╛рд╡рд┐рдд рдкреНрд░рддреНрдпреЗрдХ рдШрдЯрдХ рдХреЛ рддреЛрдбрд╝рдирд╛ред

@oliviertassinari рдореИрдВ рдореГрдд-рдЕрдВрдд рдирд┐рд╖реНрдХрд░реНрд╖ рд╕реЗ рд╕рд╣рдордд рд╣реВрдВ - рдпрд╣ рднрд╡рд┐рд╖реНрдп рдирд╣реАрдВ рд╣реИред рдореИрдВрдиреЗ рдЗрд╕реЗ рдмрдбрд╝реЗ рдкреИрдорд╛рдиреЗ рдкрд░ рдмрд╛рддрдЪреАрдд рдХреЛ рдкреНрд░реЛрддреНрд╕рд╛рд╣рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд▓рд╛рдпрд╛ рдХрд┐ рдЬреЗрдПрд╕ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд╣рдорд╛рд░реЗ рд▓рд┐рдП рдХреИрд╕реЗ рдХрд╛рдо рдХрд┐рдпрд╛ рдЬрд╛рдПред рдореБрдЭреЗ рдкрддрд╛ рдерд╛ рдХрд┐ рдпрд╣рд╛рдБ рдХреЗ рдЖрд╕рдкрд╛рд╕ рдХреЗ рдХреБрдЫ рд▓реЛрдЧреЛрдВ рдХреЗ рдкрд╛рд╕ рдХреБрдЫ рдЕрдЪреНрдЫреЗ рд╡рд┐рдЪрд╛рд░ рдереЗ, рдореБрджреНрджреЛрдВ рдХреЗ рдЗрд░реНрджрдЧрд┐рд░реНрдж B FB рдПрдХ _tiny bit_ рдЖрдЧреЗ рдереЗ рдЙрдирдХреЗ рдкреНрд░рдпреЛрдЧреЛрдВ рдХреЗ рд╕рд╛рде!

рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ getStyles() рдкреИрдЯрд░реНрди рдЬреЛ рд╣рдо рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдХрд╛рдо рдХрд░рддреЗ рд╣реИрдВ, рдЙрд╕рдХреА рдЕрдкрдиреА рд╕рдорд╕реНрдпрд╛рдПрдВ рд╣реИрдВред @alitaheri рдФрд░ рдореЗрд░реЗ рдкрд╛рд╕ рдЖрдЬ рдмрд╣реБрдд рдЕрдЪреНрдЫреА рдЪреИрдЯ рдереА рдХрд┐ рд╣рдорд╛рд░реЗ рдЬреЗрдПрд╕ рд╕реНрдЯрд╛рдЗрд▓ рд╕реЗрдЯрдЕрдк (рдереАрдореНрдб рд╕рд╣рд┐рдд) рдХреЛ рдмреЗрд╣рддрд░ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдХреНрдпрд╛ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред рдореИрдВ рдХрд▓ рдХреБрдЫ рдФрд░ рдЬрд╛рдирдХрд╛рд░реА рдХреЗ рд╕рд╛рде рд╡рд╛рдкрд╕ рдЬрд╡рд╛рдм рджреВрдВрдЧрд╛, рдЬрдм рдореБрдЭреЗ рдХреБрдЫ рдиреЛрдЯ рдиреАрдЪреЗ рдХрд░рдиреЗ рдХрд╛ рдореМрдХрд╛ рдорд┐рд▓реЗрдЧрд╛!

рдЕрдЧрд▓реЗ рд╣рдлреНрддреЗ рдореИрдВ рдЫреБрдЯреНрдЯреА рдкрд░ рд╣реВрдБ рдФрд░ рдореИрдВ рдЕрдкрдиреА рд╡рд░реНрддрдорд╛рди рд╕рдорд╕реНрдпрд╛рдУрдВ рдХреЗ рд╕рдорд╛рдзрд╛рди рдХреЗ рд╕рд╛рде рдкреНрд░рдпреЛрдЧ рдХрд░рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реВрдБ, рдЬрдмрдХрд┐ рд╕рднреА рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЬреЗрдПрд╕ рдЖрдзрд╛рд░рд┐рдд рд░рдЦреЗрдВред

рдмрд╕ рдЗрд╕ рдкреЛрд╕реНрдЯ рдХреЛ рдкрдврд╝рд┐рдП рд╕рдмрдХ рдПрдореНрд╕реНрдЯрд░реНрдбрдо (https://medium.com/@kitze/lessons-learned-at-react-am Amsterdam-51f2006c4a59#.o12h794or) рдкрд░ рд╕реАрдЦрд╛ рдФрд░ рдкреНрд░рд╕реНрддреБрддрд┐рдпреЛрдВ рдореЗрдВ рд╕реЗ рдПрдХ рд░рд┐рдПрдХреНрдЯ рдореЗрдВ рд╕реНрдЯрд╛рдЗрд▓ рдХреЗ рд╕рдорд╛рдзрд╛рди рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдерд╛: http :

рдПрдХ рдЖрд╡рд╢реНрдпрдХрддрд╛ рдЬрд┐рд╕рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдореИрдВ рд╕реЛрдЪрддрд╛ рд░рд╣рддрд╛ рд╣реВрдВ рдФрд░ рд╡рд╣ рд╣реИ рдЬрд┐рд╕реЗ рдореИрдВрдиреЗ рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдирд╣реАрдВ рдХрд╣рд╛ рд╣реИ (рдХрдо рд╕реЗ рдХрдо рдЬреЛ рдореБрдЭреЗ рдпрд╛рдж рд╣реИ) рд╡реЗрдм-рдмрдирд╛рдо рд╡реЗрдм рдХрд╛ рд╕рдорд░реНрдерди рдХрд░рдиреЗ рдФрд░ рджреЗрд╢реА рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред рдпрджрд┐ рдЗрд░рд╛рджрд╛ рд╡реЗрдм-рдУрдирд▓реА рд╣реИ (рдпрд╛рдиреА рдореВрд▓ рдирд┐рд╡рд╛рд╕реА рдХреА рдХреЛрдИ рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ) рддреЛ рдРрд╕реЗ рд╕рдорд╛рдзрд╛рди рдЬреЛ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдХреБрд╢рд▓ рдФрд░ рдордЬрдмреВрдд рд╕рдорд░реНрдерди рд╡рд╛рд▓реЗ рдмреНрд░рд╛рдЙрдЬрд╝рд░реЛрдВ рдХрд╛ рд▓рд╛рдн рдЙрдард╛рддреЗ рд╣реИрдВ рдФрд░ рд▓реЛрдЧ рдмрд╣реБрдд рдкрд░рд┐рдЪрд┐рдд рд╣реИрдВ рд╡реЗ рдПрдХ рдЕрдЪреНрдЫреА рдмрд╛рдд рд╣реЛрдЧреАред рдпрджрд┐ рд╕рдорд░реНрдерди рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдореВрд▓ рдирд┐рд╡рд╛рд╕реА рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП рддреЛ рд╡рд╣ рдЖрд╡рд╢реНрдпрдХрддрд╛рдУрдВ рдФрд░ рдЖрд╡рд╢реНрдпрдХрддрд╛рдУрдВ рдХреЗ рдПрдХ рдЕрд▓рдЧ рд╕реЗрдЯ рдХреЛ рдЦреЛрд▓рддрд╛ рд╣реИред рдмрд╕ рдХреБрдЫ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╕реЛрдЪрдиреЗ рдХреЗ рд▓рд┐рдП рдФрд░ рдкреНрд░реМрджреНрдпреЛрдЧрд┐рдХреА рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЗ рд░реВрдк рдореЗрдВ рдзреНрдпрд╛рди рдореЗрдВ рд░рдЦрдирд╛, рд╕рдордЭреМрддрд╛, рдЖрджрд┐ рдХрд╛ рдореВрд▓реНрдпрд╛рдВрдХрди рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред

@hburrows

рдЙрд╕ рдкреНрд░рд╕реНрддреБрддрд┐ рдХреЛ рд╕рд╛рдЭрд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!

@alitaheri

рд╣рдо рдЙрд╕ рдкреНрд░реЗрдЬреЗрдВрдЯреЗрд╢рди ( рдпрд╣рд╛рдВ рдПрдХ рдбреЗрдореЛ ) рдореЗрдВ рдмрддрд╛рдП рдЧрдП рд▓рд┐рдмрд╛рд╕ рдХреЛ рджреЗрдЦрдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВред рдпрд╣ рд╣рдореЗрдВ рдмрд╣реБрдд рдХрд╛рдо рдмрдЪрд╛ рд╕рдХрддрд╛ рд╣реИред рдореИрдВ рдЗрд╕реЗ рдкрд╣рд▓реЗ рджреЗрдЦ рд░рд╣рд╛ рдерд╛ рд▓реЗрдХрд┐рди рдХреБрдЫ рдЪреАрдЬреЗрдВ рдереАрдВ рдЬреЛ рдореБрдЭреЗ рдкрд╕рдВрдж рдирд╣реАрдВ рдереАрдВ (рдЬреИрд╕реЗ рдХрд┐ рдорд╛рд▓рд┐рдХрд╛рдирд╛ рд╣рдХ рдореЗрдВ рд╣рд░ рдПрдХ рдШрдЯрдХ рдХреЛ рд▓рдкреЗрдЯрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛)ред рд╣рд╛рд▓рд╛рдБрдХрд┐, рдХреБрдЫ рдХреА рдЪрд░реНрдЪрд╛ рдпрд╣рд╛рдБ рд╣реЛ рд░рд╣реА рд╣реИ ред рдЙрдиреНрд╣реЛрдВрдиреЗ рдЙрд▓реНрд▓реЗрдЦ рдХрд┐рдпрд╛ рд╣реИ рдХрд┐ рдЗрд╕ рддрд░рд╣ рдХреЗ рдмрджрд▓рд╛рд╡реЛрдВ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдирд╛ рд╣реЛрдХ-рдореБрдХреНрдд рдЙрдкрдпреЛрдЧ рдХреЗ рд▓рд┐рдП рдЕрдиреБрдорддрд┐ рджреЗрдЧрд╛ред рдореИрдВ рд╢реАрдЯ рд▓рд┐рдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдЙрд╕ рдкрджреНрдзрддрд┐ / рдбрд┐рдЬрд╝рд╛рдЗрди рдХреЛ рдкрд╕рдВрдж рдХрд░рддрд╛ рд╣реВрдВ ( aphrodite рдореЗрдВ рднреА рджреЗрдЦрд╛ рдЬрд╛рддрд╛ рд╣реИ)ред

рд╡реИрдХрд▓реНрдкрд┐рдХ рд░реВрдк рд╕реЗ, рд╣рдо рд╣рдореЗрд╢рд╛ jss рд▓рд┐рдП рдЕрдкрдиреА рд╕реНрд╡рдпрдВ рдХреА рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдмрд╛рдЗрдВрдбрд┐рдВрдЧ рдмрдирд╛ рд╕рдХрддреЗ рд╣реИрдВ рдЬреЛ mixout рд╕рд╛рде рдХрд╛рдо рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рдкрд░рд┐рд╡рд╛рдж рд▓реЗрдЦрдХ рдиреЗ рдпрд╣ рднреА рдХрд╣рд╛, рдЬреЛ рдХрд┐ рдорд╛рдорд▓реЗ рдкрд░ рдореЗрд░реЗ рдЕрдкрдиреЗ рд╡рд┐рдЪрд╛рд░реЛрдВ рдХреЗ рдЕрдиреБрд░реВрдк рд╣реИ:

рд╣рд╛рд▓рд╛рдБрдХрд┐ рдЖрдкрдХреЛ рдпрд╣ рд╕рдордЭрдиреЗ рдХреА рдЬрд╝рд░реВрд░рдд рд╣реИ рдХрд┐ рд╕рдм рдХреБрдЫ рд╕реНрдЯрд╛рдЗрд▓ рд╢реАрдЯ рд╣реЛрдиреЗ рдХрд╛ рдорддрд▓рдм рдирд╣реАрдВ рд╣реИред рд╕рдмрд╕реЗ рдЧрддрд┐рд╢реАрд▓ рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЛ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред

@nathanmark рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдмрд╣реБрдд рдЫреЛрдЯрд╛ рд╣реИ рдФрд░ рдорд┐рд╢реНрд░рдг рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдЖрд╕рд╛рди рд╣реИ: рдореБрд╕реНрдХрд░рд╛рд╣рдЯ:
https://github.com/jsstyles/react-jss/blob/master/src/index.js
рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рд▓рд╛рдЗрдмреНрд░реЗрд░реА рд╣рдорд╛рд░реА рдорджрдж рдХрд░ рд╕рдХрддреА рд╣реИ: +1:

@alitaheri рд╣рд╛рдБ рдореИрдВ рд╕рд╣рдордд рд╣реВрдБ!

рдореИрдВ jss рд▓рд┐рдП рдХреБрдЫ рдХрд╕реНрдЯрдо рдмрд╛рдЗрдВрдбрд┐рдВрдЧ рдХреЗ рд╕рд╛рде рдкреНрд░рдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ - рдХреБрдЫ рдРрд╕реЗ рдореБрджреНрджреЗ / рд╕реАрдорд╛рдПрдВ рд╣реИрдВ рдЬрд┐рдирд╕реЗ рдореИрдВ рдирд┐рдкрдЯрдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВред (рд╣рд╛рд▓рд╛рдВрдХрд┐ рдХреЛрд░ рд▓реАрдм рдкрд░ рдХрд╛рдо рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛ рд╕рдХрддреА рд╣реИ)

рд░рд┐рдПрдХреНрдЯ рд╕рдореБрджрд╛рдп рдореЗрдВ рдПрдХ рдкреНрд░рдЪрд▓рд┐рдд рднрд╛рд╡рдирд╛ рдкреНрд░рддреАрдд рд╣реЛрддреА рд╣реИ рдХрд┐ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╕реНрдЯрд╛рдЗрд▓ рд╕рдмрд╕реЗ рдЕрдЪреНрдЫрд╛ рд╕рдорд╛рдзрд╛рди рд╣реИред рдпрд╣ рднрд╛рд╡рдирд╛ рдареАрдХ рд╣реИ, рдореИрдВ рдЙрди рд▓реЛрдЧреЛрдВ рд╕реЗ рдЕрд╕рд╣рдордд рдирд╣реАрдВ рд╣реВрдВ рдЬрд┐рдирдХреЗ рдкрд╛рд╕ рд╣реИред рд╣рд╛рд▓рд╛рдВрдХрд┐, рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреЛ рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ рд╡рд╣ рд▓рдЧрднрдЧ рд╣рдореЗрд╢рд╛ рд╕реАрдПрд╕рдПрд╕ рдбреЗрд╡рд▓рдкрд░ рдХреА рдкрд░рд╡рд╛рд╣ рдХрд┐рдП рдмрд┐рдирд╛ рд╣реИред рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рд╕рднреА рдЕрдХреНрд╕рд░ style=/[element property]= className= рдкрдХреНрд╖ рдореЗрдВ рд╣реЛрддрд╛ рд╣реИ рдФрд░ CSS рдбреЗрд╡рд▓рдкрд░ рдХреЛ рдЕрдкрдирд╛ рдХрд╛рдо рдХрд░рдиреЗ рд╕реЗ рд░реЛрдХрддрд╛ рд╣реИред

рдЬреИрд╕рд╛ рдХрд┐ рдореИрдВрдиреЗ рдкрд┐рдЫрд▓реА рдЯрд┐рдкреНрдкрдгреА рдореЗрдВ рдкреЗрд╢ рдХрд┐рдпрд╛ рдерд╛, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рджреЛрдиреЛрдВ рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдПрдХ рд╕рд╛рде рд░рд╣ рд╕рдХрддреЗ рд╣реИрдВред рдмрд╕ рд╢реИрд▓реА рдЧреБрдгреЛрдВ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рд╡реНрдпрд╡рд╣рд╛рд░рд┐рдХ рджреГрд╖реНрдЯрд┐рдХреЛрдг рд░рдЦрдирд╛ рдЪрд╛рд╣рд┐рдПред рдкреБрд╕реНрддрдХрд╛рд▓рдп рдХреЛ рд╢реИрд▓реА рдХреЗ рдЧреБрдгреЛрдВ рдХреЗ рдкреНрд░рддреНрдпрдХреНрд╖ рдЕрдиреБрдкреНрд░рдпреЛрдЧ рдХреЛ рдПрдХ рддрддреНрд╡ рдореЗрдВ рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП, рдпрд╛ рдЙрд╕реЗ рдЙрди рд╢реИрд▓реА рдЧреБрдгреЛрдВ рд╕реЗ рдпреБрдХреНрдд рдХреНрд▓рд╛рд╕рдиреЗрдо рдмрдирд╛рдиреЗ рдХреЗ рдЕрдкреНрд░рддреНрдпрдХреНрд╖ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреА рдЕрдиреБрдорддрд┐ рджреЗрдиреА рдЪрд╛рд╣рд┐рдПред рдПрдХ рдкреБрд╕реНрддрдХрд╛рд▓рдп рдЬреЛ рдбреЗрд╡рд▓рдкрд░ рдХреЛ рд╡реНрдпрд╡рд╣рд╛рд░ рдХрд╛ рдЪрдпрди рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИ рд╡рд╣ рдПрдХ рдЖрджрд░реНрд╢ рд╕рдорд╛рдзрд╛рди рдХреА рддрд░рд╣ рд▓рдЧрддрд╛ рд╣реИред

CSS deveoper рдХреЗ рдХрдИ рдХрд╛рд░рдг рд╣реИрдВ рдЬреЛ рдмрд╕ рдЙрдирдХреЗ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рдирд╣реАрдВ рдЦреЛрдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВред "рд╕реАрдПрд╕рдПрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рдХрд░реЗрдВ" рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЬрд╛рдирдиреЗ рдХреЗ рд▓рд┐рдП рдпрд╣ рджреЗрдЦреЗрдВ рдХрд┐ рд▓реЛрдЧ рдЗрд╕реЗ рд▓рд╛рднрдкреНрд░рдж рдХреНрдпреЛрдВ рдорд╛рдирддреЗ рд╣реИрдВред рдЖрдк рд╢реИрд▓рд┐рдпреЛрдВ рдФрд░ рдЕрдкрдиреЗ рдЪрдпрди рдХреЗ рдмреАрдЪ рдПрдХ рд╢рдХреНрддрд┐рд╢рд╛рд▓реА рдЪрдпрдирдХрд░реНрддрд╛ рднрд╛рд╖рд╛ рдХреЗ рдЕрдореВрд░реНрдд рдкрд╛рдПрдВрдЧреЗред рдЖрдЗрдП рдЖрдЬ рдЙрд╕ рд╡рд┐рд╢рд╛рд▓ рдорд╛рддреНрд░рд╛ рдореЗрдВ рдХреЛрдб рдХреЛ рди рднреВрд▓реЗрдВ рдЬреЛ рд╕реАрдПрд╕рдПрд╕ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рд▓рд╛рдн рдкрд╣реБрдВрдЪрд╛рддрд╛ рд╣реИред

рдлрд┐рд░, рдпрд╣ рдХрд┐рд╕реА рднреА рддрд░рд╣ рд╕реЗ рдПрдХ рд╕рдорд░реНрдердХ рд╕реАрдПрд╕рдПрд╕ рдЯрд┐рдкреНрдкрдгреА рд╣реЛрдиреЗ рдХрд╛ рдЗрд░рд╛рджрд╛ рдирд╣реАрдВ рд╣реИред рд╣рдо рдореЗрдВ рд╕реЗ рд╡реЗ рд╣реИрдВ рдЬреЛ рд╕реНрдЯрд╛рдЗрд▓ рдХреЗ рд▓рд┐рдП рд╕реАрдПрд╕рдПрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВред рдпрд╣ рдЯрд┐рдкреНрдкрдгреА рдПрдХ рд╡рд╛рд╕реНрддреБрд╢рд┐рд▓реНрдк рд░реВрдк рд╕реЗ рддрдЯрд╕реНрде рд╕реНрдЯрд╛рдЗрд▓ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рдкреНрд░реЛрддреНрд╕рд╛рд╣рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╣реИ рдЬреЛ рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЛ рдкрд╕рдВрдж рдХрд░рдиреЗ рдХрд╛ рдЕрдзрд┐рдХрд╛рд░ рджреЗрддрд╛ рд╣реИред

@rvbyron рд╣рдорд╛рд░реЗ рд╡рд░реНрддрдорд╛рди рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рдмрджрд▓рдиреЗ рдХреЗ рд▓рд┐рдП рдореБрдЦреНрдп рдХрд╛рд░рдгреЛрдВ рдореЗрдВ рд╕реЗ рдПрдХ рдпрд╣ рд╣реИ рдХрд┐ рд╕реАрдПрд╕рдПрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдШрдЯрдХреЛрдВ рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░рдирд╛ рднреА рдЖрд╕рд╛рди рд╣реИред jss рдЬреИрд╕реА рд▓рд╛рдЗрдмреНрд░реЗрд░реА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рд╣рдореЗрдВ js- рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рд▓рд╛рдн рд▓реЗрддреЗ рд╣реБрдП рд╕реАрдПрд╕рдПрд╕ рд╕реБрд╡рд┐рдзрд╛рдУрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рдорд┐рд▓реЗрдЧреАред рдФрд░ рдЪреВрдВрдХрд┐ рдпрд╣ рдЙрди рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд╕реАрдПрд╕рдПрд╕ рдореЗрдВ рдмрджрд▓ рджреЗрддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рд╡реЗ рдЖрд╕рд╛рдиреА рд╕реЗ рдПрдХ рдЕрддрд┐рд░рд┐рдХреНрдд рдХреНрд▓рд╛рд╕рдирд╛рдо рдХреЗ рд╕рд╛рде рдмрджрд╕реВрд░рдд рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ рдмрд┐рдирд╛ !important рд╣реИрдХред

@alitaheri рд╕реБрдирдХрд░ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд▓рдЧрд╛! рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХреЛ рдПрдХ рдХреНрд▓рд╛рд╕рдиреЗрдо рдЖрдзрд╛рд░рд┐рдд рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдЙрддреНрд╕реБрдХ рд╣реВрдВред

рдлрд┐рд░, className рджреГрд╖реНрдЯрд┐рдХреЛрдг рдкрд░ рд╕реБрдирдиреЗ рдХреЗ рд▓рд┐рдП рд╢рд╛рдирджрд╛рд░ред рдЗрд╕реЗ рдзреНрдпрд╛рди рдореЗрдВ рд░рдЦрддреЗ рд╣реБрдП, рдореЗрд░реЗ рдХреБрдЫ рд╕рд╡рд╛рд▓ рд╣реИрдВ рдХрд┐ рдЗрд╕реЗ рдХреИрд╕реЗ рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ:

  • рдЖрдкрдХреЛ рдХреНрдпрд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╡рд░реНрдЧ рдирд╛рдордХрд░рдг рд╕рдореНрдореЗрд▓рди рдирд╛рдо рдХреА рддрд░рд╣ рд▓рдЧ рд╕рдХрддрд╛ рд╣реИ?
  • рдХреНрдпрд╛ рд╕рднреА рд╡рд░реНрдЧ рдирд╛рдореЛрдВ рдореЗрдВ рдЙрди рдкрд░ "рдореБрдИ" рдпрд╛ рдЕрдиреНрдп рдЙрдкрд╕рд░реНрдЧ рд╣реЛрдЧрд╛?
  • рдХреНрдпрд╛ рдШрдЯрдХ рдирд╛рдо рдХрд╛ рдбреИрд╢ рдиреЛрдЯреЗрд╢рди рд╣реЛрдЧрд╛?
  • рдХреНрдпрд╛ рдкреНрд░рддреНрдпреЗрдХ рдШрдЯрдХ рдХреЗ рдореВрд▓ рддрддреНрд╡ рдкрд░ рдПрдХ рд╡рд░реНрдЧ рдирд╛рдо рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛?

@rvbyron

рдЖрджрд░реНрд╢ рд░реВрдк рдореЗрдВ:

рдЕрдиреБрдХреВрд▓рди рдЙрдкрд╕рд░реНрдЧред рдмреЗрд╣рддрд░ рджреЗрд╡ рдЕрдиреБрднрд╡ рдФрд░ рд╣реИрд╢ рдкреНрд░рддреНрдпрдп рдХреЗ рд▓рд┐рдП рдХрд┐рд╕реА рдкреНрд░рдХрд╛рд░ рдХрд╛ рдбреИрд╢ рдиреЛрдЯреЗрд╢рди рдЬреЛ рдПрдХ рдирд┐рд╢реНрдЪрд┐рдд рд╕реНрдЯреНрд░рд┐рдВрдЧ рдореЗрдВ рд╕реЗрдЯ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ (рдЗрд╕рд▓рд┐рдП рдпрджрд┐ рдереАрдо рд╕реЗрдЯрд┐рдВрдЧреНрд╕ рдмрджрд▓ рджреА рдЬрд╛рддреА рд╣реИрдВ, рддреЛ) рдХрд╕реНрдЯрдо рдереАрдо рдЖрдИрдбреА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ред рдЬрд┐рд╕рдореЗрдВ рдХрдо рд╡рд░реНрдмреЛрдЬрд╝ рдЙрддреНрдкрд╛рджрди рд╡рд┐рдХрд▓реНрдк, рдпрд╛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреЙрд▓рдмреИрдХ рдлрд╝рдВрдХреНрд╢рди рднреА рд╢рд╛рдорд┐рд▓ рд╣реИред рдФрд░ рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд░реВрдЯ рдкрд░ рдПрдХ рд╡рд░реНрдЧ рдЖрдорддреМрд░ рдкрд░ рд╣рдореЗрд╢рд╛ рдЖрд╡рд╢реНрдпрдХ рд╣реЛрдиреЗ рд╡рд╛рд▓рд╛ рд╣реИред

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╕реВрдЪреАрдмрджреНрдз рдФрд░ рд╕реБрдЭрд╛рд╡ рдХреА рдХрдИ рдЖрд╡рд╢реНрдпрдХрддрд╛рдПрдВ рд╣реИрдВред рддреЛ, рдХреНрдпрд╛ рдЗрд╕ рдЪрд░реНрдЪрд╛ рд╕реЗ рдХреЛрдИ рд▓реЗрдирд╛-рджреЗрдирд╛ рд╣реИ? рдХрд╛рд░реНрд░рд╡рд╛рдИ рдХрд╛ рдЕрдЧрд▓рд╛ рдХреЛрд░реНрд╕ рдХреНрдпрд╛ рд╣реИ? рдХреНрдпрд╛ рдЗрд╕ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдореЗрдВ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЬреЗрдбрдПрд╕ рдХреЛ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдкрд░ рдХреЛрдИ рдХрд╛рдо рдХрд┐рдпрд╛ рдЬрд╛ рд░рд╣рд╛ рд╣реИ?

@rvbyron рд╣рд╛рдВ, рд╣рдо рдкрд░реНрджреЗ рдХреЗ рдкреАрдЫреЗ рдХреЗ рдХреБрдЫ рд╡рд┐рдЪрд╛рд░реЛрдВ рдХреЗ рд╕рд╛рде рдкреНрд░рдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВред рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рддрдм рдЕрдкрдбреЗрдЯ рдХрд░реЗрдВрдЧреЗ рдЬрдм рд╣рдореЗрдВ рдХреБрдЫ рдФрд░ рдареЛрд╕ рд╡рд┐рдЪрд╛рд░ рдорд┐рд▓реЗрдВрдЧреЗред

рдореЗрд░реА рд╡рд┐рдирдореНрд░ рд░рд╛рдп рдореЗрдВ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╕реАрдПрд╕рдПрд╕ рдФрд░ рдХрднреА рднреА рдЗрд╕рдХрд╛ рд╕рдВрдХрд▓рди рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рднрд╡рд┐рд╖реНрдп рдХреЗ рд╣рд┐рд╕реНрд╕реЗ рдирд╣реАрдВ рд╣реИрдВред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╣рдо рд╕рднреА рд╕рд╣рдордд рд╣реИрдВ рдХрд┐ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдиреЗ рд╣рдорд╛рд░реЗ рдЬреАрд╡рди рдХреЛ рдмрд╣реБрдд рдЖрд╕рд╛рди рдмрдирд╛ рджрд┐рдпрд╛ рд╣реИред рдИрдорд╛рдирджрд╛рд░реА рд╕реЗ, рдореИрдВ рдХреЗрд╡рд▓ рдЗрдирд▓рд╛рдЗрди-рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рджреЗрдЦ рд░рд╣рд╛ рд╣реВрдБ: рд╣реЙрд╡рд░!

рдореБрджреНрджрд╛ рдпрд╣ рд╣реИ рдХрд┐: рд╣реЙрд╡рд░ рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рдПрдХ рдмрд╣реБрдд рд╣реА рдмреБрдирд┐рдпрд╛рджреА, рдмрд╣реБрдд рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╣рд┐рд╕реНрд╕рд╛ рд╣реИред рдПрдХ рддрд░рдл рдлреНрдпреВрдЪрд░рд┐рдЬреНрдо, рдПрдХ рд╕рдорд╛рдзрд╛рди рдХреЗ рд▓рд┐рдП рд╕рдордп рд╕реЗ рдкрд╣рд▓реЗ рдкреНрд░рддрд┐рдмрджреНрдзрддрд╛ рд╕реЗ рдмрдЪрдиреЗ рдХреЗ рд▓рд┐рдП рд╡рд┐рд╡реЗрдХрдкреВрд░реНрдг рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдЬреЛ рдореВрд▓ рд╡рд┐рд╢реЗрд╖рддрд╛ рдХреЛ рдлрд┐рд░ рд╕реЗ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдзреЛрдЦрд╛ рдФрд░ рдХрд╛рдо-рдХреЗ рдЖрд╕рдкрд╛рд╕ рдХрд╛ рд╕рд╣рд╛рд░рд╛ рд▓реЗрдирд╛ рдЪрд╛рд╣рд┐рдПред

@wtgtybhertgeghgtwtg рд╣рдо рдПрдХ рдРрд╕реЗ рд╕рдорд╛рдзрд╛рди рдХреА рджрд┐рд╢рд╛ рдореЗрдВ рдХрд╛рдо рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рдЬреЛ рд╡рд╛рд╕реНрддрд╡рд┐рдХ :hover рд╕рдорд░реНрдерд┐рдд рд╣реИред

рдпрд╣ рджреЗрдЦрддреЗ рд╣реБрдП рдХрд┐ рдкреНрд░рдореБрдЦ рдмрд┐рдВрджреБрдУрдВ рдХрд╛ рдирд┐рд░реНрдгрдп рд▓рд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ (рдХреНрд▓рд╛рд╕ рдирд╛рдо рдФрд░ рд░реВрдЯ рдПрд▓рд┐рдореЗрдВрдЯ рдХреНрд▓рд╛рд╕рдиреЗрдо рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдЬреЗрдПрд╕рдПрд╕ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ), рдХреНрдпрд╛ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ v0.16.0 рд░рд┐рд▓реАрдЬ рдХреЗ рд▓рд┐рдП рдХреЛрдИ рд░реЛрдбрдореИрдк рдФрд░ рд╕рдордпрд░реЗрдЦрд╛ рд╣реИ?

@rvbyron рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдПрдХ рд╡рд╛рджрд╛ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╕рдордп рдирд╣реАрдВ рд╣реИ, рд▓реЗрдХрд┐рди рдЕрдм рддрдХ, рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдФрд░ рдкреНрд░рджрд░реНрд╢рди v0.16.0 рд░рд┐рд▓реАрдЬ рдХреЗ рд▓рд┐рдП рд╣рдорд╛рд░рд╛ рдкреНрд░рд╛рдердорд┐рдХ рдзреНрдпрд╛рди рдХреЗрдВрджреНрд░рд┐рдд рд╣реИ рдФрд░ рд╣рдо рдЕрднреА рд╕рдХреНрд░рд┐рдп рд░реВрдк рд╕реЗ рдХрд╛рдо рдХрд░ рд░рд╣реЗ рд╣реИрдВред рд╣рдо рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рдирд┐рдХрдЯ рднрд╡рд┐рд╖реНрдп рдореЗрдВ рд╕рд╛рдореБрджрд╛рдпрд┐рдХ рдлреАрдбрдмреИрдХ рдХреЗ рд▓рд┐рдП рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдПрдХ рдмрд╛рд░ рд╣рдо рдХреБрдЫ рдЕрдиреНрдп рдХреНрд╖реЗрддреНрд░реЛрдВ рдореЗрдВ рд╕рд╣реА рджрд┐рд╢рд╛ рдореЗрдВ рдмрд╕ рдЧрдП рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдЖрдВрддрд░рд┐рдХ, рдПрдкреАрдЖрдИ, рдкреНрд░рд╡рд╛рд╕рди рдЖрджрд┐ рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд рд╣реИред

@newoga рдзрдиреНрдпрд╡рд╛рдж рдиреАрд▓! рдореИрдВ рдЕрдкрдбреЗрдЯ рдХреА рд╕рд░рд╛рд╣рдирд╛ рдХрд░рддрд╛ рд╣реВрдВред рдЕрдиреНрдп рдореБрджреНрджреЛрдВ рдХреЗ рд▓рд┐рдП, рдореИрдВ рдпрд╣ рдЬреЛрдбрд╝рдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛ рдХрд┐ рд╕рд┐рд░реНрдл рдХреНрд▓рд╛рд╕рдиреЗрдо рдЖрдзрд╛рд░рд┐рдд рдкреНрд░рдгрд╛рд▓реА рдореЗрдВ рдЬрд╛рдирд╛ рдХрдИ рд▓реЛрдЧреЛрдВ рдХреЗ рд▓рд┐рдП рдПрдХ рдиреЗрддреНрд░рд╣реАрди рдкрд░рд┐рд╡рд░реНрддрди рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдФрд░ рдореИрдВ рдЗрд╕ рд░рд┐рд▓реАрдЬ рдХреЛ рд╕рд┐рд░реНрдл рдЙрд╕реА рддрдХ рд╕реАрдорд┐рдд рд░рдЦрдиреЗ рдХрд╛ рд╕реБрдЭрд╛рд╡ рджреВрдВрдЧрд╛ред рдЗрд╕рдХреЗ рдЕрддрд┐рд░рд┐рдХреНрдд рдЕрдиреНрдп рдкрд░рд┐рд╡рд░реНрддрди рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдПрдХ рдкреНрд░рд╡рд╛рд╕ рдХреЛ рдмрд╛рдзрд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рд╣рд╛рд▓рд╛рдВрдХрд┐, рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреА рдЯреАрдо рд╕рдмрд╕реЗ рдЕрдЪреНрдЫрд╛ рд╕рдВрддреБрд▓рди рдмрдирд╛рдПрдЧреАред

@newoga рдпрд╣рд╛рдБ jss рдХреЛ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХреЗ рд▓рд┐рдП рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рд╕рд┐рд╕реНрдЯрдо рдХреЗ рднрд╡рд┐рд╖реНрдп рдХреЗ рд░реВрдк рдореЗрдВ рдХрд╣рд╛ рдЧрдпрд╛ рд╣реИред рдпрд╣ рдПрдХ рдареЛрд╕ рдкрд░реНрдпрд╛рдкреНрдд рдпреЛрдЬрдирд╛ рд╣реИ рдХрд┐ 16.0 рд░рд┐рд▓реАрдЬ рдХреА рдкреНрд░рддреНрдпрд╛рд╢рд╛ рдореЗрдВ рдЕрдиреНрдп рд▓реЛрдЧ рд╣рдорд╛рд░реА рдкрд░рд┐рдпреЛрдЬрдирд╛рдУрдВ рдореЗрдВ рдЕрдм рдЬреЗрдбрдПрд╕рдмреЛрд░реНрдбрд┐рдВрдЧ рд╢реБрд░реВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ?

@ рд╕реБрд░реЛрд░рди рдЕрднреА рдирд╣реАрдВ

@sorahn рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЪреБрдиреМрддреАрдкреВрд░реНрдг рд╕рдорд╕реНрдпрд╛ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╕рд╛рдореБрджрд╛рдпрд┐рдХ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдбрд┐рдЬрд╝рд╛рдЗрди рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИред рдХреЛрдИ рдЖрдзрд┐рдХрд╛рд░рд┐рдХ рдирд┐рд░реНрдгрдп рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИред рдЕрдм рддрдХ, рд╕рднреА рдХреЛ рдХреЗрд╡рд▓ рдПрдХ рд╕реНрдЯрд╛рдЗрд▓ рд▓рд╛рдЗрдмреНрд░реЗрд░реА рдпрд╛ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХрд╛ рдЪрдпрди рдФрд░ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП рдЬреЛ рдЙрдиреНрд╣реЛрдВрдиреЗ рдореВрд▓реНрдпрд╛рдВрдХрди рдХрд┐рдпрд╛ рд╣реИ, рдЙрдирдХреЗ рдФрд░ рдЙрдирдХреЗ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдХреЗ рд▓рд┐рдП рд╕рдмрд╕реЗ рдЕрдЪреНрдЫрд╛ рд╣реИред

рд░рд┐рдХреЙрд░реНрдб рдХреЗ рд▓рд┐рдП, рдЗрд╕ рд╕реНрдЯрд╛рдЗрд▓ рдкрд░рд┐рд╡рд░реНрддрди рдХрд╛ рд▓рдХреНрд╖реНрдп рд╣рд░ рдХрд┐рд╕реА рдХреЛ рдХреБрдЫ рдЕрд▓рдЧ рдорд╛рдирдХ рдкрд░ рд╕реНрдерд╛рдирд╛рдВрддрд░рд┐рдд рдХрд░рдирд╛ рдирд╣реАрдВ рд╣реИ, рд▓реЗрдХрд┐рди рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдШрдЯрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдФрд░ рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рдирд╛ рдЖрд╕рд╛рди рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП, рдЪрд╛рд╣реЗ рдЖрдк рдЗрд╕рдХреЗ рд╕рд╛рде рдХреНрдпрд╛ рд╕реНрдЯрд╛рдЗрд▓ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВред

tl; рдбреЙ рдиреЛ! рдЬреЛ рдЖрдкрдХреЗ рд▓рд┐рдП рд╕рдмрд╕реЗ рдЕрдЪреНрдЫрд╛ рд╣реЛ, рд╡рд╣реА рдХрд░реЗрдВ рдЬреЛ рдХреЛрдИ рдФрд░ рди рдХрд╣реЗ :)

@nathanmark @newoga рдЕрдкрдбреЗрдЯ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж!

рд╣рдо рд╕рднреА рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рдЙрддреНрддрд░рджрд╛рдпреА рдбрд┐рдЬрд╝рд╛рдЗрди + рд╕рд░реНрд╡рд░ рд╕рд╛рдЗрдб рд░реЗрдВрдбрд░рд┐рдВрдЧ рдХреА рд╕реАрдорд╛рдУрдВ рдореЗрдВ рдЪрд▓ рд░рд╣реЗ рд╣реИрдВ, рдЗрд╕рд▓рд┐рдП рд╣рдо рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреА рдЬрд╛рдВрдЪ рдХрд░ рд░рд╣реЗ рд╣реИрдВред рд╕реАрдПрд╕рдПрд╕-рдореЙрдбреНрдпреВрд▓ рдпрд╛ рд╕реАрдПрд╕рдПрдХреНрд╕ рдпрд╛ рдЬреЛ рднреА рд╣реЛ, рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреЛрдИ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рдордЬрдмреВрдд рд░рд╛рдп рдирд╣реАрдВ рд╣реИ, рд▓реЗрдХрд┐рди рд╣рдо рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рд╕реЗ рдкреНрдпрд╛рд░ рдХрд░рддреЗ рд╣реИрдВ рдЗрд╕рд▓рд┐рдП рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╣реЛрдЧрд╛ рдХрд┐ рдЖрдк рдЬреЛ рднреА рдХрд░рдиреЗ рдЬрд╛ рд░рд╣реЗ рд╣реИрдВ рдЙрд╕рдХреЗ рд╕рд╛рде рдкрд╛рд▓рди рдХрд░реЗрдВ :)

рдореИрдВ рдореАрдбрд┐рдпрд╛ рдкреНрд░рд╢реНрдиреЛрдВ рдореЗрдВ рднрд╛рдЧ рдЧрдпрд╛, рдпрд╣ рдзрд╛рдЧрд╛ (рдФрд░ рдЕрдиреНрдп) рдкрдврд╝реЗрдВред рдореИрдВ рдХреБрдЫ рд╕рдВрднрд╛рд╡рд┐рдд рд╕рдорд╛рдзрд╛рдиреЛрдВ рдФрд░ рд▓реЗрдЦреЛрдВ рдореЗрдВ рдХрд╛рдо рдХрд░рддрд╛ рд╣реВрдВред

рдореБрдЭреЗ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ JSS + CSX рд╕рдорд╛рдзрд╛рди (рдПрдХ рдбреЗрд╡рд▓рдкрд░ _joy_ рдкрд░рд┐рдкреНрд░реЗрдХреНрд╖реНрдп рд╕реЗ) рдкрд╕рдВрдж рд╣реИред

JSS рд▓рд╛рдн рдФрд░ рдкреНрд░рджрд░реНрд╢рди

@Sorahn рдХреЗ рд╕рдорд╛рди, рдореБрдЭреЗ рдПрдХ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдорд╛рдирдХ рдЕрдкрдирд╛рдиреЗ рдореЗрдВ рдЦреБрд╢реА рд╣реЛрдЧреА, рдореБрдЭреЗ рдЙрдореНрдореАрдж рд╣реИ рдХрд┐ рдЗрд╕ рджрд┐рд╢рд╛ рдореЗрдВ @nathanmark рдХрд╛рдо рдЗрд╕ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЛ рдорд╛рдиреНрдп рдХрд░рддрд╛ рд╣реИред рдЗрд╕рдХреЗ рдЕрд▓рд╛рд╡рд╛, рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рджреЛрдиреЛрдВ CSX / JSS рдбреЗрд╡рд▓рдкрд░реНрд╕ рдЕрдкрдиреЗ рдкреБрд╕реНрддрдХрд╛рд▓рдпреЛрдВ рдХреЛ рдЕрдкрдирд╛рдиреЗ рдореЗрдВ рдорджрдж рдХрд░рдиреЗ рдФрд░ рдмрдврд╝рд╛рд╡рд╛ рджреЗрдиреЗ рдХреЗ рд▓рд┐рдП рдЙрддреНрд╕реБрдХ рд╣реИрдВред

@rosskevin рдЬреИрд╕рд╛ рдХрд┐ рд╣рдо рдмреЛрд▓рддреЗ рд╣реИрдВ рдЙрд╕ рдкрд░ рдХрд╛рдо рдХрд░рдирд╛ - рдпрд╣рд╛рдБ рдЙрди рдмрд╛рддреЛрдВ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░рдирд╛ рд╣реИ рдЬрд┐рдиреНрд╣реЗрдВ рдЖрдЬ рддрдХ рдХрд┐рд╕реА рднреА рд╕рдорд╛рдзрд╛рди рдореЗрдВ рд╢рд╛рдорд┐рд▓ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИред

рд╣рдорд╛рд░реА рдЖрд╡рд╢реНрдпрдХрддрд╛рдПрдВ рдореМрдЬреВрджрд╛ рд╕рдорд╛рдзрд╛рдиреЛрдВ рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдмрд╣реБрдд рдЕрдзрд┐рдХ рд╡реНрдпрд╛рдкрдХ рд╣реИрдВ, рдЬреЛ рдбрд┐рдЬрд╛рдЗрди рд╕реАрдорд╛рдУрдВ рдпрд╛ рд░рд╛рдп рдХреЗ рдХрд╛рд░рдг рд╕рдорд░реНрдерди рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реИрдВред рдпрд╣ рдмрдбрд╝реЗ рдкреИрдорд╛рдиреЗ рдкрд░ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдореМрдЬреВрджрд╛ рд╕рдорд╛рдзрд╛рдиреЛрдВ рдХреЛ рдзреНрдпрд╛рди рдореЗрдВ рд░рдЦрддреЗ рд╣реБрдП рдРрдкреНрд╕ рдХреЗ рд╕рд╛рде рд╡рд┐рдХрд╕рд┐рдд рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ рдЬрд╣рд╛рдВ рдЖрдкрдХреЗ рдкрд╛рд╕ рдЕрдкрдиреЗ рдШрдЯрдХ рдПрдкреАрдЖрдИ рдмрдирд╛рдо рдПрдХ рдкреБрд╕реНрддрдХрд╛рд▓рдп рдХреА рдЦрдкрдд рдкрд░ рдкреВрд░рд╛ рдирд┐рдпрдВрддреНрд░рдг рд╣реИ, рдЬрд╣рд╛рдВ рдЖрдкрдХреЗ рдкрд╛рд╕ рд╡рд┐рднрд┐рдиреНрди рдЙрдкрдХрд░рдгреЛрдВ рдХреЗ рд╕рд╛рде рдЕрдкрдиреЗ рдШрдЯрдХреЛрдВ рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рдиреЗ рдХреЗ рдЗрдЪреНрдЫреБрдХ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХрд╛ рдПрдХ рд╡рд┐рд╡рд┐рдз рд╕реЗрдЯ рд╣реИред

@sorahn рддреНрд╡рд░рд┐рдд рдкреНрд░рд╢реНрди - рдЖрдк рд╕рд░реНрд╡рд░ рд╕рд╛рдЗрдб рд░реЗрдВрдбрд░рд┐рдВрдЧ рдХреЗ рд╕рд╛рде рд╡рд┐рдХреНрд░реЗрддрд╛ рдЙрдкрд╕рд░реНрдЧреЛрдВ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреНрдпрд╛ рдХрд░ рд░рд╣реЗ рд╣реИрдВ? рдХреНрдпрд╛ рдЖрдк рд╕рд░реНрд╡рд░ рдкрд░ рд╕рднреА рдЙрдкрд╕рд░реНрдЧреЛрдВ рдХрд╛ рдкреНрд░рддрд┐рдкрд╛рджрди рдХрд░ рд░рд╣реЗ рд╣реИрдВ? рдпрд╛ рдпреВрдП рдкрд╛рд╕ рдХрд░ рд░рд╣реЗ рд╣реИрдВ?

@nathanmark рд╣рдо рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдПрдЬреЗрдВрдЯ рдХреЛ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рднреЗрдЬ рд░рд╣реЗ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдореИрдВ рд╡реНрдпрдХреНрддрд┐рдЧрдд рд░реВрдк рд╕реЗ рдЙрд╕ рдкрд░ рдирд┐рд░реНрднрд░ рд░рд╣рдирд╛ рдкрд╕рдВрдж рдирд╣реАрдВ рдХрд░рддрд╛ред рдХреНрдпрд╛ рдХреЗрд╡рд▓ рдЙрди рд╕рднреА рдХреЛ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ рдбрд╛рд▓рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ, рдФрд░ рд▓реЛрдЧреЛрдВ рдХреЛ рдЙрдиреНрд╣реЗрдВ muiTheme рдСрдмреНрдЬреЗрдХреНрдЯ рдкрд░ рдкреНрд░реЙрдкреНрд╕ рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИ, рдпрд╛ рдЗрд╕рдХреЗ рд╡рд┐рдкрд░реАрдд, рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ рдХреЛрдИ рднреА рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ, рдФрд░ рд▓реЛрдЧреЛрдВ рдХреЛ рдЪреБрдирдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИред

muiTheme: {
  // other stuff...
  stylePrefixes: ['webkit', 'moz', 'ms']
}

@sorahn рдЖрдк рдЬреЛ рдЪрд╛рд╣реЗ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рдЙрдкрд╕рд░реНрдЧ, рдЙрдкрд╕рд░реНрдЧ рдирд╣реАрдВ, all рдкрд╛рд╕ рдХрд░реЗрдВ, UA рдкрд╛рд╕ рдХрд░реЗрдВ, рдЖрджрд┐ред

@nathanmark рдореИрдВрдиреЗ рдЕрднреА [email protected] рдЬрд╛рд░реА рдХрд┐рдпрд╛ рд╣реИ http://jsstyles.github.io/examples/index.html

рдмрд╕ рдЕрдкрдиреЗ $ .02 рдореЗрдВ рдпрд╣рд╛рдВ рдлреЗрдВрдХ рд░рд╣рд╛ рд╣реВрдВ ... рдЬрдмрдХрд┐ рдореБрдЭреЗ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рд╡рд┐рдЪрд╛рд░ рдкрд╕рдВрдж рд╣реИ рдФрд░ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдореЛрддреНрддреЗрдЬрдХ рдЕрдкреАрд▓, рдпрд╣ рд▓рдЧрднрдЧ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЕрдЧрд░ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк 4 рдЬреИрд╕реЗ рд╕реНрдХреИрд╕ рдореЗрдВ рд▓рд╛рдЗрдмреНрд░реЗрд░реА рдкреНрд░рд╛рд░реВрдк рдореЗрдВ рдЖрдзрд╛рд░рд┐рдд рдереЗ, рддреЛ рдпрд╣ рдЖрд╕рд╛рди рд╣реЛрдЧрд╛ред

рдореИрдВ рдЖрдорддреМрд░ рдкрд░ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк.scss рдлрд╝рд╛рдЗрд▓ рдФрд░ _variables.scss рдлрд╝рд╛рдЗрд▓ рдХреА рдкреНрд░рддрд┐рд▓рд┐рдкрд┐ рд╢рд╛рдмреНрджрд┐рдХ рд░реВрдк рд╕реЗ рдХреЙрдкреА рдХрд░рддрд╛ рд╣реВрдВ, _mixins.scss рдлрд╝рд╛рдЗрд▓ рдмрдирд╛рддреЗ рд╕рдордп ... рдЙрд╕ рдкреНрд░рддрд┐рд▓рд┐рдкрд┐ рдХреЗ рдЕрдВрддрд░реНрдЧрдд ./lib/style рдХреЗ рд╕рд╛рде, рд╕реНрдерд╛рдиреАрдп рдХреЛ рд╕рдВрджрд░реНрднрд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдореИрдВ рд╕реНрдерд╛рдиреАрдпрд╕реНрдЯреНрд░реИрдкред Scss рдлрд╝рд╛рдЗрд▓ рдХреЛ рдЕрджреНрдпрддрди рдХрд░рддрд╛ рд╣реВрдВред рдЪрд░ рдФрд░ рдорд┐рдХреНрд╕рд┐рдиреНрд╕, рдмрд╛рдХреА рд╕рдм рдЪреАрдЬреЛрдВ рдХреЗ рдиреЛрдб_рдореЙрдбреНрдпреВрд▓реНрд╕ рдХреЗ рдорд╛рд░реНрдЧ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реБрдП ...

рдореИрдВрдиреЗ рддрдм рдЕрдкрдирд╛ рд╡реЗрдмрдкреИрдХ рдХреЙрдиреНрдлрд┐рдЧрд░реЗрд╢рди рд╕реЗрдЯрдЕрдк рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП ./lib/style sassLoader config рдХреЗ рд▓рд┐рдП рдЦреЛрдЬ рдкрде рдХрд╛ рд╣рд┐рд╕реНрд╕рд╛ рдмрдирд╛рдпрд╛ред

рдЗрд╕ рддрд░рд╣, рдореЗрд░реЗ рдкрд╛рд╕ рдПрдХ main.scss рдлрд╛рдЗрд▓ рд╣реЛ рд╕рдХрддреА рд╣реИ рдЬреЛ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк рдХреЛ рд▓реЛрдб рдХрд░рддреА рд╣реИ, рдЖрджрд┐ ... рдореИрдВ рдЕрдкрдиреА рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рдмрд╛рдХреА рд╣рд┐рд╕реНрд╕реЛрдВ рдХреЗ рднреАрддрд░ рд╕рдВрджрд░реНрдн рдЪрд░ рдФрд░ / рдпрд╛ рдорд┐рдХреНрд╕рд┐рдиреНрд╕ рд▓реЗ рд╕рдХрддрд╛ рд╣реВрдВ, рдФрд░ рдЬрдм рдореИрдВ рдЖрдЙрдЯрдкреБрдЯ рдХрд╛ рдирд┐рд░реНрдорд╛рдг / рдмрдВрдбрд▓ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдЙрдкрдпреБрдХреНрдд рд╢реИрд▓рд┐рдпрд╛рдБ рд╣реЛрддреА рд╣реИрдВред рд╢рд╛рдорд┐рд▓ рдереЗред

рдЗрд╕рдХреЗ рдиреАрдЪреЗ рдХреА рдУрд░, рдХреНрдпрд╛ рдпрд╣ рдмрдВрдбрд▓ рдореЗрдВ scss рд╕рд╣рд┐рдд рд╕реНрд░реЛрдд-рдкреВрд░реНрд╡ (рдирд╣реАрдВ рдмрд┐рд▓реНрдб) рдФрд░ рд╡реЗрдмрдкреИрдХ рдХреЗ рд░реВрдк рдореЗрдВ рд╕рд╛рдордЧреНрд░реА-ui рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд▓рд┐рдЦреЗрдЧрд╛ред рдЙрд╕ рдиреЗ рдХрд╣рд╛, рдпрд╣ рд╕рдВрднрд╡рддрдГ рдореМрдЬреВрджрд╛ рдЪрд░, рд╡рд░реНрдЧреЛрдВ рдФрд░ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдорд┐рдХреНрд╕рд┐рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХрд╛ рд╕рдмрд╕реЗ рд╕реАрдзрд╛ рдЖрдЧреЗ рдХрд╛ рд░рд╛рд╕реНрддрд╛ рд╣реЛрдЧрд╛ред

рдлрд┐рд░, рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЬреЗрдПрд╕ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреЗ рд╡рд┐рдЪрд╛рд░ рдХреЛ рдкрд╕рдВрдж рдХрд░рддрд╛ рд╣реВрдВ, рдФрд░ рдПрдлреНрд░реЛрдбрд╛рдЗрдЯ рдХреА рдкреЗрд╢рдХрд╢ рдХреА рддрд░рд╣ рдЯреАрдмреАрдПрдЪ ... рдореИрдВ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд▓рд┐рдП рдПрдХ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рд▓рд╛рдЗрдмреНрд░реЗрд░реА рдХреЗ рд░реВрдк рдореЗрдВ рдХреБрдЫ рдЗрд╕реА рддрд░рд╣ рдХреЗ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рдерд╛ (рдЗрд╕реЗ рдбрд░реНрдорд╛ рдХрд╣рддреЗ рдереЗ), рд▓реЗрдХрд┐рди рдПрдлрд╝реНрд░реЛрдбрд╛рдЗрдЯ рдиреЗ рдореБрдЭреЗ рд╕рдм рдХреБрдЫ рдирд╣реАрдВ рджрд┐рдпрд╛ рдкрд░ рдФрд░ рдЕрдзрд┐рдХ рдХреА рдпреЛрдЬрдирд╛ рдмрдирд╛рдИред

рдХреНрдпрд╛ рд╕реНрдЯрд╛рдЗрд▓ рд╕рдорд╛рдзрд╛рди рдХреЛ рдЕрдВрддрд┐рдо рд░реВрдк рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ?

рдХреНрдпрд╛ рдЗрд╕ рдкрд░ рдХреЛрдИ рдЕрдкрдбреЗрдЯ рд╣реИрдВ?

рд╣рд╛рдВ, next рд╢рд╛рдЦрд╛ jss рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реА рд╣реИ

рдореИрдВ рдЕрднреА рдЗрд╕ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ рдЖрдпрд╛ рдерд╛ рдФрд░ рдореИрдВ рдЗрд╕рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╣реБрдд рдЙрддреНрд╕рд╛рд╣рд┐рдд рдерд╛ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд▓рдЧ рд░рд╣рд╛ рдерд╛, рдЙрджрд╛рд╣рд░рдг рдкреГрд╖реНрда рдиреЗ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдирд╛ рдмрд╣реБрдд рдЖрд╕рд╛рди рдХрд░ рджрд┐рдпрд╛ рдХрд┐ рдШрдЯрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреИрд╕реЗ рдХрд┐рдпрд╛ рдЬрд╛рдП рдФрд░ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рд╡реНрдпрд╛рдкрдХ рд░реВрдк рд╕реЗ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛; рд╣рд╛рд▓рд╛рдБрдХрд┐, рдореИрдВ рдЗрдирд▓рд╛рдЗрди рд╕реНрдЯрд╛рдЗрд▓реНрд╕ рд╕реЗ рдмрд╣реБрдд рдирд┐рд░рд╛рд╢ рд╣реВрдБ рдФрд░ рдореБрдЭреЗ рдпрд╣ рджреЗрдЦрдХрд░ рдЦреБрд╢реА рд╣реБрдИ рдХрд┐ рдЖрдк рд▓реЛрдЧ рдЙрдирд╕реЗ рджреВрд░ рд╣реЛ рд░рд╣реЗ рд╣реИрдВред рдореИрдВ рдЬрд┐рди рдЪреАрдЬреЛрдВ рдХреА рдУрд░ рдЗрд╢рд╛рд░рд╛ рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ рдЙрдирдореЗрдВ рд╕реЗ рдПрдХ рдпрд╣ рд╣реИ рдХрд┐ рдЗрди рдШрдЯрдХреЛрдВ рдХреЗ рдмрд╛рд╣рд░ рд▓реЗрдЖрдЙрдЯ рдХреЗ рд╕рд╛рде рдХреБрдЫ рднреА рдХрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП рдФрд░ рдореВрд▓ рдШрдЯрдХ рдХреА рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреЛ рд╕рдВрднрд╛рд▓рдирд╛ рдЪрд╛рд╣рд┐рдПред рд╕рдмрд╕реЗ рдирд┐рдЪрд▓реЗ рд╕реНрддрд░ рдХреЗ рдШрдЯрдХ рдореЗрдВ рдХрд┐рд╕реА рднреА рддрд░рд╣ рд╕реЗ рдорд╛рд░реНрдЬрд┐рди рдпрд╛ рдкреИрдбрд┐рдВрдЧ рдирд╣реАрдВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП рдЬреЛ рдЖрд╕рдкрд╛рд╕ рдХреЗ рддрддреНрд╡реЛрдВ рдХреЛ рджреВрд░ рдХрд░ рджреЗрдЧрд╛ ... рдЦрд╛рд╕рдХрд░ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдЗрдирд▓рд╛рдЗрди рд╕реНрдЯрд╛рдЗрд▓реНрд╕ рдХреЗ рд╕рд╛рде рдЦрд┐рд▓рд╡рд╛рдбрд╝ рдХреЗ рдмрд┐рдирд╛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдирд╛ рдЕрд╕рдВрднрд╡ рд╣реИ, рдЬрд┐рд╕рдХрд╛ рдорддрд▓рдм рд╣реИ рдХрд┐ рдореБрдЭреЗ рдЪрд╛рд░реЛрдВ рдУрд░ рдЦреБрджрд╛рдИ рдХрд░рдиреЗ рдФрд░ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рдХрд┐ рдХреИрд╕реЗ рдХрд░рдирд╛ рд╣реИ рдЙрд╕ред рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЗрд╕ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ рдмрд╣реБрдд рдЖрдЧреЗ рдирд╣реАрдВ рдбреВрдмрд╛ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рджреБрд░реНрднрд╛рдЧреНрдп рд╕реЗ рдЗрд╕реЗ рдЕрдиреБрдкрдпреЛрдЧреА рдкрд╛рддрд╛ рд╣реВрдВред рдореИрдВ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдЗрдирд▓рд╛рдЗрди рдмрдирд╛рдо рд╕реАрдПрд╕рдПрд╕ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреА рдмрд╣реБрдд рдЪрд░реНрдЪрд╛ рдкрдврд╝рддрд╛ рд╣реВрдВред рд╡реИрд╕реЗ рднреА, рдЖрдкрдиреЗ рдореБрдЭреЗ TextField рдореЗрдВ рдЦреЛ рджрд┐рдпрд╛ рд╣реИред рд╢реАрд░реНрд╖ рдкрд░ рдПрдХ рдорд╛рд░реНрдЬрд┐рди рд╣реИ рдЬреЛ 14px рд╣реИ рдФрд░ рдиреАрдЪреЗ 16px рд╣реИред рдореБрдЭреЗ рдХреЛрдИ рдЖрдкрддреНрддрд┐ рдирд╣реАрдВ рд╣реИ рдХрд┐ рдПрдХ рд╕рд░рд▓ рд╢реИрд▓реА рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд▓рд┐рдЦрдирд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдЗрдирд▓рд╛рдЗрди рд╕реНрдЯрд╛рдЗрд▓ рдХреЗ рдХрд╛рд░рдг рдпрд╣ рдЕрд╕рдВрднрд╡ рд╣реИ рдФрд░ рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдкрд╛рдЧрд▓ рд╣реЛ рдЬрд╛рдПрдЧрд╛ рдХрд┐ рдореБрдЭреЗ рдЙрдЪреНрдЪ рд╕реНрддрд░ рдХреЗ рдШрдЯрдХ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рд┐рд░реНрдл рдПрдХ рд░рд┐рд╡рд░реНрд╕ рдХреЗ рд╕рд╛рде рдЕрдкрдиреЗ рдШрдЯрдХ рдХреЛ рд▓рдкреЗрдЯрдиреЗ рдХреЗ рд░реВрдк рдореЗрдВ рдЙрд▓реНрдЯрд╛ рдХрд░рдирд╛ рд╣реЛрдЧрд╛ рдФрд░ рдорд╛рд░реНрдЬрд┐рди рдХрд░ рд░рд╣рд╛ рд╣реИ: -14px 0 -16px рдпрд╛ рдЗрд╕реЗ рдЧрдгрдирд╛ рдХреЗ рд╕рд╛рде рдереЛрдбрд╝рд╛ рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░реЗрдВ рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ рдореИрдВ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдХрд┐рд╕реА рднреА рддрд░рд╣ рд╕реЗ рдЗрд╕рдХреЗ рд▓рд┐рдП рд╕рд╣реА рд╣реЛрдиреЗ рдХреЗ рд▓рд┐рдП рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЖрд╡рд╢реНрдпрдХ рдирд╣реАрдВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред рдореИрдВ рдЗрд╕реЗ рдФрд░ рдЕрдзрд┐рдХ рдкрд╕рдВрдж рдХрд░реВрдВрдЧрд╛ рдпрджрд┐ рдЖрдк рдПрдХ рдХреНрд▓рд╛рд╕рдиреЗрдо рдХреЛ рдПрдХ рдкреНрд░реЛрдк рдХреЗ рд░реВрдк рдореЗрдВ рдкрд╛рд░рд┐рдд рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрдВрдЧреЗ рдЬреИрд╕реЗ рдХрд┐ рдЖрдк рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдХрд░рддреЗ рд╣реИрдВ рддреЛ рд▓реЗрдЖрдЙрдЯ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдХреЛ рдЙрд╕ рдШрдЯрдХ рдкрд░ рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ рдЖрдкрдХрд╛ рд╕рдореБрджрд╛рдп рдЗрд╕реЗ рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реИред рд╡реИрд╕реЗ рднреА, рдпрд╣ рдореЗрд░реА $ .02 рд╣реИред

рдмрд╕ рдЗрд╕реЗ рдЬреЛрдбрд╝рдиреЗ рдХреЗ рд▓рд┐рдП, рдЗрди рдХреЗ рд▓рд┐рдП рд▓реЗрдЖрдЙрдЯ рдкреНрд░рдХрд╛рд░ рдХреЗ рдШрдЯрдХреЛрдВ рдХреЛ рдмрдирд╛рдирд╛ рдпрд╛ рд▓реЗрдЖрдЙрдЯ рдЧреБрдгреЛрдВ рдХреЛ рд╕рдВрднрд╛рд▓рдиреЗ рдХреЗ рд▓рд┐рдП рдЕрддрд┐рд░рд┐рдХреНрдд рд╕рд╣рд╛рд░рд╛ рдмрдирд╛рдирд╛ рдЖрджрд░реНрд╢ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдЬреИрд╕реЗ рдХрд┐ рдиреАрдВрд╡ рдФрд░ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк рдЬреИрд╕реА рдЧреНрд░рд┐рдб рдкреНрд░рдгрд╛рд▓реА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП, рдЖрдХрд╛рд░, рдирд╛рд▓реА, рдЪреМрдбрд╝рд╛рдИ, рд╕реНрддрдВрднреЛрдВ рдЖрджрд┐ рдЬреИрд╕реЗ рдкреНрд░реЙрдкреНрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛, рд▓реЗрдХрд┐рди рдШрдЯрдХ рдХреЗ рд╕рд╛рде рдЬреЛ рджрд┐рдЦрд╛рдИ рджреЗ рд░рд╣рд╛ рд╣реИ рдЙрд╕рдХреЗ рдмрд╛рд╣рд░ рдХреА рдУрд░ рдХреЛрдИ рд╕реНрдЯрд╛рдЗрд▓ рдирд╣реАрдВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред

рдореИрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ @ jbsmith969 рдХреЗ рд╕рд╛рде рд╣реВрдВ

рдпрд╣ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдореЗрд░реЗ рд▓рд┐рдП рдПрдХ рдЙрдЪреНрдЪ рд╕реНрддрд░реАрдп рдШрдЯрдХ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд╛рдЧрд▓ рд╣реЛ рдЬрд╛рдПрдЧрд╛, рдмрд╕ рдПрдХ рд░рд┐рд╡рд░реНрд╕ рдХреЗ рд╕рд╛рде рдЕрдкрдиреЗ рдШрдЯрдХ рдХреЛ рд▓рдкреЗрдЯрдиреЗ рдФрд░ рдорд╛рд░реНрдЬрд┐рди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП: -14px 0 -16px рдпрд╛ рдереЛрдбрд╝рд╛ рдЗрд╕реЗ рдЧрдгрдирд╛ рдХреЗ рд╕рд╛рде рд╕рдорд╛рдпреЛрдЬрд┐рдд рдХрд░рдиреЗ рдХреЗ рддрд░реАрдХреЗ рд╕реЗ рдореИрдВ рдЗрд╕реЗ рдЪрд╛рд╣рддрд╛ рд╣реВрдВред

@ jbsmith969 рдореИрдВ рд╕рд╣рдордд рд╣реВрдБ рдХрд┐ рдирд┐рдореНрди рд╕реНрддрд░ рдХреЗ рдШрдЯрдХреЛрдВ рдореЗрдВ рдХреЛрдИ рднреА рд▓реЗрдЖрдЙрдЯ рддрд░реНрдХ рдирд╣реАрдВ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред рд╣рд╛рд▓рд╛рдВрдХрд┐, рдЖрдкрдХреА рдРрдк рд╡рд┐рд╢рд┐рд╖реНрдЯрддрд╛ рдХреЗ рд▓рд┐рдП рдПрдХ рдЙрдЪреНрдЪ рд╕рд╛рд░ рдШрдЯрдХ рдмрдирд╛рдирд╛ рдмрд┐рд▓реНрдХреБрд▓ рднреА рдкрд╛рдЧрд▓ рдирд╣реАрдВ рд▓рдЧрддрд╛ рд╣реИред
IMHO, рдпрд╣ рд╕рдмрд╕реЗ рд╢рдХреНрддрд┐рд╢рд╛рд▓реА рдкреИрдЯрд░реНрди рдореЗрдВ рд╕реЗ рдПрдХ рд╣реИ рдЬреЛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рд╕рдХреНрд╖рдо рдХрд░рддрд╛ рд╣реИ (рдЕрд▓рдЧрд╛рд╡ рдЧреБрдгреЛрдВ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж)ред

@oliviertassinari @ jbsmith969 рдпрд╣реА рд╣рдордиреЗ рдХрд┐рдпрд╛! рд╣рдордиреЗ рдЕрдкрдирд╛ CustomTextField рдШрдЯрдХ рдмрдирд╛рдпрд╛, рдЬрд┐рд╕реЗ рдореИрдВ 2 params to (рдлрд╝реАрд▓реНрдб рдирд╛рдо, рдФрд░ рд░рдВрдЧ) рдХреА рддрд░рд╣ рдкрд╛рд╕ рдХрд░рддрд╛ рд╣реВрдВ, рдФрд░ рдпрд╣ рдмрд╕ рдЙрди рд▓реЛрдЧреЛрдВ рдХреЗ рдЪрд╛рд░реЛрдВ рдУрд░ рдПрдХ рдЫреЛрдЯрд╛ рд╕рд╛ рддрд░реНрдХ рдХрд░рддрд╛ рд╣реИ, рдлрд┐рд░ рд╣рдо рдЬреЛ рдХреБрдЫ рднреА рдХрд░рддреЗ рд╣реИрдВ рдЙрд╕рдХреЗ рд╕рд╛рде material-ui/TextField рдкреНрд░рджрд╛рди рдХрд░рддреЗ рд╣реИрдВ рдЪрд╛рд╣рддреЗ рд╣реИрдВред

рдпрд╣ рд╕рднреА рддрд░рд╣ рд╕реЗ рдиреАрдЪреЗ рд╣реИ!

рдЗрд╕рд▓рд┐рдП рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХреЗ рд╕рд╛рде рд╣рдо рдЕрдкрдирд╛ html рд▓реЗ рд░рд╣реЗ рд╣реИрдВ рдФрд░ рдЗрд╕реЗ рдЕрдкрдиреЗ js рдореЗрдВ рдбрд╛рд▓ рд░рд╣реЗ рд╣реИрдВ рдФрд░ рдпрд╣ рдареАрдХ рд╣реИ рдФрд░ рдмрд╛рдВрдХрд╛ рд╣реИред рд▓реЗрдХрд┐рди рд╣рдорд╛рд░реЗ рд╕реАрдПрд╕рдПрд╕ рд▓реЗрдиреЗ рдФрд░ рд╣рдорд╛рд░реЗ html рдореЗрдВ shoving? рдХреНрдпрд╛ рд╡рд╣ рдХрд┐рд╕реА рдФрд░ рдХреЗ рд╕рд╛рде рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдирд╣реАрдВ рдмреИрдарддрд╛ рд╣реИ?

рд╕реИрд╕ рдХреЗ рд╣рд┐рд▓рдиреЗ рд╕реЗ рдХреНрдпрд╛ рдлрд╛рдпрджрд╛ рдерд╛?

рдореБрдЭреЗ рдкреБрд░рд╛рдиреЗ рдЬрд╝рдорд╛рдиреЗ рдХрд╛ рдХрд╣реЛ, рд▓реЗрдХрд┐рди рд╣рдорд╛рд░реЗ js / html рдФрд░ css рдХреЛ рдЕрд▓рдЧ рд░рдЦрдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреНрдпрд╛ рдЧрд▓рдд рд╣реИ?

рдореИрдВ рд╡реИрдз рд░реВрдк рд╕реЗ рдХреБрдЫ рдЙрддреНрддрд░реЛрдВ рдХреА рддрд▓рд╛рд╢ рдореЗрдВ рд╣реВрдБ ...

Https://github.com/callemall/material-ui/issues/3614#issuecomment -249095805 рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд, рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдмрд╕ рдШрдЯрдХ рдмрди рдЬрд╛рддрд╛ рд╣реИред

рдореИрдВ рд╕реАрдПрд╕рдПрд╕ рдХрдХреНрд╖рд╛рдУрдВ рдХреЛ рдирдП рдШрдЯрдХреЛрдВ рдХреЗ рд░реВрдк рдореЗрдВ рджреЗрдЦрддрд╛ рд╣реВрдВ: (рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП btn-danger -рдкреНрд░рд╡рд░реНрддрдХ рд╕реЗ)

const DangerButton = ({ hoverColor, style, ...others }) => {
    return (
        <MUI.FlatButton
            hoverColor={hoverColor || Colors.pink100}
            style={{ color: Colors.black, ...style }}
            {...others}
        />
    );
};

рдкрд░рд┐рд╡рд░реНрддрди рдПрдХ рджрд░реНрдж рд╣реИ, рд╣рд╛рд▓рд╛рдВрдХрд┐ ..

( @ jbsmith969 рдХреЗ рд▓рд┐рдП , MUI рдордЯреАрд░рд┐рдпрд▓ рдбрд┐рдЬрд╝рд╛рдЗрди рдХрд▓реНрдкрдирд╛ рдХрд╛ рдЕрдиреБрд╕рд░рдг рдХрд░рддрд╛ рд╣реИред рдпрджрд┐ рдореИрдВ рдХрд▓реНрдкрдирд╛ рдХрд╛ рдкрд╛рд▓рди рдирд╣реАрдВ рдХрд░рдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛, рддреЛ рдореИрдВ рдХреБрдЫ рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рдХрд░рдиреЗ рдХреА рдЙрдореНрдореАрдж рдХрд░реВрдВрдЧрд╛ред рд╣рд╛рд▓рд╛рдВрдХрд┐, рдореИрдВ рдорд╛рдирддрд╛ рд╣реВрдВ рдХрд┐ MUI рдХреЛ рд╣реИрдХ рдХрд░рдирд╛ рдореБрд╢реНрдХрд┐рд▓ рд╣реИ, рд▓реЗрдХрд┐рди рдЗрд╕рдХрд╛ рдореБрдЦреНрдп рдХрд╛рд░рдг рдЕрд╕рдВрдЧрдд рдЕрдЬреАрдм рд╣реИред рдШрдЯрдХ рд╕рд╣рд╛рд░рд╛, рдЗрд╕рд▓рд┐рдП рдирд╣реАрдВ рдХрд┐ рдЙрдирдХреА рд╢реИрд▓реА рдЗрдирд▓рд╛рдЗрди рд╣реИрдВ)

@vizath рд╕рд╣реА рдореБрдЭреЗ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдПрдХ рд╣реА рд╡рд┐рдЪрд╛рд░ рд╣реИред рд▓реЗрдХрд┐рди рдЗрд╕ рд╕рдорд╛рдзрд╛рди рдХреЗ рдХреНрдпрд╛ рдлрд╛рдпрджреЗ рд╣реИрдВ?

рдЕрдЧрд░ рдХреЛрдИ рдРрд╕рд╛ рд╕рдорд╛рдзрд╛рди рдерд╛ рдЬреЛ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдХрдо рд╕реЗ рдХрдо рдФрд░ рд╕рд╛рде рд╣реА рд╕реАрдПрд╕рдПрд╕ рдХрд░рддрд╛ рд╣реИ, рддреЛ рдореИрдВ рдЗрд╕реЗ рдПрдХ рд╢реЙрдЯ рджреЗрдиреЗ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░реВрдВрдЧрд╛ред рд╣рд╛рд▓рд╛рдВрдХрд┐, рдЪреВрдВрдХрд┐ рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдХреЛрдИ рд╕рдорд╛рдзрд╛рди рдирд╣реАрдВ рд╣реИ (рдХрд┐ рдореБрдЭреЗ рдкрддрд╛ рд╣реИ) рдЬреЛ рдХрд┐ рдХреИрд╡рд┐рдЯ рдХреЗ рдмрд┐рдирд╛ рдРрд╕рд╛ рдХрд░ рд╕рдХрддрд╛ рд╣реИ, рдореБрдЭреЗ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдПрдкрд▓ рджрд┐рдЦрд╛рдИ рдирд╣реАрдВ рджреЗрддрд╛ рд╣реИред

рдХреНрдпреЛрдВ рдЗрд╕ рд░реЗрдкреЛ рдХреЛ рдЕрдкрдирд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рдЬрд╛ рд░рд╣реА рд╣реИ рдЬреЛ рдПрдХ рд╕рдорд╛рдзрд╛рди рдХреЗ рд▓рд┐рдП рдПрдХ рдЕрд▓реНрдлрд╛ рд╕реНрдЯреЗрдЬ рд╡рд┐рдЪрд╛рд░ рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рдЕрдиреНрдпрдерд╛ рдмрд╣реБрдд рдЙрдкрдпреЛрдЧреА рдХреЛрдбрдмреЗрд╕ рд╣реИ? рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рд╣рдо рдЕрднреА рддрдХ рдЯреАрдИрд╕реА рдХреЗ рд╕рд╛рде рд╣реИрдВ, рдФрд░ рди рд╣реА рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдЯреАрдИрд╕реА рдХреЗ рд▓рд┐рдП рдЙрдЪрд┐рдд рдкрд░реАрдХреНрд╖рдг рд╣реИред

Jn рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдШрдЯрдХ рдХреА рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЖрдк next рдореЗрдВ рдирд╡реАрдирддрдо рдХреЛрдб рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ

рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ: рдареАрдХ рд╣реИ, рдХреЗрд╡рд▓ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдпрд╛ рдХрд┐ рдпрд╣ рдЕрднреА рднреА рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд▓рд╛рдЧреВ рдирд╣реАрдВ рд╣реБрдЖ рд╣реИред рдореЗрд░реА рдЧрд▓рддреА! ЁЯШм

рдореБрдЭреЗ рдСрдмреНрдЬреЗрдХреНрдЯ рдХреБрдВрдЬреА рдореЗрдВ рдореГрдд рдХреЛрдб рдХреЛ рдЦрддреНрдо рдХрд░рдиреЗ рдХрд╛ рдПрдХ рдЕрдЪреНрдЫрд╛ рддрд░реАрдХрд╛ рдЕрднреА рддрдХ рдирд╣реАрдВ рдорд┐рд▓рд╛ рд╣реИ, рдФрд░ рдЬреЗрдПрд╕рдПрд╕ рдХреЗ рд╕рд╛рде рдпрд╣ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рд╕рдВрдЧреНрд░рд╣реАрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╡рд╕реНрддреБрдУрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЕрдирд┐рд╡рд╛рд░реНрдп рдмрдирд╛рддрд╛ рд╣реИред

next рдмреНрд░рд╛рдВрдЪ (рдЬреЛ рд╕рдорд╛рдкреНрдд рдирд╣реАрдВ рд╣реБрдЖ рд╣реИ) рдХреЗ рдПрдХ рдШрдЯрдХ рдореЗрдВ рдпрд╛рджреГрдЪреНрдЫрд┐рдХ рдЙрджрд╛рд╣рд░рдг: https://github.com/callemall/material-ui/blob/b372f6223ec2528dbe02fff480233488445b7/src/IconButton/IconButton#sjj##
рдореИрдВ рдордЬрд╝рдмреВрддреА рд╕реЗ рдРрд╕рд╛ рддрд░реАрдХрд╛ рдирд╣реАрдВ рдЦреЛрдЬ рд╕рдХрддрд╛ рдХрд┐ primary рдФрд░ accent рд╡рд░реНрдЧреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рди рдХрд┐рдпрд╛ рдЬрд╛рдПред

рдореБрдЭреЗ рдпрд╣ рдкрд╕рдВрдж рдирд╣реАрдВ рдерд╛ рдХрд┐ рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ MUI рдкрд╣рд▓реЗ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рдкреНрд░рдмрдВрдзрди рдХрд░ рд░рд╣рд╛ рдерд╛, рдЙрд╕реА рдХрд╛рд░рдг рд╕реЗ (рд▓рд┐рдВрдЯ рдЕрдирд╕реЛрд▓реНрдб рд╡реЗрд░рд┐рдПрдмрд▓реНрд╕ рдХреЛ рдкрдХрдбрд╝рддрд╛ рд╣реЛрдЧрд╛ рдпрджрд┐ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЕрд▓рдЧ-рдЕрд▓рдЧ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛, рддреЛ https://github.com/callemall/material-ui/blob/ рджреЗрдЦреЗрдВ 60a202fdc9645aa00f20c52e5152f168a1b0031b / src / IconButton / IconButton.js # L26)ред

рд╕реИрд╕ рдХреЗ рд╣рд┐рд▓рдиреЗ рд╕реЗ рдХреНрдпрд╛ рдлрд╛рдпрджрд╛ рдерд╛?

@gdaunton рдпрд╣ рдЗрдирд▓рд╛рдЗрди-рд╕реНрдЯрд╛рдЗрд▓ / рд╕реИрд╕ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдПрдХ рддрд░рдл рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИред

рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдХреЗ рджреГрд╖реНрдЯрд┐рдХреЛрдг рд╕реЗ , рдпрд╣ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╕реБрдзрд╛рд░ рдкреНрд░рджрд╛рди рдХрд░рдиреЗ рд╡рд╛рд▓рд╛ рд╣реИ:

  • рддреЗрдЬрд╝ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдкреНрд░рджрд╛рди рдХрд░рдиреЗ рдХреА рд╡рд┐рдзрд┐, рдЬреИрд╕рд╛ рдХрд┐ рд╣рдо рдХреИрд╢ рдХреА рдЧрдИ рд╕реАрдПрд╕рдПрд╕ рд╢реАрдЯ рдкрд░ рднрд░реЛрд╕рд╛ рдХрд░рдиреЗ рдЬрд╛ рд░рд╣реЗ рд╣реИрдВред
  • рд╕рд░рд▓реАрдХреГрдд рд╢реИрд▓реА рдУрд╡рд░рд░рд╛рдЗрдбрд┐рдВрдЧ, рдХреНрдпреЛрдВрдХрд┐ рд╕реАрдПрд╕рдПрд╕ рдкреВрд░реНрд╡рддрд╛ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓реА рдПрдХ рд╕реЗ рдХрдо рд╣реИ рдФрд░ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рд╢реАрдЯ рдХреЛ рдмрджрд▓рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд╣рдЪрд╛рдирдиреЗ рдХреЗ рд▓рд┐рдП DevTools рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред
  • рд╕рд░реНрд╡рд░ рд╕рд╛рдЗрдб рд░реЗрдВрдбрд░рд┐рдВрдЧ рдХрд░рддреЗ рд╕рдордп рд╕рдмрд╕реЗ рдкрд╣рд▓реЗ рдкреЗрдВрдЯ рдХрд░реЗрдВред

    • рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╕реАрдПрд╕рдПрд╕ рд╢реАрдЯреЛрдВ рдХреЛ рдЗрдирд▓рд╛рдЗрди рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реЛрдВрдЧреЗ, рдФрд░ рдкреГрд╖реНрда рдореЗрдВ рдХреЗрд╡рд▓ рдПрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВрдЧреЗред рдРрд╕рд╛ рдХреБрдЫ рд╣реИ рдЬреЛ рдЖрдк _Bootstrap_ рдХреЗ рд╕рд╛рде рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдмрдбрд╝рд╛ рдЕрдЦрдВрдб рд╣реИ ред

    • рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдЙрддреНрдкрд╛рджрди рдореЗрдВ рд╡рд░реНрдЧ рдХреЗ рдирд╛рдо рдХреА рдХреБрдВрдЬрд┐рдпреЛрдВ рдХреЛ рдЦрд░рд╛рдм рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред

  • рдХреЛрдИ рдЕрдВрддрд░реНрдирд┐рд╣рд┐рдд рдЪреЗрди рдирд┐рд░реНрднрд░рддрд╛ рдЬреИрд╕реЗ _scss-loader_ рдпрд╛ _Webpack_ рдирд╣реАрдВред

рдПрдХ рдпреЛрдЧрджрд╛рдирдХрд░реНрддрд╛ / рдЕрдиреБрд░рдХреНрд╖рдХ рджреГрд╖реНрдЯрд┐рдХреЛрдг рд╕реЗ , рдпрд╣ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╕реБрдзрд╛рд░ рдкреНрд░рджрд╛рди рдХрд░рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реИ:

  • рдХреЛрдИ рдФрд░ рдЕрдзрд┐рдХ рд╕реАрдПрд╕рдПрд╕ рд▓рд╛рдЗрдирд░
  • рдХреЛрдИ рдФрд░ рдЕрдзрд┐рдХ рдкреВрд░реНрд╡ рдкреНрд░реЛрд╕реЗрд╕рд░ рд╕реАрдПрд╕рдПрд╕
  • рдХреЛрдИ рд╕реАрдПрд╕рдПрд╕ рд╕рд┐рдВрдЯреИрдХреНрд╕ рд╕реАрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдирд╣реАрдВ
  • рдШрдЯрдХ рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдЕрдзрд┐рдХ рд╢рдХреНрддрд┐рд╢рд╛рд▓реА рднрд╛рд╖рд╛: рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ
  • рд╕реНрдЯрд╛рдЗрд▓ рдЗрдВрдЬрди рдХреЛ рджреВрд░ рдХрд░рдиреЗ рдХреА рд╕рдВрднрд╛рд╡рдирд╛ рдЦреЛрд▓реЗрдВред рдЬреИрд╕реЗ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рд╢реИрд▓реА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ

рдпрд╣ рд░реЗрдкреЛ рд╡рд╣реА рдХреНрдпреЛрдВ рдЕрдкрдирд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣рд╛ рд╣реИ рдЬреЛ рдПрдХ рдЕрд▓реНрдлрд╝рд╛ рд╕реНрдЯреЗрдЬ рд╡рд┐рдЪрд╛рд░ рд▓рдЧрддрд╛ рд╣реИ

рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИ рдХрд┐ рдЖрдк рдЕрд▓реНрдлрд╛ рд╕реНрдЯреЗрдЬ рдЖрдЗрдбрд┐рдпрд╛ рд╕реЗ рдХреНрдпрд╛ рдорддрд▓рдм рд░рдЦрддреЗ рд╣реИрдВред
рд╣рдо рдЗрд╕ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рдПрдХрдорд╛рддреНрд░ рд╣реЛрдиреЗ рд╕реЗ рдмрд╣реБрдд рджреВрд░ рд╣реИрдВред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП AirBnB, рдЦрд╛рди рдЕрдХрд╛рджрдореА, рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛рд╢реАрд▓ред

рдХрдо рд╕реЗ рдХрдо рдФрд░ рд╕рд╛рде рд╣реА рд╕реАрдПрд╕рдПрд╕ рдХрд░рддрд╛ рд╣реИ

CSS рдХреЛ рд╕реНрдЯрд╛рдЗрд▓ рдбреЙрдХреНрдпреВрдореЗрдВрдЯреНрд╕ рдореЗрдВ рд╢реБрд░реВ рд╕реЗ рдбрд┐рдЬрд╝рд╛рдЗрди рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛, рди рдХрд┐ рдХрдВрдкреЛрдиреЗрдВрдЯреНрд╕ рдХреЗ рд▓рд┐рдП ред
рдпрд╣ рд╣рдорд╛рд░реЗ рдЙрджреНрдпреЛрдЧ рдореЗрдВ рдПрдХ рдкреНрд░рдореБрдЦ рдмрджрд▓рд╛рд╡ рд╣реИред

рдореЗрд░реЗ рджреГрд╖реНрдЯрд┐рдХреЛрдг рд╕реЗ, рдпрд╣ рд╕реНрдЯрд╛рдЗрд▓ рдШрдЯрдХреЛрдВ рдХреЗ рд▓рд┐рдП рдмреЗрдХрд╛рд░ рд╣реИ ред
рд╡реЗрдм рд╡рд┐рдирд┐рд░реНрджреЗрд╢ рдХреЗ рдкреАрдЫреЗ рдХреЗ рд▓реЛрдЧ рдЗрд╕ рдореБрджреНрджреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдЬрд╛рдирддреЗ рд╣реИрдВ рдФрд░ рдЗрд╕реЗ _Web Components_ рдХреА рд╕реНрдерд╛рдиреАрдп рд╕реНрдХреЙрдкреНрдб рд╢реИрд▓реА рдХреЗ рд╕рд╛рде рд╕рдВрдмреЛрдзрд┐рдд рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░ рд░рд╣реЗ рд╣реИрдВред
рдХреНрдпрд╛ рдЖрдкрдиреЗ рдЙрди рд╕рднреА рдирдИ рдкрд░рд┐рдпреЛрдЬрдирд╛рдУрдВ рдкрд░ рдзреНрдпрд╛рди рджрд┐рдпрд╛ рд╣реИ рдЬрдм рд╕реЗ рд░рд┐рдПрдХреНрдЯ рдХреЛ рд╕реАрдПрд╕рдПрд╕ рдореЗрдВ рд╕реБрдзрд╛рд░ рдФрд░ рдШрдЯрдХ-рдЖрдзрд╛рд░рд┐рдд рд╢реИрд▓реА рд▓рд┐рдЦрдиреЗ рдХреЗ рдЖрд╕рдкрд╛рд╕ рд▓реЙрдиреНрдЪ рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛ред

рд╣рд╛рдВ, рдЕрдЧрд▓реА рд╢рд╛рдЦрд╛ jss рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реА рд╣реИ

@nathanmarks рдореИрдВ рдЗрд╕ рдмрджрд▓рд╛рд╡ рдХреЛ рдкрдХрдбрд╝рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд╣рд╛рдВ рдЬрд╛ рд╕рдХрддрд╛ рд╣реВрдВ?

рдпрд╣ рдкрд╛рдпрд╛: https://github.com/callemall/material-ui/blob/next/docs/customization/themes.md

@bramick рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ next рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ 0.15.0 рд╕реЗ рд╢реБрд░реВ рд╣реЛ рд░рд╣рд╛ рд╣реИ

рдареАрдХ рд╣реИ, рддреЛ рдореБрдЭреЗ рдпрд╛рдж рдЖ рд░рд╣рд╛ рд╣реИ рдХрд┐ рдирдпрд╛ рдХреНрдпрд╛ рд╣реИ ... рдХреЛрдИ рднреА?

@bramick next рдХреЛ рдЕрднреА рддрдХ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдкреНрд░рд▓реЗрдЦрд┐рдд рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ (рд╣рд╛рд▓рд╛рдБрдХрд┐ рдЗрд╕рдореЗрдВ рдкреНрд░рд▓реЗрдЦрди рд╕рд╛рдЗрдЯ рд╣реИ)ред рдЕрднреА рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЛ рд╕реНрд░реЛрдд рдкрдврд╝рдирд╛ рд╣реЛрдЧрд╛ рдФрд░ рдЖрдк рдкреНрд░рд▓реЗрдЦрди рд╕рд╛рдЗрдЯ рд╕реНрд░реЛрдд рдХреЛрдб рдХрд╛ рд╕рдВрджрд░реНрдн рд▓реЗ рд╕рдХрддреЗ рд╣реИрдВ рдХрд┐ рдпрд╣ рдХреИрд╕реЗ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред рдмрд╕ рдпрд╣ рдПрд╣рд╕рд╛рд╕ рд╣реИ рдХрд┐ рдпрд╣ рдЕрднреА рднреА рдПрдХ рдЪрд▓рддреА рд▓рдХреНрд╖реНрдп рд╣реЛ рд╕рдХрддрд╛ рд╣реИред

@oliviertassinari рд╡рд╛рд╣! рдореЗрдВ рдЧрд╣рд░рд╛рдИ рд╕реЗ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред

рдореИрдВ рдпрд╣ рдирд╣реАрдВ рдХрд╣ рд╕рдХрддрд╛ рдХрд┐ рдореИрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╕рд╣рдордд рд╣реВрдВ, рд▓реЗрдХрд┐рди рдЖрдкрдиреЗ рдореЗрд░реЗ рдХреБрдЫ рд╕рд╡рд╛рд▓реЛрдВ рдХреЛ рдЯрд╛рд▓ рджрд┐рдпрд╛ред

рдореИрдВ рд╕рд╣рдордд рд╣реВрдВ, рд╣рдореЗрдВ рдПрдХ рдРрд╕реА рджреБрдирд┐рдпрд╛ рдХреА рдУрд░ рдмрдврд╝рдирд╛ рдЪрд╛рд╣рд┐рдП, рдЬрд╣рд╛рдВ рд╣рдорд╛рд░реА рд╢реИрд▓реА рдШрдЯрдХ рдЖрдзрд╛рд░рд┐рдд рд╣реЛ, рдФрд░ рд╕реАрдПрд╕рдПрд╕ рдЙрд╕рдХреЗ рд▓рд┐рдП рдорд╣рд╛рди рдирд╣реАрдВ рд╣реИред рд╣рд╛рд▓рд╛рдБрдХрд┐, (рдореЗрд░реА рд░рд╛рдп рдореЗрдВ) рдЕрднреА рднреА рдХреБрдЫ рдЭреБрд░реНрд░рд┐рдпреЛрдВ рдХреЗ рд▓рд┐рдП рд▓реЛрд╣реЗ рдХреЛ рдмрд╛рд╣рд░ рдХрд░рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рд╣рдореЗрдВ рдЗрд╕реЗ рдмрдбрд╝реЗ рдкреИрдорд╛рдиреЗ рдкрд░ рдЕрдкрдирд╛рдирд╛ рдЪрд╛рд╣рд┐рдПред

рд╣рд╛рд▓рд╛рдВрдХрд┐ рдореИрдВ рдЙрддреНрд╕реБрдХ рд╣реВрдВ, рдХреНрдпрд╛ рдХрд┐рд╕реА рдиреЗ рдпрд╣ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рджреЗрдЦрд╛ рд╣реИ рдХрд┐ рдХреНрдпрд╛ рдЗрд╕ рдФрд░ рдорд╛рдирдХ рд╕реАрдПрд╕рдПрд╕ рдХреЗ рдмреАрдЪ рдХреЛрдИ рдкреНрд░рджрд░реНрд╢рди рдЕрдВрддрд░ рд╣реИ? рдореБрдЭреЗ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдкрд░ рдЕрднреА рднреА рдмрдврд╝рдд рд╣реЛ рд╕рдХрддреА рд╣реИ; рдЗрд╕реЗ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рдмрд╛рдж рднреА рдЗрд╕рдХреА рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЙрддреНрдкрдиреНрди рдХрд░рдирд╛ рдФрд░ рдЗрдВрдЬреЗрдХреНрдЯ рдХрд░рдирд╛ рд╣реИред

@gdaunton рдиреЗ jg рдХреЗ рдкреНрд░рджрд░реНрд╢рди рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ https://github.com/cssinjs/jss/blob/master/docs/performance.m рдкрд░ рдкрдврд╝рд╛

рдпрд╣ рдорд╛рдирдХ рд╕реАрдПрд╕рдПрд╕ рд╣реИ рдЬреИрд╕рд╛ рдХрд┐ рд░реЗрдВрдбрд░ рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ, рдкреЗрдЬ рдкрд░ рдЬреЛрдбрд╝рд╛ рдЧрдпрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдШрдЯрдХ рдХреЗ рднреАрддрд░ рд▓рд┐рдЦрд╛ рдЧрдпрд╛ рд╣реИред рдореИрдВ next рдмреНрд░рд╛рдВрдЪ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдФрд░ рдпрд╣ рдХрд╛рдлреА рдЕрдЪреНрдЫрд╛ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИред

@newoga рдХреНрдпрд╛ рдЖрдк рдореБрдЭреЗ рдПрдХ рд▓рд┐рдВрдХ рднреЗрдЬ рд╕рдХрддреЗ рд╣реИрдВ рдЬрд┐рд╕рдХрд╛ рдЖрдк рдЙрд▓реНрд▓реЗрдЦ рдХрд░ рд░рд╣реЗ рд╣реИрдВ?

@bramick OMG! рдпрд╣ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЖрд╕рд╛рди рд╣реИ, рд╣реИ рдирд╛? рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП, next рдореЗрдВ рдмрдЯрди рдХреЗ рд▓рд┐рдП рдпрд╣рд╛рдВ рджреЗрдЦреЗрдВ ред

рдореИрдВ JSX рдХреА рд╕рдлрд▓рддрд╛ рдХреЗ рдмрд╛рдж рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдлрд╝рд╛рдЗрд▓ рдХреЗ рдЕрдВрджрд░ CSS рдбрд╛рд▓рдиреЗ рдХреА рдЕрдкреАрд▓ рдХреЛ рд╕рдордЭрддрд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдЕрдЧрд░ рдХрд┐рд╕реА рдПрдкреНрд▓рд┐рдХреЗрд╢рди рдХреЗ рд╕рднреА CSS рдХреЗ рд╕рд╛рде рднреА рдРрд╕рд╛ рдХрд░рдирд╛ рдЕрдЪреНрдЫрд╛ рд╣реИред рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ JSS рдореЗрдВ рдХреБрдЫ рдЕрдЪреНрдЫреЗ рдЙрдкрдпреЛрдЧ рдХреЗ рдорд╛рдорд▓реЗ рд╣реИрдВ, рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЬрдм рд╕реБрдкрд░ рдЬрдЯрд┐рд▓ рдЧрддрд┐рд╢реАрд▓ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЗ рд╕рд╛рде рдХрд╛рдо рдХрд░рддреЗ рд╣реИрдВред

рдореЗрд░реА рд╕рдмрд╕реЗ рдмрдбрд╝реА рдЪрд┐рдВрддрд╛ рдпрд╣ рд╣реИ рдХрд┐ рд╢реИрд▓реА рдХреА рдЬрд╛рдирдХрд╛рд░реА рдШрдЯрдХ рдкрд░рд┐рднрд╛рд╖рд╛ рдХреЛ рдЕрдзрд┐рдХ рдХреНрд░рд┐рдпрд╛ рдФрд░ рд╡реНрдпрд╡рд╕реНрдерд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрдард┐рди рд╣реИ ред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП, рдкрд┐рдЫрд▓реЗ рдкреЛрд╕реНрдЯ рдореЗрдВ рд╕рдВрджрд░реНрднрд┐рдд Button рдШрдЯрдХ рдореЗрдВ, рд▓рдЧрднрдЧ рдЖрдзрд╛ рдХреЛрдб рд╢реИрд▓реА рдХреА рдЬрд╛рдирдХрд╛рд░реА рд╣реИред рдЕрдм рдХреЛрдИ рдЪрд┐рдВрддрд╛ рдХрд╛ рд╡рд┐рд╖рдп рдирд╣реАрдВ рд╣реИред рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рдЖрдк рд╢реИрд▓реА рдХреЛрдб рдХреЛ рдПрдХ рдЕрд▓рдЧ рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рд╕реНрдерд╛рдирд╛рдВрддрд░рд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рд▓реЗрдХрд┐рди рддрдм рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ рд╣реЛрдиреЗ рдХрд╛ рдХреЛрдИ рдорддрд▓рдм рдирд╣реАрдВ рд╣реИред

рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЗ рд▓рд┐рдП, рд╕рдмрд╕реЗ рдмрдбрд╝рд╛ рдиреБрдХрд╕рд╛рди рдпрд╣ рд╣реИ рдХрд┐ рд╡реЗ рд╕реАрдПрд╕рдПрд╕ рдЧреБрдгреЛрдВ рдФрд░ рдЙрдирдХреЗ рдореВрд▓реНрдпреЛрдВ рдХреЗ рд▓рд┐рдП рд╕рднреА рдЗрдВрдЯреЗрд▓реАрдЬреЗрдВрд╕ рдЬрд╛рдирдХрд╛рд░реА рдЦреЛ рджреЗрддреЗ рд╣реИрдВред рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ, рдореБрдЭреЗ рдпрд╣ рд╕рдм рдЕрдЪреНрдЫрд╛ рдХреЛрдб рд╕рдВрд░рдЪрдирд╛ рдФрд░ рдЕрднрд┐рд╡реНрдпрдВрдЬрдХ рдкрд╕рдВрдж рд╣реИ рдЬреЛ рдХрд┐ рд╕реАрдПрд╕рдПрд╕ рдкреНрд░реАрдкреНрд░реЛрд╕реЗрд╕рд░ рдЖрдкрдХреЛ рджреЗ рд╕рдХрддрд╛ рд╣реИ, рдЕрдЧрд░ рд╕рд╣реА рддрд░реАрдХреЗ рд╕реЗ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛рдПред

рдореБрдЭреЗ рдЕрдкрдиреА рдкрд░рд┐рдпреЛрдЬрдирд╛рдУрдВ рдореЗрдВ рдЬрдЯрд┐рд▓рддрд╛ рдЬреЛрдбрд╝рдиреЗ рдореЗрдВ рдХреЛрдИ рдЖрдкрддреНрддрд┐ рдирд╣реАрдВ рд╣реИ, рдЕрдЧрд░ рдпрд╣ рдЕрдзрд┐рдХ рдореВрд▓реНрдп рд▓рд╛рддрд╛ рд╣реИред рдЗрд╕рд▓рд┐рдП рдореИрдВрдиреЗ рдХрднреА рднреА рдЕрддрд┐рд░рд┐рдХреНрдд рд╕реАрдПрд╕рдПрд╕ рд▓рд╛рдЗрдирд░, рдкреНрд░реА-рдкреНрд░реЛрд╕реЗрд╕рд░, рд▓реЛрдбрд░ рдФрд░ рдЕрддрд┐рд░рд┐рдХреНрдд рд╕рд┐рдВрдЯреИрдХреНрд╕ рдХрд╛ рджрд┐рдорд╛рдЧ рдирд╣реАрдВ рд▓рдЧрд╛рдпрд╛ рдерд╛ рдЬреЛ рдореБрдЭреЗ рд╕реАрдЦрдирд╛ рдерд╛ред рдореИрдВ рдЬреЗрдПрд╕рдПрд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рднреА рдЦреБрд▓рд╛ рд░рд╣рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдпрд╣ рд╕рд┐рд░реНрдл рдЗрддрдирд╛ рд╣реИ рдХрд┐ рдкрд╣рд▓реА рдирдЬрд░ рдореЗрдВ рдпрд╣ рдореБрдЭреЗ рдирд╣реАрдВ рд╕рдордЭрд╛ред

рдореЗрд░реА рд╕рдмрд╕реЗ рдмрдбрд╝реА рдЪрд┐рдВрддрд╛ рдпрд╣ рд╣реИ рдХрд┐ рд╢реИрд▓реА рдХреА рдЬрд╛рдирдХрд╛рд░реА рдШрдЯрдХ рдкрд░рд┐рднрд╛рд╖рд╛ рдХреЛ рдЕрд╡реНрдпрд╡рд╕реНрдерд┐рдд рдХрд░ рджреЗрдЧреАред

рдпрд╣ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдЖрдк рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИ, рдЖрдк рдЕрдкрдиреЗ рдХреЛрдб рдХреЛ рдХреИрд╕реЗ рд╡реНрдпрд╡рд╕реНрдерд┐рдд рдХрд░рддреЗ рд╣реИрдВ, рдЗрд╕ рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИ рдпрджрд┐ рдЖрдк рдХреБрдЫ рдирд┐рдпрдореЛрдВ рд╕реЗ рдЪрд┐рдкрдХреЗ рд░рд╣рддреЗ рд╣реИрдВ, рддреЛ рдХреБрдЫ рднреА рдмреБрд░рд╛ рдирд╣реАрдВ рд╣реЛрддрд╛ (2 рд╕рд╛рд▓ рдХреЗ рдЙрддреНрдкрд╛рджрди рдЕрдиреБрднрд╡ рд╕реЗ рдмрд╛рдд рдХрд░рдирд╛)ред

рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╡рд╕реНрддреБрдУрдВ рдХреЗ рд╕рд╛рде рд╡реНрдпрдХреНрдд рд╕реАрдПрд╕рдПрд╕ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдХреНрд░рд┐рдпрд╛ рдФрд░ рд╡реНрдпрд╡рд╕реНрдерд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрдард┐рди рд╣реИред

рдпрд╣ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдХрдо рдХреНрд░рд┐рдпрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдЖрдкрдХреЗ рдкрд╛рд╕ рдХреЛрдб рдкреБрди: рдЙрдкрдпреЛрдЧ рдФрд░ рдЙрдЪреНрдЪ рдкреБрдирд░рд╛рд╡реГрддреНрддрд┐ рдХрд╛ рдЙрдЪреНрдЪ рд╕реНрддрд░ рд╣реИред

рдбреЗрд╡рд▓рдкрд░реНрд╕ рдХреЗ рд▓рд┐рдП, рд╕рдмрд╕реЗ рдмрдбрд╝рд╛ рдиреБрдХрд╕рд╛рди рдпрд╣ рд╣реИ рдХрд┐ рд╡реЗ рд╕реАрдПрд╕рдПрд╕ рдЧреБрдгреЛрдВ рдФрд░ рдЙрдирдХреЗ рдореВрд▓реНрдпреЛрдВ рдХреЗ рд▓рд┐рдП рд╕рднреА рдЗрдВрдЯреЗрд▓реАрдЬреЗрдВрд╕ рдЬрд╛рдирдХрд╛рд░реА рдЦреЛ рджреЗрддреЗ рд╣реИрдВред

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХреЗ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рдпрд╣рд╛рдВ рд▓рдХреНрд╖реНрдп рджреЗрдирд╛ рд╣реИ рдХрд┐ рд╡реЗ рд╕реНрдЯрд╛рдЗрд▓ рдХреЗ рд▓рд┐рдП рдЬреЛ рдЪрд╛рд╣реЗрдВ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВред CSS рдХреЗ рд▓рд┐рдП рд╕реНрд╡рддрдГ рдкреВрд░реНрдгрддрд╛ рдПрдХ рддрд░реНрдХ рд╣реИ рдЬрд┐рд╕реЗ рдореИрдВ рдЕрдХреНрд╕рд░ рд╕реБрдирддрд╛ рд╣реВрдВред рдЬреНрдпрд╛рджрд╛рддрд░ рдпрд╣ рдЙрди рд▓реЛрдЧреЛрдВ рд╕реЗ рдЖрддрд╛ рд╣реИ рдЬреЛ рдХрд┐рд╕реА рднреА cssinjs рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рддреЗ рдереЗ рдФрд░ рдЗрд╕рдХреЗ рд▓рд┐рдП рдХреБрдЫ рдЙрдкрдпреБрдХреНрддрддрд╛рдПрдВ рдЦреЛрдиреЗ рдХрд╛ рдбрд░ рдерд╛ рдЬреЛ рд╡реЗ рдХрд░рддреЗ рдереЗред

рдореБрдЭреЗ рдЕрдкрдиреА рдкрд░рд┐рдпреЛрдЬрдирд╛рдУрдВ рдореЗрдВ рдЬрдЯрд┐рд▓рддрд╛ рдЬреЛрдбрд╝рдиреЗ рдореЗрдВ рдХреЛрдИ рдЖрдкрддреНрддрд┐ рдирд╣реАрдВ рд╣реИ, рдЕрдЧрд░ рдпрд╣ рдЕрдзрд┐рдХ рдореВрд▓реНрдп рд▓рд╛рддрд╛ рд╣реИред

рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдкреВрд░рд╛ рдмрд┐рдВрджреБ рдЬрдЯрд┐рд▓рддрд╛ рдХреЛ рдХрдо рдХрд░ рд░рд╣рд╛ рд╣реИ рдФрд░ рдХреЛрдбрдмреЗрд╕ рдХреЛ рдЕрдзрд┐рдХ рд╕реБрд╕рдВрдЧрдд рдФрд░ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдФрд░ рд╕рдордЭрдиреЗ рдореЗрдВ рдЖрд╕рд╛рди рдмрдирд╛ рд░рд╣рд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдПрдХ рд╣реА рд╕рдордп рдореЗрдВ рд╕рднреА рдЬрдЯрд┐рд▓ рдкрд░рд┐рджреГрд╢реНрдп рдХрд╡рд░ рд╣реЛрддреЗ рд╣реИрдВред

рдореЗрд░реА рд╕рдмрд╕реЗ рдмрдбрд╝реА рдЪрд┐рдВрддрд╛ рдпрд╣ рд╣реИ рдХрд┐ рд╢реИрд▓реА рдХреА рдЬрд╛рдирдХрд╛рд░реА рдШрдЯрдХ рдкрд░рд┐рднрд╛рд╖рд╛ рдХреЛ рдЕрд╡реНрдпрд╡рд╕реНрдерд┐рдд рдХрд░ рджреЗрдЧреАред

рд╣рдорд╛рд░реА рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ рд╣рдордиреЗ рдЕрд▓рдЧ-рдЕрд▓рдЧ рдлрд╝рд╛рдЗрд▓реЛрдВ рдореЗрдВ рдШрдЯрдХреЛрдВ рдХреА рд╢реИрд▓реА рдХреА рдЬрд╛рдирдХрд╛рд░реА рдирд┐рдХрд╛рд▓реА рдФрд░ рдЙрдиреНрд╣реЗрдВ рд╡реЗрдмрдкреИрдХ рдХреЗ рд╕рд╛рде рд▓реЛрдб рдХрд┐рдпрд╛ред рдореБрдЦреНрдп рд▓рд╛рдн рдпрд╣ рд╣реИ рдХрд┐ рд╕рднреА рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рд╡реНрдпрд╡рд╕реНрдерд┐рдд рд╣реИ рдФрд░ рд╡реЗрдмрдкреИрдХ рдкреНрд░рддрд┐ рдШрдЯрдХ рдХреЛрдб рдХреЛ рдмрдВрдбрд▓ рдХрд░ рд╕рдХрддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдЬреЗрдПрд╕ рдХреЛрдб рдФрд░ рд╕реНрдЯрд╛рдЗрд▓ рдЬрд╛рдирдХрд╛рд░реА рдХрд╛ рдХреЛрдб рд╡рд┐рднрд╛рдЬрди рд╕рдВрднрд╡ рд╣реИред

рдЬрдм рдЖрдк рдЕрдкрдиреЗ рд╕реНрдЯрд╛рдЗрд▓ рдирд┐рдпрдореЛрдВ рдХрд╛ рдирд┐рд░реНрдорд╛рдг рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рддрд░реНрдХ рдХреЛ рдЕрд▓рдЧ рдХрд░рддреЗ рд╣реИрдВ, рддрдм рднреА рдЪрд┐рдВрддрд╛рдУрдВ рдХреЛ рдЕрд▓рдЧ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред рдПрдХ рдЙрджрд╛рд╣рд░рдг рдпрд╣ рд╣реИ, рдХрд┐ рд╣рдордиреЗ рд╕реНрдЯрд╛рдЗрд▓ рдлреИрдХреНрдЯреНрд░реА рдлрд╝рдВрдХреНрд╢рдВрд╕ рдХреА рд╢реБрд░реБрдЖрдд рдХреА, рдЬреЛ рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдЬреНрдЮрд╛рдд рд╕реАрдПрд╕рдПрд╕ рдкреНрд░реАрдкреНрд░реЛрд╕реЗрд╕рд░реЛрдВ рдореЗрдВ рдорд┐рдХреНрд╕рд┐рдиреНрд╕ рдХреА рддрд░рд╣ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдЙрддреНрдкрд╛рджрди рдХрд░рддреЗ рд╣реИрдВред
рдореЗрд░рд╛ рдХрд╣рдирд╛ рд╣реИ, рдХрд┐ рдЖрдк рдЕрдкрдиреЗ рд╕реНрд╡рдпрдВ рдХреЗ рд╡рд┐рд╢рд┐рд╖реНрдЯ рд╡рд░реНрдХрдлрд╝реНрд▓реЛ рдХреЛ рдореЙрдбрд▓ рдХрд░рдиреЗ рдФрд░ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдФрд░ рдЯреАрдо рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рд╕рд░реНрд╡реЛрддреНрддрдо рд░реВрдк рд╕реЗ рдЕрдиреБрдХреВрд▓ рдмрдирд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрддрдирд╛ рдЕрдзрд┐рдХ рд▓рдЪреАрд▓рд╛рдкрди рдкреНрд░рд╛рдкреНрдд рдХрд░рддреЗ рд╣реИрдВред

рдпрд╣ рдЬрд╛рдБрдЪ рдХрд░реЗрдВ

рдЦреЗрд▓ рдореЗрдВ рдкреНрд░реМрджреНрдпреЛрдЧрд┐рдХрд┐рдпреЛрдВ рдХреЛ рдмрджрд▓рдиреЗ рдореЗрдВ рдмрд╣реБрдд рджреЗрд░ рд╣реЛ рдЪреБрдХреА рд╣реИ, рд▓реЗрдХрд┐рди рдореИрдВ рдорд╛рдирддрд╛ рд╣реВрдВ рдХрд┐ рд╕реНрдЯрд╛рдЗрд▓-рдШрдЯрдХреЛрдВ рдХреЛ рдмрд╣реБрдд рдЖрд╢рд╛рдЬрдирдХ рд╣реИред SSR, рдореАрдбрд┐рдпрд╛ рдХреНрд╡реЗрд╢реНрдЪрди, рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рд╡рд╛рдХреНрдпрд╡рд┐рдиреНрдпрд╛рд╕ рд╡рдЧреИрд░рд╣ рдХреЛ рд╣реИрдВрдбрд▓ рдХрд░рддрд╛ рд╣реИред JSS рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдпрд╣ рдСрдЯреЛрдкреНрд░рд┐рдХреНрд╕рд┐рдВрдЧ рдФрд░ рдереАрдорд┐рдВрдЧ рдХреЛ рднреА рд╣реИрдВрдбрд▓ рдХрд░рддрд╛ рд╣реИред

рдЬрд╣рд╛рдБ рддрдХ рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдЕрдВрджрд░ рдкреЛрд╕реНрдЯрд░реНрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИ, рдЬреЛ рд░рдирдЯрд╛рдЗрдо рдХреЗ рд╕рдордп рдЙрдкрдпреЛрдЧ рд╣реЛрдиреЗ рдкрд░ рд╕реНрд╡реАрдХрд╛рд░реНрдп рдкреНрд░рджрд░реНрд╢рди рдирд╣реАрдВ рджреЗрдЧрд╛, рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдПрдХ рдлреБрд▓ рд╕реАрдПрд╕рдПрд╕ рдкрд╛рд░реНрд╕рд░ рд╣реИ рдЬрд┐рд╕рдореЗрдВ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдПрдЬ рдХреЗрд╕ рд╣реИрдВрдбрд▓рд┐рдВрдЧ рдФрд░ рдкреНрд▓рдЧ рдЗрди рд╣реИрдВред рдореИрдВ рдЗрд╕реЗ JSS JSON рдХреЛ рдкреНрд░реАрдкреНрд░реЛрд╕реЗрд╕ рдХрд░рдиреЗ рдХреА рдХрд▓реНрдкрдирд╛ рдХрд░ рд╕рдХрддрд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдИрдорд╛рдирджрд╛рд░ рд╣реЛрдиреЗ рдХреЗ рд▓рд┐рдП рдореБрдЭреЗ CSS рднрд╛рд╖рд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдФрд░ JS рд╡реИрд░рд┐рдПрдмрд▓ рдФрд░ рдлрд╝рдВрдХреНрд╢рди рдХреЙрд▓ рдХреЗ рд╕рд╛рде рдорд┐рд╢реНрд░рдг рдХрд░рдиреЗ рдореЗрдВ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдореВрд▓реНрдп рдирд╣реАрдВ рджрд┐рдЦрддрд╛ рд╣реИред

рдмрд╕ рдЙрд▓реНрд▓реЗрдЦ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП, рд╕реНрдЯрд╛рдЗрд▓-рдШрдЯрдХреЛрдВ рдХрд╛ рд╡рд░реНрддрдорд╛рди рдирд┐рд░реНрдорд╛рдг 250kb рд╣реИ, рдЬреЛ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдЫреЛрдЯрд╛ рд╣реИ ред рдирд┐рд╖реНрдкрдХреНрд╖ рд╣реЛрдиреЗ рдХреЗ рд▓рд┐рдП рдХреНрдпреЛрдВрдХрд┐ рд╡реЗ рд░рд┐рдПрдХреНрдЯ рдФрд░ рд╕рд╣ рдХреЛ рдмрдВрдбрд▓ рдХрд░рддреЗ рд╣реИрдВ, рд▓реЗрдХрд┐рди рдлрд┐рд░ рднреА, рдпрд╣рд╛рдВ рддрдХ тАЛтАЛрдХрд┐ рдЕрдХреЗрд▓реЗ рдкреЛрд╕реНрдЯрд╕реАрдПрд╕рдПрд╕ рдХреЗ рдкрд╛рд░реНрд╕рд░ рдореЗрдВ 13 рдХреЗрдмреА (рдЕрдирдордиреАрдХреГрдд, 2kb ~ рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ) рдЬреЛ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рд▓рдЧрднрдЧ рдЬреЗрдПрд╕рдПрд╕ рдпрд╛ рдлреЗрд▓рд╛ рдХреЗ рдЖрдХрд╛рд░ рдХрд╛ рд╣реИред

рдпрд╣ (рдкреНрд░рд╕реНрддреБрддрд┐) рдШрдЯрдХ рдХреЗ рддреНрд╡рд░рд┐рдд рдФрд░ рд╕рд░рд▓ рдкреНрд░реЛрдЯреЛрдЯрд╛рдЗрдк рдХреЗ рд▓рд┐рдП рд╣рд╛рд▓рд╛рдВрдХрд┐ рдкреНрдпрд╛рд░рд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдХреЛрдИ рд▓рд╛рдн рдирд╣реАрдВ рджрд┐рдЦрддрд╛ рд╣реИ / рдЕрдиреНрдп рд╕рдорд╛рдзрд╛рди рдкреНрд░рджрд╛рди рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рдореИрдВ рд╕рд╣рдордд рд╣реВрдБ, рдореИрдВрдиреЗ рдЗрд╕реЗ рдПрдХ рдкреБрд╕реНрддрдХрд╛рд▓рдп рдореЗрдВ рд╡рд┐рдХрд╕рд┐рдд рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА, рдЬрд┐рд╕реЗ рдкреНрд░рдХрд╛рд╢рд┐рдд рдХрд░рдирд╛ рдмрд╣реБрдд рднрд╛рд░реА рдерд╛ред рдореБрдЭреЗ рдпрдХреАрди рд╣реИ рдХрд┐ рд╡реЗ рдЗрд╕рдХреЗ рд╕рд╛рде рдкреНрд░рдЧрддрд┐ рдХрд░реЗрдВрдЧреЗ, рд▓реЗрдХрд┐рди рдРрд╕рд╛ рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рдХрд┐ рдпрд╣рд╛рдВ рдЬреЗрдПрд╕рдПрд╕ рдХрд╛ рдХрд╛рдо рд▓рдЧрднрдЧ рдкреВрд░рд╛ рд╣реЛ рдЪреБрдХрд╛ рд╣реИ рдФрд░ рдЕрдзрд┐рдХрд╛рдВрд╢ рд╕рдорд╛рди рд▓рд╛рдн рдкреНрд░рджрд╛рди рдХрд░рддреЗ рд╣реИрдВред

рдореИрдВрдиреЗ рд╣рд╛рд▓ рд╣реА рдореЗрдВ рд░рд┐рдПрдХреНрд╢рди-рдЯреВрд▓рдмреЙрдХреНрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рд╣реИ, рд╡реЗ рдереАрдо рдХреЗ рд▓рд┐рдП CSS рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ рдЬреЛ рдореВрд▓ рд░реВрдк рд╕реЗ рд╕рд┐рд░реНрдл webpack рдХреЗ sassLoader рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИред рдореЗрд░реЗ рд▓рд┐рдП рдпрд╣ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдХрд╛рдо рдХрд┐рдпрд╛ред рд╢рд╛рдпрдж рдпрд╣ рдЬрд╛рдВрдЪ рдХреЗ рд▓рд╛рдпрдХ рд╣реИред

рдЕрд░реЗ, рдореБрдЭреЗ @mgcrea рдХреА рд░рд╛рдп рдХреЛ рджреВрд╕рд░рд╛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЯреВрд▓рдмреЙрдХреНрд╕ рдереАрдорд┐рдВрдЧ рд╕рдкреЛрд░реНрдЯ рдмрд╕ рдЕрджреНрднреБрдд рд╣реИ - рдЗрд╕ рдмрд╛рдд рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░рдиреЗ рдХреЗ рд░реВрдк рдореЗрдВ рдХрд┐ рдШрдЯрдХ рдХреИрд╕реЗ рджрд┐рдЦрддреЗ рд╣реИрдВ рдлреНрд░рдВрдЯрдПрдВрдб рд╕реНрдЯреЛрд░реА рдХрд╛ рд╕рдмрд╕реЗ рдорд╣рддреНрд╡рдкреВрд░реНрдг рдкрд╣рд▓реВ рд╣реИред

рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рдХрд┐рд╕реА рдХреЛ рднреА рдХрднреА рднреА рдЕрдЪреНрдЫреЗ рдкреБрд░рд╛рдиреЗ CSS рд╕реНрдЯрд╛рдЗрд▓ рдХреА рдЙрдореНрдореАрдж рдХрд░рдиреА рдЪрд╛рд╣рд┐рдП, рдХрднреА рд╕рд╛рдордЧреНрд░реА рдпреВрдЖрдИ рдореЗрдВ рдкреНрд░рдердо рд╢реНрд░реЗрдгреА рдХрд╛ рдирд╛рдЧрд░рд┐рдХ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдП, рдпрд╣реА рдХрд╛рд░рдг рд╣реИ рдХрд┐ react-toolbox рд╢реБрд░реВ рдХрд┐рдпрд╛ рдЧрдпрд╛ рдерд╛

рдЗрд╕ рд╡рд┐рд╖рдп рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╣реБрдд рд╕рд╛рд░реЗ рдореБрджреНрджреЛрдВ рдФрд░ рдкреЛрд╕реНрдЯреЛрдВ рдХреЛ рдкрдврд╝рдиреЗ рдХреЗ рдмрд╛рдж рдХрдо рд╕реЗ рдХрдо рдореЗрд░реА рдзрд╛рд░рдгрд╛ рд╣реИред рдореИрдВ рдЕрд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдЙрди рдЪреАрдЬреЛрдВ рдХреЛ рдпрд╛рдж рдХрд░ рд╕рдХрддрд╛ рд╣реВрдВ, рдЬреИрд╕реЗ рдЯреАрдо рдмреЗрд╣рддрд░ рд░рд┐рдПрдХреНрдЯрд┐рд╡ рдиреЗрдЯрд┐рд╡ рдХрдореНрдкреИрдЯрд┐рдмрд┐рд▓рд┐рдЯреА рдФрд░ рд╕реНрдЯрд╛рдЗрд▓ рдПрдЬ рдХреЗ рдорд╛рдорд▓реЛрдВ рдкрд░ рдХрдИ рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдВ рдХрд░рддреА рд╣реИрдВ рдЬреЛ рдЬреЗрдПрд╕рдПрд╕ рдХреЗ рд╕рд╛рде рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрд╕рд╛рди рд╣реИрдВред

рд╣рд╛рд▓рд╛рдБрдХрд┐ рд╡рд╣ рдЬрд╛рдирдХрд╛рд░реА рдХрдИ рдЪрд░реНрдЪрд╛рдУрдВ рдХреЗ рдмреАрдЪ рдЦреЛ рдЬрд╛рддреА рд╣реИред рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдПрдХ рдРрд╕рд╛ рд╡рд┐рд╡рд╛рджрд╛рд╕реНрдкрдж рд╡рд┐рд╖рдп рд╣реИ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдЕрд╡рд┐рд╢реНрд╡рд╕рдиреАрдп рдореВрд▓реНрдп рдХрд╛ рд╣реЛрдЧрд╛ рдпрджрд┐ рдХреЛрдИ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рд▓рдХреНрд╖реНрдпреЛрдВ рдФрд░ рджрд░реНрд╢рди рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╡рд┐рдХреА рдкреЗрдЬ (рдХреЛрд░ рдореЗрдВрдЯреЗрдирд░ рджреНрд╡рд╛рд░рд╛ рд▓рд┐рдЦрд┐рдд) рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ, рдЗрд╕ рдкрд░ рдПрдХ рдордЬрдмреВрдд рдЯрд┐рдкреНрдкрдгреА рдХреЗ рд╕рд╛рде рдХрд┐ рдХреНрдпреЛрдВ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╕реНрдЯрд╛рдЗрд▓ рдЗрддрдиреА рдШрдиреАрднреВрдд рд╣реИ рдврд╛рдВрдЪрд╛ред

рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд╕рд╛рдордЧреНрд░реА рдпреВрдЖрдИ рдкрд╕рдВрдж рдХрд░рддрд╛ рд╣реВрдВ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рд░рд┐рдПрдХреНрдЯ рдХреЗ рд▓рд┐рдП рд╕рдмрд╕реЗ рд╕рдХреНрд░рд┐рдп рдФрд░ рдкреЙрд▓рд┐рд╢ рд╕рд╛рдордЧреНрд░реА рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ рдлреНрд░реЗрдорд╡рд░реНрдХ рд╣реИред рд╣рд╛рд▓рд╛рдБрдХрд┐, рдЬрдм рдореИрдВ рдерд░реНрдб рдкрд╛рд░реНрдЯреА рдХрдВрдкреЛрдиреЗрдВрдЯреНрд╕ рдХреЗ рд╕рд╛рде рдпреВрдирд┐рдлрд╛рдЗрдб рд╕реНрдЯрд╛рдЗрд▓ рд░рдЦрдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдБ рддреЛ JSS рдореЗрд░реЗ рд▓рд┐рдП рдмрд╣реБрдд рд╕рд╛рд░реЗ рд╕рд┐рд░рджрд░реНрдж рдХрд╛ рдХрд╛рд░рдг рдмрдирддрд╛ рд╣реИред

рдЦреБрдж рдХреЗ рд▓рд┐рдП, рдореИрдВ рдЬрд┐рд╕ рддрд░рд╣ рд╕реЗ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рдХреЛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЯреВрд▓рдмреЙрдХреНрд╕ рдЬреИрд╕реА рдХрд┐рд╕реА рдЪреАрдЬ рдХреЗ рд╡рд┐рдкрд░реАрдд рд╕реНрдЯрд╛рдЗрд▓ рдХрд░рддрд╛ рд╣реВрдВ, рдЙрд╕рдХреА рд╕рд░рд╛рд╣рдирд╛ рдХрд░рддрд╛ рд╣реВрдВ рдФрд░ рдпрд╣рд╛рдВ рдмрддрд╛рдпрд╛ рдЧрдпрд╛ рд╣реИ: рд╣рдорд╛рд░реА рдПрдХ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ, рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдХреЗ рд▓рд┐рдП рдЧрддрд┐рд╢реАрд▓ рдереАрдо рдЪреБрдирдиреЗ рдХреА рдХреНрд╖рдорддрд╛ рд╣реИ:

Imgur

рдХреНрдпреЛрдВрдХрд┐ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдПрдХ рдРрд╕реЗ рд░рдВрдЧ рдХреА рдЬреЛрдбрд╝реА рдХрд╛ рдЪрдпрди рдХрд░ рд╕рдХрддрд╛ рд╣реИ рдЬрд┐рд╕реЗ рд╣рдо рд╕рдордп рд╕реЗ рдкрд╣рд▓реЗ рдирд┐рд░реНрдзрд╛рд░рд┐рдд рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рдЬреЛ рднреА рдпреЛрдЬрдирд╛ рд╣рдо рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ рд╡рд╣ рдЕрддреНрдпрдзрд┐рдХ рдЧрддрд┐рд╢реАрд▓ рд╣реЛрдиреА рдЪрд╛рд╣рд┐рдПред рд╕рд╛рде рдореЗрдВ, рд╡рд┐рд╖рдп рдореЗрдВ рдкрд░рд┐рд╡рд░реНрддрди рд▓рд╛рдЗрд╡ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ, b / c рд╕рднреА рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЗрдирд▓рд╛рдЗрди рдЙрддреНрдкрдиреНрди рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ: рдореБрдЭреЗ рдХреЗрд╡рд▓ рдЗрддрдирд╛ рдХрд░рдирд╛ рд╣реИ рдХрд┐ рдЗрд╕реЗ рдкреНрд░рд╛рдердорд┐рдХ / рдЙрдЪреНрдЪрд╛рд░рдг рд░рдВрдЧ рджреЗрдВред

рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЯреВрд▓рдмреЙрдХреНрд╕ рдПрдЯ рдореЗрдВред рдЕрд▓ред, рдпрд╣ рдореИрдВ рдХреНрдпрд╛ рджреЗрдЦ рд╕рдХрддрд╛ рд╣реИ рд╕реЗ рдПрдХ рдШрд░ рдХрд╛ рдХрд╛рдо рдХреЗ рдЕрдзрд┐рдХ рд▓рдЧрддрд╛ рд╣реИред

рдЗрд╕ рдЦрд╛рд╕ рдорд╛рдорд▓реЗ рдореЗрдВ @jrop рдпрд╛рдиреЗ рдЖрдкрдХреЛ рдбрд╛рдпрдирд╛рдорд┐рдХ JSS рдХреА рдЬрд╝рд░реВрд░рдд рд╣реИ рд▓реЗрдХрд┐рди рдХрдИ рдЕрдиреБрдкреНрд░рдпреЛрдЧреЛрдВ рдХреЗ рд▓рд┐рдП рдЬреЛ рдПрдХ рдорд╣рддреНрд╡рдкреВрд░реНрдг рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ рдФрд░ рдХрд╕реНрдЯрдорд╛рдЗрдЬрд╝ рдХрд░рдиреЗ рдХреА рд╡рд░реНрддрдорд╛рди рдХрд╣рд╛рдиреА (UI рдкрд░реАрдХреНрд╖рдг рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рднреА рдирд╣реАрдВ рдмреЛрд▓рдирд╛) рд╕рд╛рдордЧреНрд░реА-рдЙрдИ рдмрд╕ рд╕реНрд╡реАрдХрд╛рд░реНрдп рдирд╣реАрдВ рд╣реИред рд╣рдо рдПрдХ рдЕрддреНрдпрдзрд┐рдХ рджреГрд╢реНрдп рдФрд░ рдбрд┐рдЬрд╝рд╛рдЗрди рдХрд┐рдП рдЧрдП рдРрдк рдХрд╛ рдирд┐рд░реНрдорд╛рдг рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдЬреЛ рдХреЗрд╡рд▓ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рд▓реБрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рдХреНрдпреЛрдВрдХрд┐ рд╣рдореЗрдВ рдЗрд╕рдХреЗ рд╡реНрдпрд╡рд╣рд╛рд░ рднрд╛рдЧреЛрдВ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ / рдЪрд╛рд╣рддреЗ рд╣реИрдВред

@DominikGuzei рдЖрдк next рд╢рд╛рдЦрд╛ рдХреЛ рдЕрдиреБрдХреВрд▓рд┐рдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рдпрд╣ _not_ рд╣реИ рдЬрд┐рд╕реЗ рдЖрдк рд╡рд░реНрддрдорд╛рди рд░рд┐рд▓реАрдЬрд╝ рдкрд░ рджреЗрдЦрддреЗ рд╣реИрдВред

рджреЛрд╕реНрддреЛрдВ, рдореБрдЭреЗ рдРрд╕рд╛ рд▓рдЧ рд░рд╣рд╛ рд╣реИ рдХрд┐ рд╣рдо рдпрд╣рд╛рдБ рдПрдХ рдорд░реЗ рд╣реБрдП рдШреЛрдбрд╝реЗ рдХреЛ рдкреАрдЯ рд░рд╣реЗ рд╣реИрдВред next рд╢рд╛рдЦрд╛ рдиреЗ рдереАрдорд┐рдВрдЧ рдХреЗ рд╕рд╛рде рдПрдХ рдЕрд▓рдЧ (рдмрд╣реБрдд рдмреЗрд╣рддрд░) рдкрде рдЪреБрдирд╛ рд╣реИ рдФрд░ рдУрд╡рд░рд░рд╛рдЗрдб рдХреЗ рд▓рд┐рдП рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИред рдпрд╣ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИ рдФрд░ рдореИрдВрдиреЗ рдЬреЛ рдЕрдиреБрд░реЛрдз рджреЗрдЦрд╛ рд╣реИ рд╡рд╣ рд▓рдЪреАрд▓рд╛рдкрди рдкреНрд░рджрд╛рди рдХрд░рддрд╛ рд╣реИред рдЕрдиреНрдп рд▓реЛрдЧреЛрдВ рдХреЗ рд▓рд┐рдП рдЬреЛ рдЕрдзрд┐рдХ рдХрд╕реНрдЯрдорд╛рдЗрдЬрд╝реЗрдмрд┐рд▓рд┐рдЯреА рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рд╡реЗ next рдШрдЯрдХреЛрдВ рдкрд░ HOC рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ рдЕрдкрдиреА рдЦреБрдж рдХреА рд╕реНрдЯрд╛рдЗрд▓рд╢реАрдЯ рд▓рд┐рдЦ рд╕рдХрддреЗ рд╣реИрдВред

@nathanmark , рдЬрдм рд╕реЗ рдпрд╣ рдирд┐рд░реНрдгрдп рдХрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ (рдЬрд╣рд╛рдБ рддрдХ рдореИрдВ рдмрддрд╛ рд╕рдХрддрд╛ рд╣реВрдБ, рдФрд░ рдХрд╛рдлреА рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ)

рдЕрдЧрд░ рдХреЛрдИ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рд▓рдХреНрд╖реНрдпреЛрдВ рдФрд░ рджрд░реНрд╢рди рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╡рд┐рдХреА рдкреЗрдЬ (рдХреЛрд░ рдореЗрдВрдЯреЗрдирд░ рджреНрд╡рд╛рд░рд╛ рд▓рд┐рдЦрд┐рдд) рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ, рддреЛ рдЗрд╕ рдмрд╛рдд рдкрд░ рдПрдХ рдордЬрдмреВрдд рдЯрд┐рдкреНрдкрдгреА рдХреЗ рд╕рд╛рде рдХрд┐ рдХреНрдпреЛрдВ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╕реНрдЯрд╛рдЗрд▓ рдХреЛ рдлреНрд░реЗрдорд╡рд░реНрдХ рдореЗрдВ рдмрд╛рдВрдзрд╛ рдЧрдпрд╛ рд╣реИред

@fgarcia рдореИрдВрдиреЗ рдЗрд╕ рд╕рдкреНрддрд╛рд╣ рдХреА рд╢реБрд░реБрдЖрдд рдореЗрдВ рдкреЗрд░рд┐рд╕ рдореЗрдВ рдПрдХ рд╕реНрдерд╛рдиреАрдп рдХрд╛рд░реНрдпрдХреНрд░рдо рдореЗрдВ рд╕рд╛рдордЧреНрд░реА-рдпреВрдЖрдИ рджреНрд╡рд╛рд░рд╛ рдЙрдкрдпреЛрдЧ рдХрд┐рдП рдЧрдП рд╕реНрдЯрд╛рдЗрд▓ рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЗ рд╡рд┐рдХрд╛рд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдПрдХ рдкреНрд░рд╕реНрддреБрддрд┐ рджреА рд╣реИред рдЖрдкрдХреЛ рд╕реНрд▓рд╛рдЗрдб рдФрд░ _notes_: A рдЬрд░реНрдиреА рдХреЛ рдмреЗрд╣рддрд░ рдЕрдВрджрд╛рдЬ рдореЗрдВ рджреЗрдЦрдиреЗ рдХрд╛ рд╢реМрдХ рд╣реЛ рд╕рдХрддрд╛

рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдЧрддрд┐рд╢реАрд▓ рд╡рд┐рд╖рдпреЛрдВ рдХрд╛ рдЪрдпрди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП

CSS-Modules рдХреЗ рд╕реНрдЯреИрдЯрд┐рдХ рд╕реНрдЯрд╛рдЗрд▓ рдЬрдирд░реЗрд╢рди рдкрд╣рд▓реВ рдХреЗ рдХреБрдЫ рдкрд░рд┐рдгрд╛рдо рд╣реИрдВред
рд░рдирдЯрд╛рдЗрдо рдкрд░ рдЗрдВрдЬреЗрдХреНрд╢рди рд▓рдЧрд╛рдиреЗ рдХреА рд╢реИрд▓реА рдХрдо рд▓рд╛рдЧрдд рд╡рд╛рд▓реА рд╣реИ, рд▓реЗрдХрд┐рди рд╣рдореЗрдВ рдЗрд╕рдХреА рдЕрдиреБрдорддрд┐ рджреЗрдВ:

  • рд╢реИрд▓реА рдХреЗ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЗ рд╕рд╛рде рд╣рдореЗрдВ рдЕрдзрд┐рдХ рд▓рдЪреАрд▓рд╛рдкрди рджреЗрддрд╛ рд╣реИред рдЬреИрд╕реЗ CircularProgress рдХрд╛ рдПрдХ рдирд┐рд╢реНрдЪрд┐рдд thickness рдЬреЛ рд╕реАрдПрд╕рдПрд╕ рдХреАрдлрд╝реНрд░реЗрдо рдПрдиреАрдореЗрд╢рди рдХреЛ рдХреИрд╕реЗ рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред рдЧрддрд┐рд╢реАрд▓ рд╢реИрд▓реА рдХреЗ рд╕рд╛рде, рд╣рдо рдПрдХ рдореЛрдЯрд╛рдИ рдЧреБрдг рдЬреЛрдбрд╝ рд╕рдХрддреЗ рд╣реИрдВ рддрд╛рдХрд┐ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рдореВрд▓реНрдп рдХреЛ рдЧрддрд┐рд╢реАрд▓ рд░реВрдк рд╕реЗ рдмрджрд▓ рд╕рдХреЗрдВред тЪая╕П рдЧрд╛рд▓реА рдирд╣реАрдВ рджреЗрдирд╛ рд╣реИред
  • рдмрдбрд╝реЗ рдкреИрдорд╛рдиреЗ рдкрд░ рдРрдк рдкрд░, рдпрд╣ рд╕реНрдХреНрд░реАрди рдкрд░ рдкреНрд░рджрд░реНрд╢рд┐рдд рдШрдЯрдХ рдХреЗ рд▓рд┐рдП рдХреЗрд╡рд▓ рдЖрд╡рд╢реНрдпрдХ рд╢реИрд▓рд┐рдпреЛрдВ рдХреЛ рдЗрдВрдЬреЗрдХреНрдЯ рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИред рдкреГрд╖реНрда рдХреЛ рдмреВрдЯрд╕реНрдЯреНрд░реИрдк рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмреНрд░рд╛рдЙрдЬрд╝рд░ рджреНрд╡рд╛рд░рд╛ рдЖрд╡рд╢реНрдпрдХ рдХрд╛рдо рдХреА рдорд╛рддреНрд░рд╛ рдХреЛ рдХрдо рдХрд░рдирд╛ред рдЗрд╕рд▓рд┐рдП, рдмрд╛рддрдЪреАрдд рдХреЗ рдмрд╛рдж рдкрд╣рд▓реЗ рдкреЗрдВрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рддреЗрдЬрд╝ рд╕рдордпред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП SSR рдХреЗ рд╕рд╛рде рдЧрдВрднреАрд░ рд╕реАрдПрд╕рдПрд╕ inliningред
  • рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ рдЧрддрд┐рд╢реАрд▓ рд╡рд┐рд╖рдп рдФрд░ рдШрдЯрдХреЛрдВ рдХреА рднрд┐рдиреНрдирддрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрдВред рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдПрдХ рдмрдЯрди рдХрд╛ рд░рдВрдЧ рдмрджрд▓рдирд╛ рдЬрд┐рд╕рдореЗрдВ рд╕рднреА рд░рдВрдЧ рднрд┐рдиреНрдирддрд╛рдПрдВ рд╣реЛрдВред

@oliviertassinari рдпрд╣ рд╕реБрдирдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдмрдврд╝рд┐рдпрд╛ рд╣реИред рдореЗрд░реЗ рдкрд╛рд╕ рд╕реАрдПрд╕рдПрд╕ рдореЙрдбреНрдпреВрд▓ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдПрдХ рдЧреИрд░-рдорд╛рдирдХ рдмрд┐рдВрджреБ-рджреГрд╢реНрдп рд╣реЛ рд╕рдХрддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рд╡реЗ рд╕рднреА рдЙрдкрджреНрд░рд╡ рдХреЗ рд▓рд╛рдпрдХ рд╣реИрдВред рдореИрдВ рдЗрд╕ рдХрд╛рд░рдг рд╕реЗ рд╕рд╛рдордЧреНрд░реА-рдпреВрдИ рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдЬреЗрдПрд╕рдПрд╕ рдХреЛ рд╕реБрдирдиреЗ рдХреЗ рд▓рд┐рдП рдЙрддреНрд╕рд╛рд╣рд┐рдд рдерд╛ред рдпрд╣ рд╕реАрдПрд╕рдПрд╕ рдореЙрдбреНрдпреВрд▓ рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЗ рджрд░реНрд╢рди рдХреЗ рд╕рд╛рде рдмрд╣реБрдд рдЕрдзрд┐рдХ рдЗрдирд▓рд╛рдЗрди рд▓рдЧрддрд╛ рд╣реИред

@oliviertassinari рд▓рд╛рднреЛрдВ рдХреЗ рд╕рд╛рд░рд╛рдВрд╢ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред рдЬрдм рдЖрдк рдЗрди рдкрд╣рд▓реБрдУрдВ рдХреЛ рджреЗрдЦрддреЗ рд╣реИрдВ рддреЛ рдпрд╣ рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рджрд┐рд▓рдЪрд╕реНрдк рд╣реЛрддрд╛ рд╣реИред рдЗрд╕ рд╕рдордп JSS рдФрд░ рдЗрд╕рдХреЗ рдЗрдХреЛрд╕рд┐рд╕реНрдЯрдо рдХрд╛ рднреА рдирдХрд╛рд░рд╛рддреНрдордХ рдкрдХреНрд╖ рдпрд╣ рд╣реИ рдХрд┐ рдпрд╣ рд╕рдм рдЦреВрди рдмрд╣ рд░рд╣рд╛ рд╣реИ рдФрд░ рдЖрдк рд╕рд╛рдзрд╛рд░рдг рд╕реАрдПрд╕рдПрд╕-рдореЙрдбреНрдпреВрд▓ + рдПрд╕рдПрдПрд╕рдПрд╕ рдХреЗ рд╕рд╛рде рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рд╕реНрдерд╛рдкрд┐рдд рдЯреВрд▓ рдЪреЗрди рдФрд░ рдиреЙрд▓реЗрдЬ рдмреЗрд╕ рдкрд░ рднрд░реЛрд╕рд╛ рдирд╣реАрдВ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред рд▓реЗрдХрд┐рди рдпрд╣ рд╡рд╣ рдХреАрдордд рд╣реИ рдЬреЛ рдЖрдк рдирд╡рд╛рдЪрд╛рд░ рдХреЗ рд▓рд┐рдП рднреБрдЧрддрд╛рди рдХрд░рддреЗ рд╣реИрдВ, рдпрд╣ рд╕рд┐рд░реНрдл рдЗрд╕ рдмрд╛рдд рдкрд░ рдирд┐рд░реНрднрд░ рдХрд░рддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреА рдХреБрдЫ рдЖрд╡рд╢реНрдпрдХрддрд╛рдПрдВ рд╣реИрдВ / рдмрдЧреНрд╕ рдХреА рдХреАрдордд рдФрд░ рдХрдо рджрд╕реНрддрд╛рд╡реЗрдЬ рд╡рд╛рд▓реЗ рдкрде рдХрд╛ рднреБрдЧрддрд╛рди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рддреИрдпрд╛рд░ рд╣реИрдВред

JSS рдХреЛ css- рдореЙрдбреНрдпреВрд▓ рд╕реЗ рдкрд╣рд▓реЗ рдмрдирд╛рдпрд╛ рдЧрдпрд╛ рд╣реИред рд╕реАрдПрд╕рдПрд╕-рдореЙрдбреНрдпреВрд▓ рддреЗрдЬреА рд╕реЗ рд▓реЛрдХрдкреНрд░рд┐рдп рд╣реЛ рдЧрдП рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдЗрд╕рдиреЗ рдЕрдзрд┐рдХрд╛рдВрд╢ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЗ рд▓рд┐рдП рдПрдХ рд╕рдорд╕реНрдпрд╛ рдХреЛ рд╣рд▓ рдХрд░ рджрд┐рдпрд╛ рд╣реИ рдмрд┐рдирд╛ рд╡рд╛рдХреНрдпрд╡рд┐рдиреНрдпрд╛рд╕ рдХреЛ рднреА рдореМрд▓рд┐рдХ рд░реВрдк рд╕реЗ рдмрджрд▓ рджрд┐рдПред

рдХрд╣рд╛ рдЬрд╛ рд░рд╣рд╛ рд╣реИ, рдЖрдк рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рдЬреЛ рдереЛрдбрд╝реЗ "рдирдИ" рддрдХрдиреАрдХ рднреА рд╣реИред рдпрджрд┐ рдЖрдк SASS рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рддреЛ рд╢рд╛рдпрдж рдЖрдкрдХреЛ рд╡рд╛рдиреАрд▓рд╛рдЬ рдпрд╛ рдмреИрдХрдмреЛрдирдЬ рднреА рдЪреБрдирдирд╛ рдЪрд╛рд╣рд┐рдП)

@ рдХреЙрдл рд░рд┐рдПрдХреНрдЯ рдПрдХ рдмрд╣реБрдд рд╣реА рдЕрд▓рдЧ рдХрд╣рд╛рдиреА рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рд╕реИрдХрдбрд╝реЛрдВ рд╣рдЬрд╛рд░реЛрдВ

SASS рд╕рдмрд╕реЗ рд╕реНрдерд╛рдкрд┐рдд рд╕реАрдПрд╕рдПрд╕ рдкреНрд░реАрдкреНрд░реЛрд╕реЗрд╕рд░ рдореЗрдВ рд╕реЗ рдПрдХ рд╣реИ рдФрд░ рдХрд┐рд╕реА рднреА рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ рдЗрд╕реНрддреЗрдорд╛рд▓ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИ - рдпрд╣ рдмрд╣реБрдд рдареЛрд╕ рд╣реИ рдФрд░ рдореЗрдЬ рдкрд░ рдмрд╣реБрдд рдЕрдзрд┐рдХ рдореВрд▓реНрдп рд▓рд╛рддрд╛ рд╣реИред рдЗрд╕рд▓рд┐рдП рдореИрдВ рдХреЗрд╡рд▓ JSS рдЬреИрд╕реА рдХрд┐рд╕реА рдЪреАрдЬрд╝ рдХрд╛ рдЪрдпрди рдХрд░рдирд╛ рдЪрд╛рд╣реВрдВрдЧрд╛, рдпрджрд┐ рдмрд┐рд▓реНрдХреБрд▓ рдЖрд╡рд╢реНрдпрдХ рд╣реЛ (рдЬреИрд╕реЗ: рдбрд╛рдпрдирд╛рдорд┐рдХ рдереАрдо рдХреЗ рдХрд╛рд░рдг), рд▓реЗрдХрд┐рди рдХрдИ рдбреАрдЖрд░рдПрд╕ рдХреЗ рд╕рд╛рде рдПрдХ рд╡рд╛рдгрд┐рдЬреНрдпрд┐рдХ рд╕реЙрдлреНрдЯрд╡реЗрдпрд░ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдореЗрдВ рд╡рд░реНрд╖реЛрдВ рдХреЗ рдЕрдиреБрднрд╡ / рд░реВрдкрд░реЗрдЦрд╛ / рдЬреНрдЮрд╛рди рдЖрдзрд╛рд░ рдЖрджрд┐ рдХреЛ рдлреЗрдВрдХрдирд╛ рдкрд╕рдВрдж рдирд╣реАрдВ рдХрд░рддрд╛ред рдЗрд╕рд▓рд┐рдП рдореИрдВ JSS рдореЗрдВ рдХреЗрд╡рд▓ рдбрд╛рдпрдирд╛рдорд┐рдХ рдереАрдо рдкрд╣рд▓реВ рдФрд░ рд╢реЗрд╖ / css- рдореЙрдбреНрдпреВрд▓ рдХреЗ рд╕рд╛рде рдирд┐рд░реНрдорд╛рдг рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░реВрдВрдЧрд╛ред

рдореИрдВ рдЗрд╕ рд╕реЛрдЪрдиреЗ рдХреЗ рддрд░реАрдХреЗ рдХреЛ рд╕рдордЭрддрд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдореИрдВ рдЗрд╕реЗ рдЧрд░реНрднрдирд┐рд░реЛрдзрдХ рдХреЗ рд░реВрдк рдореЗрдВ рднреА рдорд╛рдирддрд╛ рд╣реВрдВ рдФрд░ рдирд╡рд╛рдЪрд╛рд░ рдФрд░ рдЙрджреНрдпреЛрдЧ рдХреЛ рдзреАрдорд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрд╕реЗ рджреЛрд╖ рджреЗрддрд╛ рд╣реВрдВред

рдЖрдк рджреЛрдиреЛрдВ рдХрд╛ рд╕рдорд░реНрдерди рдХреНрдпреЛрдВ рдирд╣реАрдВ рдХрд░рддреЗ? рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ рд▓рд┐рдЦрд╛ рд╢реИрд▓рд┐рдпреЛрдВ рдФрд░ рд╕реАрдПрд╕рдПрд╕ рдореЙрдбреНрдпреВрд▓ рдореЗрдВ рд▓рд┐рдЦрд╛ рд╢реИрд▓рд┐рдпреЛрдВ? рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП, рдЕрдЧрд░ рдореБрдЭреЗ https://github.com/callemall/material-ui/blob/next/src/Button/Button.js рдкрд░ рдПрдХ рдирдЬрд╝рд░ рд╣реИ, рддреЛ рдпрд╣ рдПрдХ рдкреНрд░рд╕реНрддрд╛рд╡ рджреНрд╡рд╛рд░рд╛ рдкрд╛рд░рд┐рдд рд╡рд░реНрдЧ-рдирд╛рдореЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдХрд╛рдлреА рдЖрд╕рд╛рди рд╣реЛрдЧрд╛ ( https://github.com/javivelasco/react-css-themr) рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рдмрдЬрд╛рдп:

const classes = this.context.styleManager.render(styleSheet);

рд╣реИ рдирд╛?

рдРрд╕рд╛ рдирд╣реАрдВ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЬреЗрдПрд╕рдПрд╕ рдпрд╛ рд╕реАрдПрд╕рдПрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЪрд░реНрдЪрд╛ рдПрдХ рдЕрдВрдд (рдЕрднреА рддрдХ?) рдкрд╛ рд░рд╣реА рд╣реИред рдореЗрд░реЗ рд▓рд┐рдП рдпрд╣ рдЗрд╕ рд╕рдордп рдПрдХ рдкрдЪрд╛рд╕ / рдкрдЪрд╛рд╕ рдХреА рддрд░рд╣ рд▓рдЧ рд░рд╣рд╛ рд╣реИред

рдПрд╕рдПрдПрд╕рдПрд╕ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ, рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЯреВрд▓рдмреЙрдХреНрд╕ рд╡рд░реНрддрдорд╛рди

рд╕рднреА рдЬреЗрдПрд╕ рдореЗрдВ рд╕реНрдЯрд╛рдЗрд▓рд┐рдВрдЧ, рдФрд░ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рд░рд┐рдПрдХреНрдЯ рдореЗрдВ, рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдЕрднреА рднреА рд╡рд┐рдХрд╛рд╕ рдХреА рддреАрд╡реНрд░ рд╕реНрдерд┐рддрд┐ рдореЗрдВ рд╣реИред рдЗрд╕рд▓рд┐рдП рдЬреЛ рдХреБрдЫ рднреА рдЖрдк рдХрд░рддреЗ рд╣реИрдВ, рдореИрдВ рд░рд╛рдп рджреЗрдиреЗ рд╕реЗ рдмрдЪрдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░реВрдВрдЧрд╛ - рдмрд╕ рд╡рд░реНрддрдорд╛рди рдЙрдкрдпреЛрдЧ рдХреЗ рд╡реНрдпрд╛рдкрдХ рд╕реЗрдЯ рдХреЗ рд╕рд╛рде рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдлрд┐рдЯ рд╣реВрдВред

рдЬрд╣рд╛рдБ рднреА рдПрдХ * рд╢реИрд▓реА рдХрд╛ рдкреНрд░рд╕реНрддрд╛рд╡ рд╣реИ, рд╡рд╣рд╛рдВ рдХреЗрд╡рд▓ * className рдкреНрд░реЛрдк рдЬреЛрдбрд╝рдиреЗ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд░реЗрдВред рдЕрд╡рдзрд┐ред

рдкреВрд░реНрдг рдкреНрд░рдХрдЯреАрдХрд░рдг: рдореИрдВ рдПрдХ рдЦреБрд╢ Aphrodite рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рд╣реВрдБред

className рдЬреЛрдбрд╝рдиреЗ рдкрд░ рдЕрднреА рднреА !important рд╣реИрдХреНрд╕ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрдЧреА рдХреНрдпреЛрдВрдХрд┐ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ ( style рдкреНрд░реЙрдкрд░реНрдЯреА) рд╕реЗ рдкреВрд░реНрд╡рддрд╛ рдкреНрд░рд╛рдкреНрдд рд╣реЛрддреА рд╣реИред

@ рд▓рд┐рдЧрд╛рдЬрд╝ рдмреЗрд╢рдХ, рдЖрдк рд╕рд╣реА рдХрд╣ рд░рд╣реЗ рд╣реИрдВред Aphrodite рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ рд╣рд░ рдЪреАрдЬ рдореЗрдВ !important рдЬреЛрдбрд╝рддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рд╢рд╛рдпрдж "рд╡реНрдпрд╛рдкрдХ рдЙрдкрдпреЛрдЧ" рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдореЗрд░реА рд╕реЛрдЪ рдмреБрд░реА рддрд░рд╣ рд╕реЗ рддрд┐рд░рдЫреА рд╣реИред

@ рд▓реАрдЧрд╛рдЬрд╝ @estaub - next рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рдХреЛрдбрд┐рдд _without_ style рдФрд░ рдШрдЯрдХреЛрдВ рдХреЗ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ рдХреЛ className рдкреНрд░рджрд╛рди рдХрд░рдХреЗ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдиреЗ рдХреА рдЕрдиреБрдорддрд┐ рджреЗрддрд╛ рд╣реИ (рдФрд░ рдЬрдЯрд┐рд▓ рдШрдЯрдХреЛрдВ рдХреЗ рд╡рд┐рднрд┐рдиреНрди рднрд╛рдЧреЛрдВ рдореЗрдВ рдХрдИ рд╡рд░реНрдЧ рдХреЗ рдирд╛рдо) ред

рдЕрдиреБрд░рдХреНрд╖рдХреЛрдВ рджреНрд╡рд╛рд░рд╛ next рд╢рд╛рдЦрд╛ рдкрд░ рд╕реНрдЯрд╛рдЗрд▓ рдкреНрд░рддрд┐рдорд╛рди рд╕реЗрдЯрдЕрдк JSS рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реИред рдХрд┐рд╕реА рд╡реНрдпрдХреНрддрд┐ рдпрд╛ рд╡рд┐рд╖рдп рдХреЗ рдЖрдзрд╛рд░ рдкрд░ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рдирд╛ рдЖрд╕рд╛рди рд╣реИред

рдпрд╣ рдШреЛрдбрд╝рд╛ рдорд░ рдЪреБрдХрд╛ рд╣реИред рдЪрд▓реЛ рдЗрд╕реЗ рдкреАрдЯрдирд╛ рдмрдВрдж рдХрд░реЛред @oliviertassinari рдореИрдВ рдЖрдкрдХреЛ next рджрд┐рд╢рд╛ рдкрд░ рдХрдерди рдХреЗ рд╕рд╛рде рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдмрдВрдж рдХрд░рдиреЗ рдФрд░ рдмрдВрдж рдХрд░рдиреЗ рдХрд╛ рд╕реБрдЭрд╛рд╡ рджреЗрддрд╛ рд╣реВрдВред

рд╣рд╛рдп @rosskevin - рдХреНрдпрд╛ рдЖрдк рдореБрдЭреЗ рдХрд┐рд╕реА рднреА рдЙрджрд╛рд╣рд░рдг рдореЗрдВ

рдореИрдВ рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдПрдХ рдирдИ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рд▓рд┐рдП рдЪреМрдЦрдЯреЗ рджреЗрдЦ рд░рд╣рд╛ рд╣реВрдВ, рдореИрдВ рд╕рд╛рдордЧреНрд░реА рдпреВрдЖрдИ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдкрд╕рдВрдж рдХрд░реВрдВрдЧрд╛ рд▓реЗрдХрд┐рди рд╣рдореЗрдВ рдЙрди рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрдЧреА рдЬрд┐рдирдХрд╛ рдЖрдкрдиреЗ рдЙрд▓реНрд▓реЗрдЦ рдХрд┐рдпрд╛ рд╣реИред рдореИрдВрдиреЗ рдПрдХ рдкрд░реАрдХреНрд╖рдг рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ рдЕрдЧрд▓реА рд╢рд╛рдЦрд╛ рдЬреЛрдбрд╝ рджреА рд╣реИ рдФрд░ рдПрдХ рд╕рд░рд▓ рдШрдЯрдХ рдЬреЛрдбрд╝рд╛ рд╣реИ рдФрд░ рдореИрдВ рдПрдХ рдЗрдВрд╕реНрдкреЗрдХреНрдЯрд░ рдХреЛ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпреЛрдВ рд╕реЗ рднрд░рд╛ рд╣реБрдЖ рджреЗрдЦ рд░рд╣рд╛ рд╣реВрдВ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рдЕрдиреБрдорд╛рди рд▓рдЧрд╛ рд░рд╣рд╛ рд╣реВрдВ рдХрд┐ рдореИрдВ рдХреБрдЫ рдЧрд▓рдд рдХрд░ рд░рд╣рд╛ рд╣реВрдВ?

рдХрд┐рд╕реА рднреА рдЕрдзрд┐рдХ рд╡рд┐рд╡рд░рдг рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдЙрдкрдпреЛрдЧреА рд╣реЛрдЧрд╛!

рдзрдиреНрдпрд╡рд╛рдж

@giuseppepaul next npm рдкрд░ рдкреНрд░рдХрд╛рд╢рд┐рдд рдирд╣реАрдВ рд╣реБрдЖ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдкреВрд░реНрд╡-рдЕрд▓реНрдлрд╝рд╛ рд╣реИ рдФрд░ рдЕрднреА рдкреВрд░рд╛ рдирд╣реАрдВ рд╣реБрдЖ рд╣реИред рдЖрдк https://github.com/callemall/material-ui.git#next рдкрд░ рдХреНрд▓реЛрди рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ docs/site рд╕рдХрддреЗ рд╣реИрдВ рдпрд╣ рджреЗрдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐ рдЕрдзрд┐рдХ рдЗрдирд▓рд╛рдЗрди рд╢реИрд▓рд┐рдпрд╛рдБ рдирд╣реАрдВ рд╣реИрдВред рдЗрд╕рдореЗрдВ рдбреАрдореЛрд╕ рдХреА рдЙрдЪрд┐рдд рдорд╛рддреНрд░рд╛ рднреА рд╣реИред

рдореИрдВ рдЕрдкрдиреЗ рд╕реНрд╡рдпрдВ рдХреЗ рдирд┐рдЬреА рд╕рдВрд╕реНрдХрд░рдг рдХреЛ рдкреНрд░рдХрд╛рд╢рд┐рдд рдХрд░ рд░рд╣рд╛ рд╣реВрдВ (рддрд╛рдХрд┐ рдореИрдВ рдЕрдкрдбреЗрдЯ рдХреЛ рдирд┐рдпрдВрддреНрд░рд┐рдд рдХрд░ рд╕рдХреВрдВ) рдФрд░ рдЬрд▓реНрдж рд╣реА рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдЙрддреНрдкрд╛рджрди рдПрдкреНрд▓рд┐рдХреЗрд╢рди рдХреЗ рд░реВрдк рдореЗрдВ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред

рдпрд╣ рдШреЛрдбрд╝рд╛ рдорд░ рдЪреБрдХрд╛ рд╣реИред рдЪрд▓реЛ рдЗрд╕реЗ рдкреАрдЯрдирд╛ рдмрдВрдж рдХрд░реЛред @oliviertassinari рдореИрдВ рдЖрдкрдХреЛ рд╕реБрдЭрд╛рд╡

рд╡рд╣ рдШреЛрдбрд╝рд╛ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдорд░рд╛ рдирд╣реАрдВ рд╣реИред рд▓реЗрдХрд┐рди рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рдПрдХ рддрдВрдЧ рдЬрдЧрд╣ рдореЗрдВ spot ред
рдореИрдВ рд╕рд╣рдордд рд╣реВрдВ, рдЖрдЗрдП рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдмрдВрдж рдХрд░реЗрдВред

рдЙрд╕ рдХрд╣рд╛рдиреА рдкрд░ рдЙрдирдХреА рдХрдбрд╝реА рдореЗрд╣рдирдд рдХреЗ рд▓рд┐рдП @nathanmark рдХрд╛ рдПрдХ рдмрдбрд╝рд╛ рдзрдиреНрдпрд╡рд╛рдж!
рдореИрдВрдиреЗ # 5718 рдХреЗ рд╕рд╛рде рдЖрдЧреЗ рдХреА рд╕рдбрд╝рдХ рдкрд░ рдЕрдзрд┐рдХ рдЬрд╛рдирдХрд╛рд░реА рдПрдХрддреНрд░ рдХреА рд╣реИред

рдирдорд╕реНрддреЗ,
IconButton рдкрд╛рд╕ CSS3 transition рд╕рдВрдкрддреНрддрд┐ рд╣реИред рдХрд╛рд░реНрдб @next рдХреЗ рдбреЙрдХреНрдЯрд░ рдХреА рдЬрдЯрд┐рд▓ рдмрд╛рддрдЪреАрдд рдореЗрдВ, рдЖрдкрдиреЗ рдЖрдЗрдХрди рдХреЛ рдЙрд▓рдЯ рдЬрд╛рдиреЗ рдкрд░ рдПрдХ рдкрд░рд┐рд╡рд░реНрддрди рдЬреЛрдбрд╝рдиреЗ рдХреЗ рд▓рд┐рдП transition рдЬреЛрдбрд╝рд╛ рд╣реИред
рдпрджрд┐ рдореИрдВ рдЕрдкрдиреЗ рдРрдк рдкрд░ рдРрд╕рд╛ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдПрдХ рд╕рдВрдХреНрд░рдордг (рд░рд┐рдкрд▓ рдпрд╛ рд░рд┐рд╡рд░реНрд╕) рджреВрд╕рд░реЗ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рддрд╛ рд╣реИ (рдПрдХ рддрддреНрд╡ рдореЗрдВ рджреЛ рдЧреБрдг рдирд╣реАрдВ рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВ рдЕрдиреНрдпрдерд╛ рдПрдХ рджреВрд╕рд░реЗ рдХреЛ рдУрд╡рд░рд░рд╛рдЗрдб рдХрд░рддрд╛ рд╣реИ)ред
рд╣рд╛рд▓рд╛рдБрдХрд┐ рдЖрдкрдХреЗ рд╢реЗрд╡рд░реЙрди рдЖрдЗрдХрди рдиреЗ рдЙрд╕ рдкрд░ рд╕рдлрд▓рддрд╛рдкреВрд░реНрд╡рдХ рджреЛ transitions рд▓рд╛рдЧреВ рдХрд┐рдпрд╛ рд╣реИред рдХреНрдпреЛрдВрдХрд┐ рдХрд┐рд╕реА рди рдХрд┐рд╕реА рд░реВрдк рдореЗрдВ рдЖрдк IconButton рдФрд░ рдЖрдкрдХреЗ рдХреЛрдб рдореЗрдВ рдкрд░рд┐рднрд╛рд╖рд┐рдд рджреНрд╡рд╛рд░рд╛ рдкреНрд░рджрд╛рди рдХрд┐рдП рдЧрдП рд╕рдВрдХреНрд░рдордг рдХреЛ рдорд░реНрдЬ рдХрд░рддреЗ рд╣реИрдВред рдЖрдк рдЗрд╕реЗ рдХреИрд╕реЗ рдкреНрд░рд╛рдкреНрдд рдХрд░реЗрдВрдЧреЗ?
рдХреБрдЫ рдЕрдиреНрдп рд╕рд╛рдорд╛рди рдореЗрд░реЗ рд▓рд┐рдП рдЕрд╕реНрдкрд╖реНрдЯ рд╣реИрдВ рдФрд░ рдореБрдЭреЗ рд╕рдВрдмрдВрдзрд┐рдд рдбреЙрдХреНрдЯрд░ рдирд╣реАрдВ рдорд┐рд▓ рд╕рдХрддреЗ рд╣реИрдВред theme рдореЗрдВ breakpoints (рдпрд╣рд╛рдБ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд┐рдпрд╛ рдЧрдпрд╛) transitions (рдпрд╣рд╛рдБ рдкреНрд░рдпреБрдХреНрдд) рдХреЗ рд░реВрдк рдореЗрдВ рдмрд╣реБрдд рд╕реА рд╡рд┐рдзрд┐рдпрд╛рдБ / рдЧреБрдг рд╣реИрдВред рд╡рд╣рд╛рдБ рдкрд╣рд▓реЗ рд╕реЗ рд╣реА рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рд╣реИ theme рдХреНрдпрд╛ рдХреА рд╕рдВрдкрддреНрддрд┐ MuiThemeProvider.createDefaultContext() рдХреЗ рд░реВрдк рдореЗрдВ рдпрд╣ рдЙрдкрдпреЛрдЧреА рдкреНрд░рддреАрдд рд╣реЛрддрд╛ рд╣реИ рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рд╣реИ рдХрд┐ рдпрд╣ рдЕрдкрдиреЗ рдХреЛрдб рдХреЗ рдЕрдВрджрд░ рдмрдбрд╝реЗ рдкреИрдорд╛рдиреЗ рдкрд░ рдкреНрд░рдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ рдкрд░ рд▓реМрдЯ рдЖрдПрдЧрд╛ред
this.context.styleManager.render(styleSheet) ? рдХреНрдпрд╛ ?
рдЖрдк jss-theme-reactor рдХрд╛ рднреА рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ, рдЬрд┐рд╕реЗ рдореИрдВ рдЕрднреА рднреА react-jss рдХреА рддреБрд▓рдирд╛ рдореЗрдВ рдмрд╛рдд рдирд╣реАрдВ рд╕рдордЭрддрд╛ред

@NitroBAY рдпрд╣ рдереНрд░реЗрдб рд╕рдорд╛рдкреНрдд рд╣реЛ рдЧрдпрд╛ рд╣реИред рдХреГрдкрдпрд╛ рд╕рд╣реА рдЪреИрдирд▓ рдкрд░ рдЖрдкрд╕реЗ рдкреНрд░рд╢реНрди рдкреВрдЫреЗрдВред рдпрджрд┐ рдЖрдк рдмрдЧ рдХреЛ рдиреЛрдЯрд┐рд╕ рдХрд░рддреЗ рд╣реИрдВ рдпрд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдХрд┐ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рдореЗрдВ рд╕реБрдзрд╛рд░ рд╣реЛ, рддреЛ рдПрдХ рд╕рдорд╕реНрдпрд╛ рдЦреЛрд▓реЗрдВред рдЕрдиреНрдпрдерд╛ рдЖрдк gack.im рдХреЗ StackOverflow рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

FranBran picture FranBran  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

finaiized picture finaiized  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

ryanflorence picture ryanflorence  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

newoga picture newoga  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

rbozan picture rbozan  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ