Skip to content

Commit 1fa924f

Browse files
awolfdenAdam Wolfman
andauthored
Update directory sync app and logos for all apps (#38)
Co-authored-by: Adam Wolfman <[email protected]>
1 parent b5105d5 commit 1fa924f

File tree

18 files changed

+473
-246
lines changed

18 files changed

+473
-246
lines changed

python-django-admin-portal-example/workos_django/admin_portal/templates/admin_portal/index.html

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,7 @@
88
<body class="container_login">
99
<div class='flex_column'>
1010
<div class="flex heading_div">
11-
<img src="../static/images/workos_logo_new.png" alt="workos logo">
12-
<div class="heading_text_div">
13-
<h1>WorkOS</h1>
14-
</div>
11+
<img src="../static/images/workos-logo-with-text.png" alt="workos logo">
1512
</div>
1613

1714
<h2>Python Admin Portal Example App</h2>

python-django-directory-sync-example/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
# python-django-directory-sync-example
2-
A basic Django app that uses the [WorkOS Python SDK](https://github.com/workos-inc/workos-python) to support Directory Sync.
2+
A basic Django app that uses the [WorkOS Python SDK](https://github.com/workos/workos-python) to support Directory Sync.
33

44
## Prerequisites
55
- Python 3.6+
@@ -16,14 +16,14 @@ If you get stuck, please reach out to us at [email protected] so we can help.
1616
1. Clone the main git repo for these Python example apps using your preferred secure method (HTTPS or SSH).
1717
```bash
1818
# HTTPS
19-
$ git clone https://github.com/workos-inc/python-django-example-applications.git
19+
$ git clone https://github.com/workos/python-django-example-applications.git
2020
```
2121

2222
or
2323

2424
```bash
2525
# SSH
26-
$ git clone [email protected]:workos-inc/python-django-example-applications.git
26+
$ git clone [email protected]:workos/python-django-example-applications.git
2727
```
2828

2929
2. Navigate to the Directory Sync example app within the cloned repo.

python-django-directory-sync-example/directory_sync/static/css/main.css

Lines changed: 170 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
body {
22
font-family: Inter, sans-serif;
3+
background-color: #f9f9fb;
4+
35
}
46

57
.container_login {
@@ -34,20 +36,30 @@ body {
3436
align-items: center;
3537
}
3638

37-
.flex_right {
38-
justify-content: flex-end;
39+
.space-between {
40+
justify-content: space-between;
3941
}
4042

41-
.flex_space_between {
42-
justify-content: space-between;
43+
.space-evenly {
44+
justify-content: space-evenly;
4345
}
4446

45-
.hidden {
46-
display: none;
47+
.flex-right {
48+
justify-content: right;
4749
}
4850

49-
.margin_top {
50-
margin-top: 15px;
51+
.width-75 {
52+
width: 75%;
53+
}
54+
55+
.width-40vw {
56+
width: 40vw;
57+
overflow: scroll;
58+
word-wrap: break-word;
59+
}
60+
61+
.width-95 {
62+
width: 95%;
5163
}
5264

5365
.container_success {
@@ -80,33 +92,38 @@ body {
8092
border: 2px solid #6363f1;
8193
border-radius: 26px;
8294
color: white;
83-
padding: 16px 32px;
95+
padding: 8px 16px;
8496
text-align: center;
8597
text-decoration: none;
8698
display: inline-block;
8799
font-size: 16px;
88100
margin: 4px 2px;
89101
transition-duration: 0.4s;
90102
cursor: pointer;
91-
}
92-
93-
.button:hover {
103+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
104+
}
105+
106+
.button-outline {
107+
background-color: #f9f9fb;
108+
color: #6363f1;
109+
padding: 8px 16px;
110+
}
111+
112+
.button:hover,
113+
.button-outline:hover {
94114
background-color: #555555;
95115
border: 2px solid #555555;
96116
color: white;
97117
}
98118

99-
.button_outline {
100-
background-color: #ffffff;
101-
color: #6363f1;
102-
border-color: #6363f1;
119+
.sales-button {
120+
margin-left: 10px;
103121
}
104122

105-
.login_button {
106-
width: 95%;
107-
}
108123

109-
h2, h1 {
124+
125+
h2,
126+
h1 {
110127
text-align: center;
111128
color: #555555;
112129
}
@@ -120,16 +137,18 @@ h2, h1 {
120137
align-items: center;
121138
position: relative;
122139
bottom: 10%;
123-
140+
/* background-color: #f9f9fb; */
124141
}
142+
125143
.logged_in_div_left {
126144
width: 40%;
127145
height: 100vh;
128146
display: flex;
129147
flex-direction: column;
130148
justify-content: center;
131-
align-items: center;
132-
background-color: #dad8d8;
149+
align-items: left;
150+
background-color: #f9f9fb;
151+
margin-left: 4vw;
133152
}
134153

135154
.logged_in_div_left div {
@@ -147,41 +166,72 @@ h2, h1 {
147166
letter-spacing: -.05em;
148167
}
149168

150-
.logged_in_div_left h2 {
151-
color: #6363f1;
152-
font-size: 75px;
169+
.home-hero-gradient {
170+
background-image: linear-gradient(45deg, #a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0));
171+
background-size: 150% 100%;
172+
background-repeat: no-repeat;
173+
-webkit-background-clip: text;
174+
-webkit-text-fill-color: transparent;
175+
background-clip: text;
176+
animation: intro-gradient 1.2s cubic-bezier(0.85, 0.26, 0.89, 0.93);
177+
animation-iteration-count: 1;
178+
animation-fill-mode: backwards;
179+
animation-delay: 0.4s;
153180
text-align: left;
154-
margin-top: 0px;
155-
font-weight: normal;
181+
font-size: 75px;
156182
letter-spacing: -.05em;
183+
font-weight: normal;
184+
margin-top: 0px;
185+
}
186+
187+
.title-text {
188+
margin-bottom: -50px;
189+
}
190+
191+
.title-subtext {
192+
color: gray;
193+
line-height: 10px;
194+
margin-bottom: 15px;
195+
font-weight: 200;
157196
}
158197

159198
.logged_in_div_left button {
160199
padding: 8px 22px;
200+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
201+
}
202+
203+
.logged_in_div_right button {
204+
padding: 8px 22px;
205+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
161206
}
162207

163208
div.text_box {
164-
background-color: #dad8d8;
165-
border-radius: 5px;
166-
border: 2px solid #6363f1;
167-
width: 75%;
168-
max-height: 400px;
169-
overflow: scroll;
209+
background-color: #f9f9fb;
210+
width: 40vw;
211+
max-height: 30vh;
170212
padding: 10px;
171213
word-wrap: break-word;
214+
overflow: scroll;
215+
border-width: 3px;
216+
border-style: solid;
217+
border-image:
218+
linear-gradient(#a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0)) 0 100%;
172219
}
173220

174221
.logged_in_nav {
175222
display: flex;
176223
justify-content: space-between;
177-
background-color: #6363f1;
224+
background-color: #f9f9fb;
178225
height: 60px;
179-
padding: 7px 7px 7px 10px;
226+
padding: 15px 30px 15px 30px;
227+
228+
z-index: 1000;
180229
}
230+
181231
.logged_in_nav p {
182232
padding: 4px 0px 0px 15px;
183233
line-height: 1;
184-
color: white;
234+
color: #29363d;
185235
}
186236

187237
.logged_in_nav img {
@@ -194,10 +244,90 @@ div.text_box {
194244
border: 2px solid #555555;
195245
}
196246

197-
.webhooks_container {
247+
.nav-item {
248+
color: black;
249+
border: 2px solid #f9f9fb;
250+
background-color: #f9f9fb;
251+
box-shadow: none;
252+
border-radius: 5px;
253+
}
254+
255+
.blog-nav-button {
256+
margin-right: 20px;
257+
background-color: #f9f9fb;
258+
border: 2px solid #f9f9fb;
259+
}
260+
261+
.directory-buttons {
262+
justify-content: space-between;
263+
width: 40vw;
264+
}
265+
266+
.nav-item:hover {
267+
background-color: #f9f9fb;
268+
border: 2px solid #f9f9fb;
269+
color: #a6a4a4;
270+
}
271+
272+
pre.prettyprint {
273+
border: none !important;
274+
}
275+
276+
ul {
277+
list-style-type: none;
278+
margin-right: 35px;
279+
text-decoration: none;
280+
}
281+
282+
li {
283+
padding: 6px;
284+
}
285+
286+
a:link {
287+
text-decoration: none;
288+
}
289+
290+
a:visited {
291+
text-decoration: none;
292+
}
293+
294+
li.even {
295+
background-color: rgb(228, 228, 228);
296+
}
297+
298+
.card {
299+
border: 1px solid #555555;
300+
border-radius: 10px;
301+
margin: 0px 15px 0px 15px;
302+
padding: 25px 50px;
303+
margin-bottom: 20px;
304+
text-align: center;
305+
}
306+
307+
.webhooks-container {
198308
width: 45vw;
199-
background-color: #dad8d8;
200309
padding: 25px;
201-
max-height: 700px;
310+
max-height: 450px;
202311
overflow-y: scroll;
312+
}
313+
314+
#clear_button_div {
315+
316+
margin-bottom: 50px;
317+
}
318+
319+
.hidden {
320+
display: none;
321+
}
322+
323+
.mt-10 {
324+
margin-top: 10px;
325+
}
326+
327+
.mt-15 {
328+
margin-top: 15px;
329+
}
330+
331+
.mt-150 {
332+
margin-top: 150px;
203333
}
32.9 KB
Loading

0 commit comments

Comments
 (0)