File size: 1,948 Bytes
4d6f2bc
6ac2c39
4d6f2bc
 
 
 
c851587
 
 
 
4d6f2bc
 
 
 
 
6ac2c39
c851587
6ac2c39
 
 
4d6f2bc
 
c851587
 
6ac2c39
c851587
 
4d6f2bc
 
c851587
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4d6f2bc
 
6278196
c851587
 
 
4d6f2bc
 
c851587
6ac2c39
c851587
6ac2c39
c851587
6ac2c39
 
c851587
6ac2c39
 
 
4d6f2bc
c851587
4d6f2bc
 
 
c851587
4d6f2bc
 
 
 
 
c851587
 
 
 
 
 
 
 
 
 
 
 
 
 
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
.accordion {
  --block-border-width: 0px;
  background-color: transparent;
}
.accordion > button {
  justify-content: flex-start;
  color: var(--body-text-color-subdued);
}
.accordion > button:hover {
  color: var(--body-text-color);
}
.accordion > button > span:first-child {
  width: auto;
  margin-right: 4px;
}
.accordion .tabs {
  margin-top: 8px;
}
.accordion .tabitem > div {
  --block-border-width: 1px;
}

.gallery {
  background-color: var(--bg);
}
.gallery:is(.dark *) {
  background-color: var(--bg-dark);
}

.icon-button {
  max-width: 42px;
  position: relative;
}
.icon-button:hover::after {
  white-space: nowrap;
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  transform: translateX(-50%);
  padding: 4px 8px;
  border-radius: 4px;
  border-width: 1px;
  border-color: var(--button-secondary-border-color-hover);
  background: var(--button-secondary-background-fill-hover);
  color: var(--button-secondary-text-color-hover);
  font-weight: var(--section-header-text-weight);
  font-size: var(--section-header-text-size);
}
.icon-button#clear:hover::after {
  content: 'Clear gallery';
}
.icon-button#random:hover::after {
  content: 'Roll seed';
}

#intro {
  margin-bottom: 8px !important;
}
#intro > div {
  display: flex;
}
#intro > div > h1 > span {
  font-style: italic;
  color: #047857 !important;
}
#intro > div > h1 > span:is(.dark *) {
  color: #10b981 !important;
}
#intro > div > svg {
  width: 1.5rem;
  height: 1.5rem;
  margin-top: 0.25rem;
  margin-left: 0.5rem;
  align-self: center;
  fill: #047857 !important;
  animation: spin 3s linear infinite reverse;
}
#intro > div > svg:is(.dark *) {
  fill: #10b981 !important;
}
@keyframes spin {
  100% { transform: rotate(360deg); }
}

.tabs, .tabitem, .tab-nav, .tab-nav > .selected {
  border-width: 0px;
}
.tabitem {
  max-height: 600px;
  overflow-y: auto;
}
.tabitem .markdown {
  margin-left: 8px;
}
.tab-nav > button {
  padding-bottom: 8px;
}