framework/extensions/package-manager/less/admin/ControlSection.less
Sami Mazouz 335c602cea chore(package-manager): last tweaks before beta tag
chore: fix workflow errors
chore: fix workflow errors
chore: avoid updating an extension that wasn't directly required
chore: prevent job overlap
chore: reorganize code, separate state from view
fix: update checking ui display
chore: minor improvements

Signed-off-by: Sami Mazouz <ilyasmazouz@gmail.com>
2022-08-20 18:21:02 +01:00

134 lines
2.2 KiB
Plaintext

.PackageManager-lastUpdatedAt {
color: var(--control-color);
&-label {
font-weight: bold;
}
}
.PackageManager-updaterControls {
display: flex;
flex-wrap: wrap;
gap: 8px;
grid-area: controls;
margin-bottom: 16px;
}
.PackageManager-extensions {
&-grid {
--gap: 12px;
display: grid;
grid-template-columns: repeat(auto-fit, calc(~"100% / 3 - var(--gap)"));
gap: var(--gap);
}
}
.PackageManager-extension {
display: flex;
align-items: center;
gap: 8px;
background-color: var(--control-bg);
padding: 8px;
border-radius: var(--border-radius);
&-controls {
margin-left: auto;
}
&-icon {
--size: 40px;
}
&-name {
font-weight: bold;
}
&-version {
display: flex;
align-items: center;
gap: 8px;
&-latest {
text-transform: lowercase;
padding: 2px 6px;
font-size: 0.7rem;
}
}
&--core {
--bg-hover: darken(#e7672e, 5);
background-color: #e7672e;
color: #fff;
--button-color: #fff;
--button-bg-hover: var(--bg-hover);
.Button--danger {
color: #fff;
--button-bg-hover: var(--bg-hover);
}
}
&--core &-icon {
background-size: 100%;
background-color: transparent;
filter: grayscale(1) brightness(3.5);
}
&--danger {
background-color: var(--control-danger-bg);
}
}
.PackageManager-majorUpdate {
--space: 16px;
padding: var(--space);
display: grid;
grid-template-areas:
"title logo"
"helpText logo"
"controls logo"
"extensions extensions"
"failure failure";
grid-gap: 0 var(--space);
align-items: center;
> img {
grid-area: logo;
}
> label {
grid-area: title;
}
> .helpText {
grid-area: helpText;
}
&-failure {
--border-radius: 0;
grid-area: failure;
margin: var(--space) calc(~"0px - var(--space)") calc(~"0px - var(--space)");
}
&-incompatibleExtensions {
grid-area: extensions;
margin-top: var(--space);
padding-top: var(--space);
border-top: 1px solid var(--control-bg);
}
}
.WhyNotModal {
&-contents {
overflow-x: auto;
}
}
.PackageManager-installer .FormControl-container {
max-width: 400px;
.FormControl {
width: 300px;
}
}