icons 0.4.7

Icons for Rust fullstack applications — Leptos and Dioxus.
Documentation 
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

/* Archive lid lifting animation - smooth transition */
[data-name="ArchiveAnimate"] rect[width="20"][height="5"][x="2"][y="3"][rx="1"] {
    transition: transform 0.2s ease-out;
}

[data-name="ArchiveAnimate"]:hover rect[width="20"][height="5"][x="2"][y="3"][rx="1"] {
    transform: translateY(-1.5px);
}

/* Archive body opening animation - path morphing with reverse */
[data-name="ArchiveAnimate"] path[d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8"] {
    animation-duration: 0.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: both;
}

[data-name="ArchiveAnimate"]:hover path[d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8"] {
    animation-name: archiveBodyOpen;
}

[data-name="ArchiveAnimate"]:not(:hover) path[d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8"] {
    animation-name: archiveBodyClose;
}

/* Archive handle moving animation - path morphing with reverse */
[data-name="ArchiveAnimate"] path[d="M10 12h4"] {
    animation-duration: 0.2s;
    animation-timing-function: ease-out;
    animation-fill-mode: both;
}

[data-name="ArchiveAnimate"]:hover path[d="M10 12h4"] {
    animation-name: archiveHandleMove;
}

[data-name="ArchiveAnimate"]:not(:hover) path[d="M10 12h4"] {
    animation-name: archiveHandleReturn;
}


@keyframes archiveBodyOpen {
    0% { d: path('M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'); }
    100% { d: path('M4 11v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V11'); }
}

@keyframes archiveBodyClose {
    0% { d: path('M4 11v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V11'); }
    100% { d: path('M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'); }
}

@keyframes archiveHandleMove {
    0% { d: path('M10 12h4'); }
    100% { d: path('M10 15h4'); }
}

@keyframes archiveHandleReturn {
    0% { d: path('M10 15h4'); }
    100% { d: path('M10 12h4'); }
}