omlink.scss 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. /**
  2. * Main SCSS file
  3. *
  4. * @author Open Mind
  5. * @date 27/06/2018
  6. * @time 17:42
  7. * @since 18/07/2018 in SCSS format
  8. */
  9. // DEFAULTS
  10. // Background color
  11. $mainColor: #eeeeee !important;
  12. // Main text color
  13. $textColor: white !important;
  14. // Upper and Lower navbar background color
  15. $navbarsColor: rgba(94, 107, 116, 0.95) !important;
  16. // drop-shadow and box-shadow color
  17. $shadowColor: #444444;
  18. // All input tag colors
  19. $inputBgColor: rgb(77, 80, 153) !important;
  20. $inputColor: white !important;
  21. @import '../customizations/dimatec';
  22. //@import '../customizations/lamborghini';
  23. html, body {
  24. height: 100%;
  25. }
  26. body {
  27. background-color: $mainColor;
  28. color: $textColor;
  29. font-family: 'Roboto';
  30. }
  31. /* latin */
  32. @font-face {
  33. font-family: 'Roboto';
  34. font-style: normal;
  35. font-weight: 400;
  36. src: local('Roboto'), local('Roboto-Regular'), url('ui/fonts/Roboto-Regular.ttf') format('truetype');
  37. unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  38. }
  39. .error_body {
  40. background-image: url('ui/images/error_bg.png');
  41. background-repeat: no-repeat;
  42. background-size: cover;
  43. }
  44. .error_body .card {
  45. opacity: 0.9;
  46. }
  47. /*
  48. input[type="text"], input[type="password"] {
  49. border-color: #C5AC0F !important;
  50. background-color: #484848 !important;
  51. }
  52. input[type="text"]:focus, input[type="password"]:focus {
  53. border-color: #C5AC0F !important;
  54. color: #ffd242 !important;
  55. }
  56. */
  57. /*input {
  58. border-color: darken($inputBgColor, 10%);
  59. color: darken($inputColor, 10%);
  60. }
  61. input:focus {
  62. background-color: $inputBgColor !important;
  63. border-color: $inputColor !important;
  64. }*/
  65. .form-control, .btn {
  66. background-color: $inputBgColor !important;
  67. color: $inputColor !important;
  68. }
  69. .form-control:focus, .btn:focus {
  70. // border-color: #c5ac0f !important;
  71. background-color: lighten($inputBgColor, 8%) !important;
  72. border-color: darken($inputBgColor, 10%) !important;
  73. box-shadow: 0 0 10px $inputBgColor !important;
  74. }
  75. .form-control:disabled {
  76. color: darken($inputColor, 10%) !important;
  77. background-color: darken($inputBgColor, 8%) !important;
  78. }
  79. .debugborder {
  80. border: 1px solid red !important;
  81. }
  82. .disablebutton {
  83. opacity: 0.4;
  84. }
  85. .imgbuttonmenu {
  86. max-height: 180px !important;
  87. border-radius: 10px !important;
  88. }
  89. .om-shadow {
  90. filter: drop-shadow(0px 0.2em 5px $shadowColor);
  91. }
  92. input::placeholder {
  93. color: $placeholderColor;
  94. }
  95. input::-ms-input-placeholder {
  96. color: $placeholderColor;
  97. }
  98. .navbar {
  99. background-color: $navbarsColor;
  100. }
  101. .rounded {
  102. border-radius: 15px !important;
  103. }
  104. @mixin prefix($property, $parameters...) {
  105. @each $prefix in -webkit-, -moz-, -ms-, -o-, "" {
  106. #{$prefix}#{$property}: $parameters;
  107. }
  108. }
  109. // Blink Effect
  110. @keyframes blink {
  111. 0% {
  112. // @include prefix(opacity, 0);
  113. background-color: lighten(#28a745, 40%);
  114. }
  115. 100% {
  116. // @include prefix(opacity, 1);
  117. background-color: darken(#28a745, 10%);
  118. }
  119. }
  120. @-webkit-keyframes blink {
  121. 0% {
  122. // @include prefix(opacity, 0);
  123. background-color: lighten(#28a745, 40%);
  124. }
  125. 100% {
  126. // @include prefix(opacity, 1);
  127. background-color: darken(#28a745, 10%);
  128. }
  129. }
  130. .blink {
  131. @include prefix(transition, all 0.1s ease-in-out);
  132. @include prefix(animation, blink alternate 1s infinite ease-in-out);
  133. }