|
|
|
|
| hr {
|
| border-color: grey;
|
| background-color: grey;
|
| opacity: 0.25;
|
| }
|
|
|
| .instruction_AC {
|
| font-family: cursive;
|
| font-size: 18px;
|
| color: grey;
|
| user-select: none;
|
| cursor: default;
|
| }
|
|
|
|
|
|
|
|
|
| .container_AC {
|
| position: relative;
|
| background-color: #232323;
|
| width: 800px;
|
| height: auto;
|
| padding: 15px;
|
| border-radius: 15px;
|
| box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
|
| margin-bottom: 5px;
|
| overflow: visible;
|
| }
|
|
|
| .container_AC::before {
|
| position: absolute;
|
| top: 5px;
|
| right: 10px;
|
| content: "AutoCleanerV3.7";
|
| font-weight: bold;
|
| font-size: 24px;
|
| color: rgba(0, 0, 0, 0.2);
|
| }
|
|
|
| .container_AC::after {
|
| position: absolute;
|
| top: 30px;
|
| right: 10px;
|
| content: "ANXETY";
|
| font-weight: bold;
|
| font-size: 18px;
|
| color: rgba(0, 0, 0, 0.2);
|
| }
|
|
|
| .custom-select-multiple_AC select {
|
| padding: 10px;
|
| font-family: cursive;
|
| border: 1px solid #262626 !important;
|
| border-radius: 10px;
|
| color: white;
|
| background-color: #1c1c1c;
|
| box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
|
| }
|
|
|
| .output_AC {
|
| padding: 10px;
|
| height: auto;
|
| border: 1px solid #262626;
|
| border-radius: 10px;
|
| background-color: #1c1c1c;
|
| box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
|
| width: auto;
|
| box-sizing: border-box;
|
| }
|
|
|
| .output_message_AC {
|
| font-family: cursive;
|
| color: white !important;
|
| font-size: 14px;
|
| user-select: none;
|
| cursor: default
|
| }
|
|
|
|
|
| .storage_info_AC {
|
| padding: 5px 20px;
|
| height: auto;
|
| border: 1px solid #262626;
|
| border-radius: 10px;
|
| background-color: #1c1c1c;
|
| box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
|
| width: auto;
|
| font-family: cursive;
|
| color: #B2B2B2 !important;
|
| font-size: 14px;
|
| user-select: none;
|
| cursor: default
|
| }
|
|
|
|
|
|
|
| .lower_information_panel_AC {
|
| display: flex;
|
| align-items: center;
|
| justify-content: space-between;
|
| }
|
|
|
|
|
|
|
|
|
| .button_AC {
|
| width: auto;
|
| font-family: cursive;
|
| color: white !important;
|
| font-size: 14px;
|
| font-weight: bold;
|
| height: 35px;
|
| border-radius: 15px;
|
| background-image: radial-gradient(circle at top left, purple 10%, violet 90%);
|
| background-size: 200% 200%;
|
| background-position: left bottom;
|
| transition: background 0.5s ease-in-out, transform 0.3s ease;
|
| }
|
|
|
| .button_AC:hover {
|
| cursor: pointer;
|
| background-size: 200% 200%;
|
| background-position: right bottom;
|
| transform: translateY(1px);
|
| }
|
|
|
| .button_execute_AC:hover {
|
| background-image: radial-gradient(circle at top left, purple 10%, #93ac47 90%);
|
| }
|
|
|
| .button_clear_AC:hover {
|
| background-image: radial-gradient(circle at top left, purple 10%, #fc3468 90%);
|
| }
|
|
|
| .button_execute_AC:active,
|
| .button_clear_AC:active {
|
| filter: brightness(0.75);
|
| }
|
|
|
| .jupyter-widgets.lm-Widget:focus {
|
| outline: none;
|
| }
|
|
|
|
|
|
|
|
|
|
|
| .container_AC {
|
| animation-name: slideInTopBlur;
|
| animation-duration: 0.7s;
|
| animation-fill-mode: forwards;
|
| }
|
|
|
| @keyframes slideInTopBlur {
|
| 0% {
|
| transform: translate3d(0, 50%, 0) scale(0.85) rotate3d(1, 0, 0, -85deg);
|
| filter: blur(5px) grayscale(1) brightness(0.5);
|
| opacity: 0;
|
| }
|
| 100% {
|
| transform: translate3d(0, 0, 0) scale(1) rotate3d(1, 0, 0, 0deg);
|
| filter: blur(0) grayscale(0) brightness(1);
|
| opacity: 1;
|
| }
|
| }
|
|
|
|
|
| .container_AC.hide {
|
| animation-name: slideOutTopBlur;
|
| animation-duration: 0.3s;
|
| animation-fill-mode: forwards;
|
| }
|
|
|
| @keyframes slideOutTopBlur {
|
| 0% {
|
| transform: translate3d(0, 0, 0) scale(1);
|
| filter: blur(0) grayscale(0) brightness(1);
|
| opacity: 1;
|
| }
|
| 100% {
|
| transform: translate3d(0, -100%, 0);
|
| filter: blur(5px) grayscale(1) brightness(0);
|
| opacity: 0;
|
| }
|
| } |
