constellation.talk/constellation.less at master · queerviolet/constellation.talk · GitHub

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
@import "base.less";
@import "colors.less";

// -- stage setup --
#explosion {
  .stage(0, 0, 16, 9);
  transition: filter 1000ms, opacity 1000ms;
  filter: blur(20px);
  opacity: 0;
  pointer-events: none;
}

#text {
  .stage(0, 0, 16, 9);
  .fades();

  display: none;

  > #writer {
    .stage(1, 1, 15, 8);
    display: block;
    color: @yellow-base;
    font-family: 'Source Sans Pro';
    font-size: calc(0.8 * var(--su));
    --typewriter-typing-rate: 30;
    --typewriter-cursor-color: @indigo-light;
    text-shadow: calc(0.1 * var(--su)) calc(0.1 * var(--su)) calc(0.2 * var(--su)) black;
    white-space: pre;

    &:first-line {
      font-size: calc(0.9 * var(--su));
    }
  }
}

// -- builds --

.csExplode, .csEarlier {
  #explosion { filter: none; opacity: 1; }
  #text { display: flex; }
}

.csWhatsNext,
.csEvolution,
.csFaster,
.csRust,
.csParallelism,
.csAheadOfTime,
.csStronger,
.csValidations,
.csErrors,
.csInsight,
.csFlexiblier,
.csMoreFlexible,
.csStitching,
.csStream,
.csCompatibility
{
  .csEarlier();
  #text { display: flex; opacity: 1; }
}

.csEnd {
  #text { display: flex; opacity: 1; }
}