Difference between revisions of "MediaWiki:Common.css"

From BiblePay Wiki
Jump to: navigation, search
Line 1: Line 1:
 
/* CSS placed here will be applied to all skins */
 
/* CSS placed here will be applied to all skins */
 
+
@keyframes example {
 +
    0%  {background-color:red; left:0px; top:0px;}
 +
    25%  {background-color:yellow; left:200px; top:0px;}
 +
    50%  {background-color:blue; left:200px; top:200px;}
 +
    75%  {background-color:green; left:0px; top:200px;}
 +
    100% {background-color:#971b20; left:0px; top:0px;}
 +
}
  
 
.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}
 
.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}
Line 11: Line 17:
 
{
 
{
 
color:#fff!important;background-color:#971b20!important;
 
color:#fff!important;background-color:#971b20!important;
 
+
animation-name: example;
 +
animation-duration: 4s;
 
background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
 
background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
  

Revision as of 17:31, 10 March 2018

/* CSS placed here will be applied to all skins */
@keyframes example {
    0%   {background-color:red; left:0px; top:0px;}
    25%  {background-color:yellow; left:200px; top:0px;}
    50%  {background-color:blue; left:200px; top:200px;}
    75%  {background-color:green; left:0px; top:200px;}
    100% {background-color:#971b20; left:0px; top:0px;}
}

.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}

.b1 {background-color:green;
transition: all 300ms ease-in-out;
}

.w3-blue,.w3-hover-blue:hover
{
color:#fff!important;background-color:#971b20!important;
animation-name: example;
animation-duration: 4s;
background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);

transition: all 300ms ease-in-out;
animation:motion 2s infinite ease;
}

.w3-blue:hover
{
  xbackground-position: -99.99% 0;
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 50%, orange 50%);
}

.th1 {background-color:black;color=green}