Files
App-Installer-For-Windows-8…/shared/html/manager/appitem.css

225 lines
4.6 KiB
CSS

.appitem {
padding: 10px;
box-sizing: border-box;
height: 60px;
width: 460px;
max-width: 100%;
display: -ms-flexbox;
/* IE10 */
display: flex;
-ms-flex-direction: row;
/* IE10 */
flex-direction: row;
-ms-flex-wrap: nowrap;
/* IE10 */
flex-wrap: nowrap;
-ms-flex-line-pack: start;
/* IE10 -> align-content */
align-content: flex-start;
-ms-flex-pack: start;
/* IE10 -> justify-content */
justify-content: flex-start;
transition: all 0.3s cubic-bezier(0.1, 0.9, 0.2, 1);
}
.appitem:hover {
background-color: rgba(242, 242, 242, 1);
}
.appitem:active {
transform: scale(0.9695);
-ms-transform: scale(0.9695);
}
.appitem div[role=img] {
width: 40px;
height: 40px;
background-color: #464646;
display: -ms-flexbox;
/* IE10 */
display: flex;
-ms-flex-direction: row;
/* IE10 */
flex-direction: row;
-ms-flex-wrap: nowrap;
/* IE10 */
flex-wrap: nowrap;
-ms-flex-pack: center;
/* IE10 -> justify-content */
justify-content: center;
-ms-flex-align: center;
/* IE10 -> align-items */
align-items: center;
-ms-flex-line-pack: center;
/* IE10 -> align-content */
align-content: center;
overflow-x: hidden;
overflow-y: hidden;
transition: all 0.3s cubic-bezier(0.1, 0.9, 0.2, 1);
}
.appitem div[role=img] img {
width: 30px;
height: 30px;
}
.appitem div[role=divide] {
width: 10px;
min-width: 10px;
height: 100%;
}
.appitem div[role=excepticon] div[role=title] {
font-weight: normal;
flex: 1;
-ms-flex: 1;
width: 100%;
overflow-x: hidden;
overflow-y: hidden;
text-overflow: ellipsis;
}
.appitem div[role=excepticon] div[role=advance] {
display: none;
opacity: 0;
height: 0;
transition: all 0.3s cubic-bezier(0.1, 0.9, 0.2, 1);
}
.appitem.selected div[role=excepticon] div[role=advance] {
display: block;
opacity: 1;
height: auto;
}
.appitem div[role=excepticon] {
-ms-flex: 1;
flex: 1;
display: -ms-flexbox;
/* IE10 */
display: flex;
-ms-flex-direction: column;
/* IE10 */
flex-direction: column;
-ms-flex-wrap: nowrap;
/* IE10 */
flex-wrap: nowrap;
-ms-flex-line-pack: start;
/* IE10 -> align-content */
align-content: flex-start;
-ms-flex-pack: start;
/* IE10 -> justify-content */
justify-content: flex-start;
width: calc(100% - 40px - 10px);
}
.appitem div[role=excepticon] div[role=control] {
display: none;
/* IE10 */
-ms-flex-direction: row-reverse;
/* IE10 */
flex-direction: row-reverse;
-ms-flex-wrap: wrap;
/* IE10 */
flex-wrap: wrap;
-ms-flex-line-pack: end;
/* IE10 -> align-content */
align-content: flex-end;
-ms-flex-pack: start;
/* IE10 -> justify-content */
justify-content: flex-start;
-ms-flex-align: center;
/* IE10 -> align-items */
align-items: center;
transition: all 0.3s cubic-bezier(0.1, 0.9, 0.2, 1);
opacity: 0;
height: 0;
}
.appitem.selected {
height: 119px;
background-color: rgba(232, 232, 232, 1);
}
.appitem.selected div[role=excepticon] div[role=control] {
display: flex;
display: -ms-flexbox;
opacity: 1;
height: auto;
}
ul.appitem-list,
ul.appitem-list li {
margin: 0;
padding: 0;
list-style: none;
}
.appitem .displayName,
.appitem .publisher {
text-overflow: ellipsis;
overflow-x: hidden;
overflow-y: hidden;
white-space: nowrap;
max-width: 100%;
}
.appitem .publisher {
color: rgb(102, 102, 102);
}
.app-loading {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-content: center;
justify-content: flex-start;
align-items: center;
width: 100%;
height: auto;
}
.app-loading.noloading progress {
display: none;
}
.app-loading .title {
margin-left: 10px;
}
.app-loading.noloading .title {
margin-left: 0;
}
.app-detailpage header {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: flex-start;
justify-content: flex-start;
overflow-x: hidden;
overflow-y: hidden;
text-overflow: ellipsis;
width: 100%;
height: 67px;
box-sizing: border-box;
max-width: 100%;
}
.app-detailpage header .win-backbutton {
width: 35px;
height: 35px;
font-size: 11.9pt;
line-height: 32px;
min-width: 35px;
min-height: 35px;
}
.app-detailpage header .display-name {
padding-left: 10px;
box-sizing: border-box;
width: calc(100% - 35px - 10px);
overflow-y: hidden;
overflow-x: hidden;
text-overflow: ellipsis;
}