color-scheme

Table of content

• Installation
• Usage
• License
• Contributing
• TODO

Installation

Usage

This is a very simple binding to the prefers-color-scheme media query. The sample program in example can be run with trunk serve.

Usage:

use prefers_color_scheme::{prefers_dark, prefers_light};
use yew::prelude::*;

enum Msg {
    Query,
}

struct Model {}

impl Component for Model {
    type Message = Msg;
    type Properties = ();

    fn create(_ctx: &Context<Self>) -> Self {
        Self {}
    }

    fn update(&mut self, _ctx: &Context<Self>, msg: Self::Message) -> bool {
        match msg {
            Msg::Query => true,
        }
    }

    fn view(&self, ctx: &Context<Self>) -> Html {
        // This gives us a component's "`Scope`" which allows us to send messages, etc to the component.
        let link = ctx.link();
        html! {
            <div>
                <button onclick={link.callback(|_| Msg::Query)}>{ "Query" }</button>
                <p>{"Prefers Dark:"} { prefers_dark() }</p>
                <p>{"Prefers Light:"} { prefers_light() }</p>
            </div>
        }
    }
}

fn main() {
    yew::start_app::<Model>();
}

License

This program is distributed under the terms of the MIT License.

Contributing

All contributions are welcome. Both pull requests and issue reports are always appreciated. Please make sure that all existing tests pass before submitting a pull request.

TODO