%PDF- %PDF-
Direktori : /var/www/html/itworks/wp-content/plugins/thim-core/admin/assets/scss/dashboard/ |
Current File : /var/www/html/itworks/wp-content/plugins/thim-core/admin/assets/scss/dashboard/_importer.scss |
.tc-importer-wrapper { .thim-demo { position: relative; .thim-screenshot { img { transition: all 200ms ease-out; } } &:hover { .thim-screenshot { img { } } } &.installed { .status { display: block; } } .status { position: absolute; top: 0; left: 0; z-index: 9; background-color: #0085ba; color: #fff; padding: 0.8em 1.6em; transition: all 300ms ease-out; display: none; &:before { content: attr(data-install); } &:hover { cursor: pointer; background-color: #EF5350; &:before { content: attr(data-text); } } } } @media only screen and (min-width: 1640px) { .theme-browser { .theme { width: 30%; margin: 0 3% 3% 0; } } } } .tc-modal-importer { &.importing { .md-content { .title { position: relative; .close { visibility: hidden; } &:before { //content: ''; //border: 1px solid rgba(0, 0, 0, 0.1); //border-top: 1px solid #3498db; //border-radius: 50%; //width: 0.8em; //height: 0.8em; //animation: spinner 0.8s linear infinite; //position: absolute; //z-index: 2; //top: 0.6em; //left: 20px; } } } .main { .options { .package { &:hover { cursor: default !important; } } } } #start-import { &:before { content: attr(data-importing); } } .footer { .text-waiting { opacity: 1; } } } &.completed { #start-import { &:before { content: attr(data-completed); } } .wrapper-finish { opacity: 1; display: block; z-index: 99; } } .title { .demo-name { &:before { content: "\f345"; font-family: Dashicons; font-size: 0.6em; padding-right: 0.4em; position: relative; top: -0.1em; } } } .main { position: relative; z-index: 0; form { margin: 0; } h4 { font-size: 1.2em; margin: 0; line-height: 2; padding: 1em 1em 1em 2em; border-bottom: 1px solid #eee; } .plugins-required { > span { &[data-status="active"] { font-weight: bold; } &[data-status="not_installed"] { color: #999; } } } .options { margin: 0; .package { margin: 0; padding: 1em 1em 1em 5em; border-bottom: 1px solid #eee; position: relative; &:before { content: ''; width: 5em; height: 5em; display: block; position: absolute; top: 0; left: 0; z-index: 2; } &.obligatory { input:checked { &:before { color: #616161; } } } .package-progress-bar { display: block; height: 100%; position: absolute; left: 0; width: 0; background: #bae0ec; top: 0; opacity: 0.1; pointer-events: none; transition: all 0.5s; } &.disabled { display: none; } &[data-status="running"] { label { &:before { opacity: 1; } input, &:after { opacity: 0; } } .package-progress-bar { min-width: 1% !important; } } &[data-status="completed"] { label { &:after { opacity: 1; } input, &:before { opacity: 0; } } &:after { //content: attr(data-percentage); } } &:not(.obligatory):hover { background-color: #eee; cursor: pointer; } label { position: absolute; top: 50%; left: 2em; transform: translateX(0) translateY(-50%); width: 1em; height: 1em; &:before, &:after, input { transition: all 0.3s ease-out; } &:before { content: ''; border: 1px solid rgba(0, 0, 0, 0.1); border-top: 1px solid #3498db; border-radius: 50%; width: 1em; height: 1em; animation: spinner 0.8s linear infinite; top: 2px; position: absolute; z-index: 2; opacity: 0; } &:after { content: "\f147"; font-family: Dashicons; font-size: 1.5em; color: #4CAF50; opacity: 0; z-index: 1; } input { top: 5px; position: absolute; z-index: 0; } } .heading { font-weight: 500; line-height: 2; } .info { color: #F44336; font-size: 0.8em; font-style: italic; margin-top: 0.5em; position: relative; z-index: 10; } } } } #start-import { &:before { content: attr(data-text); } } .footer { .text-waiting { float: right; line-height: 3em; padding-right: 1em; opacity: 0; transition: all 300ms ease-out; } } .wrapper-finish { position: absolute; top: 4.7em; left: 0; right: 0; bottom: 0; background-color: rgba(255, 255, 255, 0.9); opacity: 0; z-index: -1; display: none; transition: all 0.3s ease-out; .full-box { height: 100%; position: relative; .middle { position: absolute; width: 100%; top: 50%; transform: translateY(-50%); } .notification { .icon { font-size: 10em; display: block; min-height: 100px; text-decoration: none; &:before { font-family: Dashicons; } } .details-success, .details-error { display: none; } } } &.success { .notification { .icon { &:before { color: #4CAF50; content: "\f328"; } } .details-success { display: block; } .leave-five-stars { display: inline-block; padding: 10px; } } } &.failed { .try-again { display: none; padding: 1em; } &.retry { .get-support { display: none; } .try-again { display: block; } } .notification { .icon { &:before { color: #9E9E9E; content: "\f153"; } } .details-error { display: block; .how-to { font-size: 1.2em; line-height: 1.5; background-color: #eee; padding: 2em; max-height: 100px; overflow-y: scroll; &:before { content: "\f348"; font-family: Dashicons; color: #2196F3; padding-right: 1em; } } .get-support { padding: 1em; line-height: 3; a { margin-right: 1em; } } } } } } } .tc-modal-importer-uninstall { .warning { color: #F44336; font-size: 20px; } &.running { .title { .close { visibility: hidden; } } } .main { padding-top: 40px; padding-bottom: 100px; .tc-start { margin-bottom: 2em; } } .notifications { > * { display: none; } .tc-success { color: #22BB33; } .tc-error { color: #F0AD4E; } } }