NegevEdit/ramon.theme.css at main · Sandalphon613/NegevEdit · 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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
/**
 * @name Ramon
 * @author DevilBro
 * @version 1.0.5
 * @description Allows you to use a background image without greatly altering the basic look of Discord.
 * @source https://raw.githubusercontent.com/mwittrien/BetterDiscordAddons/master/Themes/BasicBackground/BasicBackground.theme.css
*/

@import url('https://mwittrien.github.io/BetterDiscordAddons/Themes/BasicBackground/BasicBackground.css');

:root {
  /* Image Display Settings */
  --backgroundsize: cover;
  --backgroundposition: center;
  --backgroundblur: 0px;

  /* Popout & Backdrop Settings */
  --popoutsize: var(--backgroundsize);
  --popoutblur: 0px;
  --backdropsize: var(--backgroundsize);
  --backdropblur: 0px;

  /* Colors & Transparency */
  --transparencycolor: 0,0,0;
  --accentcolor: 190,78,180;
  --backdrop: rgba(0,0,0,0.85);
  --textshadow: transparent;
  --transparencyalpha: 0.15;
  --messagetransparency: 0.5;
  --guildchanneltransparency: 0.15;
  --chatinputtransparency: 0;
  --memberlisttransparency: 0;

  /* Text Colors */
  --textbrightest: 255,255,255;
  --textbrighter: 222,222,222;
  --textbright: 200,200,200;
  --textdark: 160,160,160;
  --textdarker: 125,125,125;
  --textdarkest: 90,90,90;

  /* Metadata */
  --settingsicons: 1;
  --version1_0_5: none;

  /* Disable the static background variable to allow the animation */
  --background: none !important;
}

/* 1. DEFINE YOUR 10 IMAGES HERE */
@keyframes backgroundCycle {
  0%, 9% { background-image: url('https://i.imgur.com/6RRoAYC.png'); }
  10%, 19% { background-image: url('https://i.imgur.com/oWZ0NkC.png'); }
  20%, 29% { background-image: url('https://i.imgur.com/0KTjahx.png'); }
  30%, 39% { background-image: url('https://i.imgur.com/uyG6NSR.png'); }
  40%, 49% { background-image: url('https://i.imgur.com/LiADLcj.png'); }
  50%, 59% { background-image: url('https://i.imgur.com/LyaQu91.png'); }
  60%, 69% { background-image: url('https://i.imgur.com/umxPCqQ.png'); }
  70%, 79% { background-image: url('https://i.imgur.com/UV3eCG9.png'); }
  80%, 89% { background-image: url('https://i.imgur.com/bVqrNnq.png'); }
  90%, 99% { background-image: url('https://i.imgur.com/DgrQMTi.png'); }
  100% { background-image: url('https://i.imgur.com/8OOKCLm.png'); }
}

/* 2. APPLY THE ANIMATION */
body::before {
  content: "" !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-size: var(--backgroundsize) !important;
  background-position: var(--backgroundposition) !important;
  background-repeat: no-repeat !important;
  filter: blur(var(--backgroundblur)) !important;

  /* Duration is 100 seconds (10 seconds per image) */
  animation: backgroundCycle 100s infinite !important;

  z-index: -1 !important;
  pointer-events: none !important;
}