pytorch

1
/* Copy buttons */
2
button.copybtn {
3
    position: absolute;
4
    display: flex;
5
    top: .3em;
6
    right: .5em;
7
    width: 1.7em;
8
    height: 1.7em;
9
    opacity: 1;
10
    transition: opacity 0.3s, border .3s, background-color .3s;
11
    user-select: none;
12
    padding: 0;
13
    border: none;
14
    outline: none;
15
    border-radius: 0.4em;
16
    border: #e1e1e1 1px solid;
17
    background-color: rgb(245, 245, 245);
18
}
19

20
button.copybtn.success {
21
    border-color: #22863a;
22
}
23

24
button.copybtn img {
25
    width: 100%;
26
    padding: .2em;
27
}
28

29
div.highlight  {
30
    position: relative;
31
}
32

33
.highlight button.copybtn {
34
    opacity: 1;
35
}
36

37
.highlight button.copybtn:hover {
38
    background-color: rgb(235, 235, 235);
39
}
40

41
.highlight button.copybtn:active {
42
    background-color: rgb(187, 187, 187);
43
}
44

45
/**
46
 * A minimal CSS-only tooltip copied from:
47
 *   https://codepen.io/mildrenben/pen/rVBrpK
48
 *
49
 * To use, write HTML like the following:
50
 *
51
 * <p class="o-tooltip--left" data-tooltip="Hey">Short</p>
52
 */
53
 .o-tooltip--left {
54
  position: relative;
55
 }
56

57
 .o-tooltip--left:after {
58
    opacity: 1;
59
    visibility: visible;
60
    position: absolute;
61
    content: attr(data-tooltip);
62
    padding: .2em;
63
    font-size: .8em;
64
    left: -.2em;
65
    background: grey;
66
    color: white;
67
    white-space: nowrap;
68
    z-index: 2;
69
    border-radius: 2px;
70
    transform: translateX(-102%) translateY(0);
71
    transition: opacity 0.2s cubic-bezier(0.64, 0.09, 0.08, 1), transform 0.2s cubic-bezier(0.64, 0.09, 0.08, 1);
72
}
73

74
.o-tooltip--left:hover:after {
75
    display: block;
76
    opacity: 1;
77
    visibility: visible;
78
    transform: translateX(-100%) translateY(0);
79
    transition: opacity 0.2s cubic-bezier(0.64, 0.09, 0.08, 1), transform 0.2s cubic-bezier(0.64, 0.09, 0.08, 1);
80
    transition-delay: .5s;
81
}
82