Skip to content

Commit 031e738

Browse files
chillenbergerchillenberger
authored
Dan db upgrade (#928)
1 parent 54fd582 commit 031e738

File tree

13 files changed

+125
-60
lines changed

13 files changed

+125
-60
lines changed

‎pgml-dashboard/static/css/bootstrap-theme.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,3 +79,4 @@
7979
// base
8080
@import 'scss/base/base';
8181
@import 'scss/base/animations';
82+
@import 'scss/base/typography';

‎pgml-dashboard/static/css/scss/abstracts/variables.scss

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,7 @@ $bg-black: #0D0D0E;
9393
$hp-gradient: linear-gradient(48.19deg, #D940FF 0%, #9E02FE 24.43%, #00D1FF 100%);
9494
$hp-gradient-active: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), linear-gradient(48.19deg, #FB40FF 0%, #BB02FE 24.43%, #00D1FF 100%);
9595

96+
$gradient-text: linear-gradient(270deg, #26CBFF 0%, #808CFF 50%, #C92FFF 100%);
9697
$primary-gradient-main: linear-gradient(45deg, #D940FF 0%, #8F02FE 24.43%, #5162FF 52.60%, #00D1FF 100%);
9798
$gradient-main: linear-gradient(45deg, #FB40FF 0%, #BB02FE 25%, #00D1FF 100%);
9899
$gradient-light: linear-gradient(260.55deg, rgba(255, 255, 255, 0.56) 15.62%, rgba(255, 255, 255, 0.28) 67.01%);
@@ -116,8 +117,21 @@ $btn-transition: none;
116117
$btn-box-shadow: none;
117118

118119
// Forms
119-
$input-padding-y: 20px;
120-
$input-padding-x: 16px;
120+
$input-padding-y: 16px;
121+
$input-padding-x: 20px;
122+
$input-border-width: 2px;
123+
$input-focus-border-color: #{$neon-shade-100};
124+
$input-color: #{$gray-200};
125+
$input-focus-color: #{$gray-200};
126+
$input-placeholder-color: #{$gray-400};
127+
$input-disabled-bg: #{$gray-700};
128+
$input-disabled-color: #{$gray-400};
129+
$input-bg: #{$gray-700};
130+
131+
$input-group-addon-color: #{$gray-300};
132+
$input-group-addon-bg: #{$gray-700};
133+
$input-group-addon-border-color: #{$gray-700};
134+
121135
$input-btn-focus-box-shadow: none;
122136
$form-label-font-weight: 500;
123137
$form-check-input-width: 1.4em;
@@ -144,6 +158,8 @@ $input-box-shadow: none;
144158
$form-switch-checked-color: #{$gray-100};
145159
$form-switch-focus-color: #{$gray-100};
146160

161+
$input-color: #{$gray-400};
162+
147163
// Badge
148164
$badge-font-weight: normal;
149165
$badge-font-size: 0.65em;

‎pgml-dashboard/static/css/scss/base/_animations.scss

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,3 +49,35 @@
4949
}
5050
}
5151
}
52+
53+
@mixin loading-dot($delay, $initial) {
54+
width: 30px;
55+
height: 30px;
56+
opacity: $initial;
57+
border-radius: 30px;
58+
background-color: #{$gray-100};
59+
animation: opacity 3s infinite linear;
60+
animation-delay: $delay;
61+
}
62+
63+
.loading-dot-1 {
64+
@include loading-dot(0s, 0.1);
65+
}
66+
.loading-dot-2 {
67+
@include loading-dot(0.5s, 0.2);
68+
}
69+
.loading-dot-3 {
70+
@include loading-dot(1s, 0.3);
71+
}
72+
73+
@keyframes opacity {
74+
0% {
75+
opacity: 0.1;
76+
}
77+
75% {
78+
opacity: 1;
79+
}
80+
100% {
81+
opacity: 0.1;
82+
}
83+
}

‎pgml-dashboard/static/css/scss/base/_base.scss

Lines changed: 3 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -70,27 +70,13 @@ article {
7070
}
7171
}
7272

73-
74-
.form-control {
75-
border-radius: var(--bs-border-radius-pill);
76-
}
77-
78-
.text-black {
79-
color: #{$gray-900} !important;
80-
}
81-
82-
// Override white overrides.
83-
.text-white {
84-
color: #{$gray-100} !important;
85-
}
86-
8773
.bg-white {
8874
background-color: #{$bg-white} !important;
8975
}
9076

9177
// Our flagship gradient.
9278
.party-time {
93-
background: linear-gradient(270deg, #26CBFF 0%, #808CFF 50%, #C92FFF 100%);
79+
background: $gradient-text;
9480
-webkit-background-clip: text;
9581
-webkit-text-fill-color: transparent;
9682
background-clip: text;
@@ -110,12 +96,6 @@ article {
11096
}
11197
}
11298

113-
// Override text-bg-dark colors.
114-
.text-bg-dark {
115-
color: rgba(219, 219, 220, 1);
116-
background-color: rgba(38, 38, 38, 1) !important;
117-
}
118-
11999
.list-group {
120100
--bs-list-group-bg: transparent;
121101
--bs-list-group-border-width: 0;
@@ -137,7 +117,7 @@ article {
137117
}
138118

139119
.syntax-highlight {
140-
background: linear-gradient(225deg, #3EDCFF 0%, #3E9AFF 100%);
120+
background: $gradient-blue;
141121
-webkit-background-clip: text;
142122
-webkit-text-fill-color: transparent;
143123
background-clip: text;
@@ -152,4 +132,4 @@ article {
152132
-ms-user-select: none; /* Internet Explorer/Edge */
153133
user-select: none; /* Non-prefixed version, currently
154134
supported by Chrome, Edge, Opera and Firefox */
155-
}
135+
}

‎pgml-dashboard/static/css/scss/base/_typography.scss

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
2+
3+
// all other displays are default bootstrap styling
4+
.display-2 {font-weight: 700; font-size: 4rem; line-height: 80px;}
5+
6+
// TODO: Go through html and ensure headers use appropriate header class, header and class do not need to match.
7+
.h1 {font-weight: 700; font-size: 64px; line-height: 72px;}
8+
.h2 {font-weight: 700; font-size: 48px; line-height: 54px;}
9+
.h3 {font-weight: 700; font-size: 40px; line-height: 46px;}
10+
.h4 {font-weight: 700; font-size: 32px; line-height: 40px;}
11+
.h5 {font-weight: 700; font-size: 28px; line-height: 34px;}
12+
.h6 {font-weight: 700; font-size: 24px; line-height: 30px;}
13+
14+
.subcopy-text {font-size: 18px; line-height: 22px}
15+
.body-text {font-size: 16px; line-height: 20px}
16+
.legal-text {font-size: 12px; line-height: 16px;}
17+
18+
.text-black {color: #{$gray-900} !important;}
19+
.text-white {color: #{$gray-100} !important;}
20+
.text-soft-white { color: #{$gray-200} !important; }

‎pgml-dashboard/static/css/scss/components/_badges.scss

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
align-items: center;
66
}
77

8-
.beta-badge {
8+
.version-badge {
99
@extend .badge;
1010
text-transform: uppercase;
1111
color: #{$pink};
@@ -35,3 +35,23 @@
3535
border-left: 5px solid #{$color};
3636
}
3737
}
38+
39+
@mixin deployment-status($color) {
40+
@extend .badge;
41+
border-radius: calc($border-radius / 2);
42+
border: 2px solid $color;
43+
}
44+
45+
.deployment-status-configuring, .deployment-status-creating, .deployment-status-Deploying,
46+
.deployment-status-unhealthy, .deployment-status-updating {
47+
@include deployment-status(#{$teal-tint-800});
48+
}
49+
50+
.deployment-status-online, .deployment-status-backingup, .deployment-status-starting {
51+
@include deployment-status(#{$teal-tint-100})
52+
}
53+
54+
.deployment-status-destroyed, .deployment-status-failover, .deployment-status-stopping,
55+
.deployment-status-stopped, .deployment-status-restarting, .deployment-status-shuttingDown {
56+
@include deployment-status(#{$peach-tint-100})
57+
}

‎pgml-dashboard/static/css/scss/components/_buttons.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,8 +95,8 @@
9595
}
9696

9797
.btn-primary-web-app {
98-
--bs-btn-padding-x: 20px;
99-
--bs-btn-padding-y: 30px;
98+
--bs-btn-padding-x: 30px;
99+
--bs-btn-padding-y: 20px;
100100

101101
--bs-btn-bg: #{$neon-shade-100};
102102
--bs-btn-color: #{$gray-100};

‎pgml-dashboard/static/css/scss/components/_cards.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
// TODO: Use header classes and slim down card-title class.
12
.card {
23
--bs-card-spacer-y: 32px;
34
--bs-card-spacer-x: 32px;

‎pgml-dashboard/static/css/scss/components/_forms.scss

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -266,3 +266,24 @@
266266
cursor: not-allowed;
267267
}
268268
}
269+
270+
.input-group {
271+
border-radius: $input-border-radius;
272+
border: 2px solid transparent;
273+
&:focus-within {
274+
border: 2px solid #{$input-focus-border-color};
275+
}
276+
277+
transition: $input-transition;
278+
background-color: $input-bg;
279+
padding: 16px 14px;
280+
281+
.form-control[type=text] {
282+
border: none;
283+
padding: 0px 6px;
284+
}
285+
.input-group-text {
286+
border: none;
287+
padding: 0px 6px;
288+
}
289+
}

‎pgml-dashboard/static/css/scss/layout/_containers.scss

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -119,13 +119,6 @@
119119
}
120120
}
121121

122-
// displays
123-
.display-2 {
124-
font-size: 4rem;
125-
font-weight: 700;
126-
line-height: 80px;
127-
}
128-
129122
.container>.sticky-top-nav, .container-fluid>.sticky-top-nav {
130123
margin-left: calc(var(--bs-gutter-x) * -0.5);
131124
margin-right: calc(var(--bs-gutter-x) * -0.5);

0 commit comments

Comments
 (0)