9,821
edits
Changes
Jump to navigation
Jump to search
Template:Relatable suite (view source)
Revision as of 00:15, 25 January 2024
, 00:15, 25 January 2024Undo revision 110791 by GopyXP (talk)
Line 1:
Line 1:
@property --inner{
− syntax: '<color>';
− initial-value: #FEA3E0;
− inherits: false;
−}
−@property --middle{
− syntax: '<color>';
− initial-value: #fff985;
− inherits: false;
−}
−@property --outer{
− syntax: '<color>';
− initial-value: #37D2FF;
− inherits: false;
−}
background-image: radial-gradient(var(--inner) 0%, var(--middle) 50%, var(--outer) 100%);
{{#css:
{{#css:
−body {
body {
animation: color-change 2s ease infinite;
animation: color-change 2s ease infinite;
background-repeat: no-repeat;
background-repeat: no-repeat;
background-attachment: fixed;
background-attachment: fixed;
−}
}
#mw-page-base {
#mw-page-base {
Line 32:
Line 16:
}
}
@keyframes color-change {
@keyframes color-change {
−0%,100% { --inner:#FEA3E0; --middle:#fff985; --outer:#37D2FF; }
+0%,100% { background-image: radial-gradient(#FEA3E0 0%, #fff985 50%, #37D2FF 100%); }
−33% { --inner:#37D2FF; --middle:#FEA3E0; --outer:#fff985; }
+33% { background-image: radial-gradient(#37D2FF 0%, #FEA3E0 50%, #fff985 100%); }
−66% { --inner:#fff985; --middle:#37D2FF; --outer:#FEA3E0; }
+66% { background-image: radial-gradient(#fff985 0%, #37D2FF 50%, #FEA3E0 100%); }
}
}
}}
}}