.admin-install-theme-modal { .modal-inner-container { width: 100%; } } .install-theme { display: flex; @include breakpoint(mobile-extra-large) { .install-theme-items { flex: 0 0 150px; } .install-theme-content { flex: 1 1 100%; } .select-kit { width: 100%; } } } .install-theme-items { width: 200px; } .install-theme-item { border: 1px solid var(--primary-low); border-bottom: none; position: relative; &:last-child { border-bottom: 1px solid var(--primary-low); } input, .d-icon-caret-right { display: none; } label { display: block; padding: 10px 30px 10px 10px; margin-bottom: 0px; cursor: pointer; } input:checked + label { color: var(--secondary); background-color: var(--tertiary); + .d-icon { display: block; color: var(--secondary); } } .d-icon-caret-right { position: absolute; right: 5px; top: 50%; margin-top: -7px; } } .install-theme-content { padding: 0px 0px 10px 20px; width: calc(100% - 200px); input[type="file"] { width: 100%; overflow: hidden; // Chrome needs this } } .repo { input[type="text"] { width: 90%; } } .popular-theme-items { height: 65vh; overflow: auto; padding-right: 20px; } .popular-theme-item { border-bottom: 1px solid var(--primary-low); padding: 8px 0px; display: flex; align-items: center; .popular-theme-name { flex: 1; .popular-theme-type { font-weight: normal; font-size: $font-down-2; color: var(--primary-medium); } a { color: var(--primary-very-high); font-weight: bold; &:hover, &:visited, &:active { color: var(--primary-high); } } .popular-theme-description { font-size: $font-down-1; padding-right: 20px; } } .popular-theme-buttons { > span { font-style: italic; font-size: $font-down-1; color: var(--primary-medium); margin-right: 8px; } > a { display: block; font-size: $font-down-2; margin-top: 5px; text-align: center; } } } .install-theme-warning { margin-bottom: 10px; }