1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
//! Stylist is a CSS-in-Rust styling solution for WebAssembly Applications.
//!
//! ## Usage
//!
//! ### Yew Integration
//!
//! To enable yew integration, enable the `yew_integration` feature in `Cargo.toml`.
//!
//! For a detailed usage with yew, see the [`yew`](crate::yew) module.
//!
//! ### Syntax
//!
//! Every declaration that is not in a qualified block will be applied to the Component
//! the class of this style is applied to.
//!
//! You may also use `&` in CSS selectors to denote the generated class of the container
//! element:
//!
//! ```css
//! &:hover {
//! background-color: #d0d0d9;
//! }
//! ```
//!
//! You can also use other CSS at-rules (such as: @keyframes, @supports and @media):
//!
//! ```css
//! @keyframes mymove {
//! from {
//! top: 0px;
//! }
//! to {
//! top: 200px;
//! }
//! }
//! ```
//!
//! ```css
//! @media only screen and (max-width: 600px) {
//! background-color: #303040;
//!
//! .nested {
//! background-color: lightblue;
//! }
//!
//! &:hover {
//! background-color: #606072;
//! }
//! }
//! ```
//!
//! ```css
//! @supports (backdrop-filter: blur(5px)) {
//! backdrop-filter: blur(5px);
//! }
//! ```
//!
//! ### Theming
//!
//! There's theming example using
//! [Yew Context API](https://github.com/futursolo/stylist-rs/tree/master/examples/yew-theme-context).
//!
//! ### Style API
//!
//! If you want to parse a string into a style at runtime, you need to enable the
//! `parser` feature. You can then use [`Style::new`], passing a `str`, `String`
//! or `Cow<'a, str>`:
//!
//! ```rust
//! use stylist::Style;
//!
//! let style = Style::new(
//! r#"
//! background-color: red;
//!
//! .nested {
//! background-color: blue;
//! width: 100px
//! }
//! "#,
//! )
//! .expect("Failed to create style");
//! ```
//!
//! ## Features Flags
//!
//! - `macros`: Enabled by default, this flag enables procedural macro support.
//! - `random`: Enabled by default, this flag uses `fastrand` crate to generate a random class name.
//! Disabling this flag will opt for a class name that is counter-based.
//! - `parser`: Disabled by default, this flag enables runtime parsing of styles from strings. You
//! don't need to enable this to generate styles via the macros.
//! - `yew_integration`: This flag enables yew integration, which implements
//! [`Classes`](::yew::html::Classes) for [`Style`] and provides a [`Global`](yew::Global)
//! component for applying global styles.
//! - `debug_style_locations`: Enabled by default, this flag annotates elements with additional
//! classes to help debugging and finding the source location of styles.
//! - `debug_parser`: Enabled by default, this flag generates additional checks when
//! `debug_assertions` are enabled.
//! - `ssr`: Disabled by default, this flag enables Server-side Rendering Support.
//! - `hydration`: Disabled by default, this flag enables Server-side Rendering Hydration Support.
pub use GlobalStyle;
pub use Style;
pub use StyleSource;
pub use ;
/// A procedural macro that parses a string literal or an inline stylesheet into a
/// [`StyleSource`].
///
/// Please consult the documentation of the [`macros`] module for the supported syntax of this
/// macro.
///
/// # Example
///
/// ```
/// use stylist::css;
/// use stylist::yew::Global;
/// use yew::prelude::*;
///
/// let rendered = html! {<div class={css!("color: red;")} />};
/// let rendered_global = html! {<Global css={css!("color: red;")} />};
/// ```
pub use css;
/// A procedural macro that parses a string literal or an inline stylesheet into a
/// [`GlobalStyle`].
///
/// Please consult the documentation of the [`macros`] module for the supported syntax of this
/// macro.
///
/// # Example
///
/// ```
/// use stylist::global_style;
///
/// // Returns a GlobalStyle instance.
/// let style = global_style!("color: red;");
/// ```
pub use global_style;
/// A procedural macro that parses a string literal or an inline stylesheet into a [`Style`].
///
/// Please consult the documentation of the [`macros`] module for the supported syntax of this
/// macro.
///
/// # Example
///
/// ```
/// use stylist::style;
///
/// // Returns a Style instance.
/// let style = style!("color: red;");
/// ```
pub use style;