mirror of https://github.com/glanceapp/glance.git
91 lines
2.2 KiB
CSS
91 lines
2.2 KiB
CSS
@import "widget-bookmarks.css";
|
|
@import "widget-calendar.css";
|
|
@import "widget-clock.css";
|
|
@import "widget-dns-stats.css";
|
|
@import "widget-group.css";
|
|
@import "widget-markets.css";
|
|
@import "widget-reddit.css";
|
|
@import "widget-releases.css";
|
|
@import "widget-rss.css";
|
|
@import "widget-search.css";
|
|
@import "widget-server-stats.css";
|
|
@import "widget-twitch.css";
|
|
@import "widget-videos.css";
|
|
@import "widget-weather.css";
|
|
@import "widget-todo.css";
|
|
@import "forum-posts.css";
|
|
|
|
.widget-error-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
margin-bottom: 1.8rem;
|
|
z-index: 1;
|
|
}
|
|
|
|
.widget-error-header::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: calc(0rem - (var(--widget-content-vertical-padding) / 2)) calc(0rem - (var(--widget-content-horizontal-padding) / 2));
|
|
background: var(--color-negative);
|
|
opacity: 0.05;
|
|
border-radius: var(--border-radius);
|
|
z-index: -1;
|
|
}
|
|
|
|
.widget-error-icon {
|
|
width: 2.4rem;
|
|
height: 2.4rem;
|
|
flex-shrink: 0;
|
|
stroke: var(--color-negative);
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.head-widgets {
|
|
margin-bottom: var(--widget-gap);
|
|
}
|
|
|
|
.widget-content {
|
|
container-type: inline-size;
|
|
container-name: widget;
|
|
}
|
|
|
|
.widget-content:not(.widget-content-frameless) {
|
|
padding: var(--widget-content-padding);
|
|
}
|
|
|
|
.widget-content:not(.widget-content-frameless), .widget-content-frame {
|
|
background: var(--color-widget-background);
|
|
border-radius: var(--border-radius);
|
|
border: 1px solid var(--color-widget-content-border);
|
|
box-shadow: 0px 3px 0px 0px hsl(var(--bghs), calc(var(--scheme) (var(--scheme) var(--bgl)) - 0.5%));
|
|
}
|
|
|
|
.widget-header {
|
|
padding: 0 calc(var(--widget-content-horizontal-padding) + 1px);
|
|
font-size: var(--font-size-h4);
|
|
margin-bottom: 0.9rem;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1rem;
|
|
}
|
|
|
|
.widget-beta-icon {
|
|
width: 1.6rem;
|
|
height: 1.6rem;
|
|
flex-shrink: 0;
|
|
transition: transform .45s, opacity .45s, stroke .45s;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.widget-beta-icon:hover, .widget-header .popover-active > .widget-beta-icon {
|
|
fill: var(--color-text-highlight);
|
|
transform: translateY(-10%) scale(1.3);
|
|
opacity: 1;
|
|
}
|
|
|
|
.widget + .widget {
|
|
margin-top: var(--widget-gap);
|
|
}
|