fum-player 1.3.1

A tui-based mpris music client.
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

@import 'tailwindcss';

@theme {
  --font-embed-code:  "Jersey 15", serif;
  --color-background: #1c1b22;
  --color-fg:         #defedf;
  --color-primary:    #40e78a;
  --color-secondary:  #3a86ff;
  --color-tertiary:   #9b5de5;
  --color-subtle:     #727169;
}

html {
  @apply scroll-smooth h-full;
}

body {
  @apply bg-background text-fg font-embed-code;
}

.doc p,
.doc li{ @apply text-2xl; }

.doc h1 { @apply relative text-6xl font-bold my-3; }
.doc h2 { @apply relative text-5xl font-bold my-3; }
.doc h3 { @apply relative text-4xl font-bold my-3; }
.doc h4 { @apply relative text-3xl font-bold my-3; }
.doc h5 { @apply relative text-2xl font-bold my-3; }
.doc h6 { @apply relative text-xl font-bold my-3; }

.doc h1,
.doc h2,
.doc h3,
.doc h4,
.doc h5,
.doc h6 { @apply text-primary; }
.doc a:not(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a) { @apply text-secondary; }

.doc ol { @apply list-decimal pl-4; }
.doc ul { @apply list-disc pl-4; }

.doc table { @apply w-full; }
.doc thead { @apply bg-primary text-background; }
.doc th, td { @apply px-4 py-2 border border-fg text-left; }

.doc blockquote { @apply border-l-4 border-gray-400 dark:border-gray-600 pl-4 italic text-gray-700 dark:text-gray-300; }

.doc pre { @apply mb-4 p-2; }
.doc code:not(pre code) { @apply bg-[#16161d] font-embed-code px-2; }

.doc summary { @apply text-2xl cursor-pointer hover:text-primary transition-colors duration-300 w-fit; }

.doc hr { @apply my-8; }

.doc pre:has(code) {
  position: relative;
  display: flex;

  code {
    overflow-x: scroll;
  }

  button.copy {
    position: absolute;
    right: 0;
    top: 0;
    height: 24px;
    width: 24px;
    margin: .5em;
  
    & span {
      display: inline-block;
      width: 100%;
      height: 100%;
      mask-size: cover;
      cursor: pointer;
    }
    & .ready {
      mask-image: url(/icons/copy.svg);
      background-color: var(--color-subtle);
    }
    & .success {
      display: none;
      mask-image: url(/icons/check.svg);
      background-color: var(--color-primary);
    }
  
    &.copied {
      & .success {
        display: block;
      }
  
      & .ready {
        display: none;
      }
    }
  }
}