You are here

Home » API reference » Floating Social Icons 8

floating_social_admin.css in Floating Social Icons 8 

/*CSS for admin panel */

.floating-block .form-item-settings-floating-icons-hover {
  float: left;
  margin-left: 20px;
  margin-top: 10px !important;
}

.floating-block .form-item-settings-floating-icons-hover label {
  background-color: #0878be;
  border: none;
  color: white;
  padding: 8px 12px;
  text-align: center;
  display: inline-block;
  font-size: 15px;
  margin: 4px 2px;
  cursor: pointer;
}

.floating-block label[for=edit-settings-floating-icons-hover-grow]:hover {
  z-index: 10;
  -webkit-box-shadow: 1px 1px 1px 1px #333;
  -moz-box-shadow: 1px 1px 1px 1px #333;
  box-shadow: 1px 1px 1px 1px #333;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.floating-block label[for=edit-settings-floating-icons-hover-shrink]:hover {
  z-index: 10;
  -webkit-box-shadow: 1px 1px 1px 1px #333;
  -moz-box-shadow: 1px 1px 1px 1px #333;
  box-shadow: 1px 1px 1px 1px #333;
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
}

.floating-block label[for=edit-settings-floating-icons-hover-black-white]:hover {
  z-index: 10;
  color: #ffffff;
  background: #000000;
  -webkit-box-shadow: 1px 1px 1px 1px #333;
  -moz-box-shadow: 1px 1px 1px 1px #333;
  box-shadow: 1px 1px 1px 1px #333;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.floating-block label[for=edit-settings-floating-icons-hover-white-black]:hover {
  z-index: 10;
  color: #000000;
  background: #ffffff;
  -webkit-box-shadow: 1px 1px 1px 1px #333;
  -moz-box-shadow: 1px 1px 1px 1px #333;
  box-shadow: 1px 1px 1px 1px #333;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.floating-block label[for=edit-settings-floating-icons-hover-rotate]:hover {
  z-index: 10;
  animation-name: rotate;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

File

css/floating_social_admin.css
View source 
  1. /*CSS for admin panel */

  2. 

  3. .floating-block .form-item-settings-floating-icons-hover {

  4.   float: left;

  5.   margin-left: 20px;

  6.   margin-top: 10px !important;

  7. }

  8. 

  9. .floating-block .form-item-settings-floating-icons-hover label {

  10.   background-color: #0878be;

  11.   border: none;

  12.   color: white;

  13.   padding: 8px 12px;

  14.   text-align: center;

  15.   display: inline-block;

  16.   font-size: 15px;

  17.   margin: 4px 2px;

  18.   cursor: pointer;

  19. }

  20. 

  21. .floating-block label[for=edit-settings-floating-icons-hover-grow]:hover {

  22.   z-index: 10;

  23.   -webkit-box-shadow: 1px 1px 1px 1px #333;

  24.   -moz-box-shadow: 1px 1px 1px 1px #333;

  25.   box-shadow: 1px 1px 1px 1px #333;

  26.   -webkit-transform: scale(1.1);

  27.   -moz-transform: scale(1.1);

  28.   -ms-transform: scale(1.1);

  29.   -o-transform: scale(1.1);

  30.   transform: scale(1.1);

  31. }

  32. 

  33. .floating-block label[for=edit-settings-floating-icons-hover-shrink]:hover {

  34.   z-index: 10;

  35.   -webkit-box-shadow: 1px 1px 1px 1px #333;

  36.   -moz-box-shadow: 1px 1px 1px 1px #333;

  37.   box-shadow: 1px 1px 1px 1px #333;

  38.   -webkit-transform: scale(0.9);

  39.   -moz-transform: scale(0.9);

  40.   -ms-transform: scale(0.9);

  41.   -o-transform: scale(0.9);

  42.   transform: scale(0.9);

  43. }

  44. 

  45. .floating-block label[for=edit-settings-floating-icons-hover-black-white]:hover {

  46.   z-index: 10;

  47.   color: #ffffff;

  48.   background: #000000;

  49.   -webkit-box-shadow: 1px 1px 1px 1px #333;

  50.   -moz-box-shadow: 1px 1px 1px 1px #333;

  51.   box-shadow: 1px 1px 1px 1px #333;

  52.   -webkit-transform: scale(1.1);

  53.   -moz-transform: scale(1.1);

  54.   -ms-transform: scale(1.1);

  55.   -o-transform: scale(1.1);

  56.   transform: scale(1.1);

  57. }

  58. 

  59. .floating-block label[for=edit-settings-floating-icons-hover-white-black]:hover {

  60.   z-index: 10;

  61.   color: #000000;

  62.   background: #ffffff;

  63.   -webkit-box-shadow: 1px 1px 1px 1px #333;

  64.   -moz-box-shadow: 1px 1px 1px 1px #333;

  65.   box-shadow: 1px 1px 1px 1px #333;

  66.   -webkit-transform: scale(1.1);

  67.   -moz-transform: scale(1.1);

  68.   -ms-transform: scale(1.1);

  69.   -o-transform: scale(1.1);

  70.   transform: scale(1.1);

  71. }

  72. 

  73. .floating-block label[for=edit-settings-floating-icons-hover-rotate]:hover {

  74.   z-index: 10;

  75.   animation-name: rotate;

  76.   animation-duration: 1s;

  77.   animation-iteration-count: 1;

  78.   animation-timing-function: linear;

  79. }

  80. 

  81. @keyframes rotate {

  82.   from {

  83.     transform: rotate(0deg);

  84.   }

  85.   to {

  86.     transform: rotate(360deg);

  87.   }

  88. }