Skip to content

Commit a264b61

Browse files
awolfdenAdam Wolfman
andauthored
Feature/sup 590 python django sso app (#34)
* Update django sso app * Update django sso app Co-authored-by: Adam Wolfman <[email protected]>
1 parent 447b29b commit a264b61

File tree

5 files changed

+157
-54
lines changed

5 files changed

+157
-54
lines changed

python-django-sso-example/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
# python-django-sso-example
2-
An example Django application demonstrating how to use the [WorkOS Python SDK](https://github.com/workos-inc/workos-python) to authenticate users via SSO.
2+
An example Django application demonstrating how to use the [WorkOS Python SDK](https://github.com/workos/workos-python) to authenticate users via SSO.
33

44
## Prerequisites
55
- Python 3.6+
@@ -10,14 +10,14 @@ An example Django application demonstrating how to use the [WorkOS Python SDK](h
1010
1. Clone the main git repo for these Python example apps using your preferred secure method (HTTPS or SSH).
1111
```bash
1212
# HTTPS
13-
$ git clone https://github.com/workos-inc/python-django-example-applications.git
13+
$ git clone https://github.com/workos/python-django-example-applications.git
1414
```
1515

1616
or
1717

1818
```bash
1919
# SSH
20-
$ git clone [email protected]:workos-inc/python-django-example-applications.git
20+
$ git clone [email protected]:workos/python-django-example-applications.git
2121
```
2222

2323
2. Navigate to the Admin Portal example app within the cloned repo.

python-django-sso-example/requirements.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,5 @@ pytz==2021.1
77
requests==2.25.1
88
sqlparse==0.4.2
99
urllib3==1.26.5
10-
workos==1.2.0
10+
workos==1.14.0
1111
python-dotenv

python-django-sso-example/sso/static/css/login.css

Lines changed: 101 additions & 19 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,6 +36,18 @@ body {
3436
align-items: center;
3537
}
3638

39+
.space-between {
40+
justify-content: space-between;
41+
}
42+
43+
.width-75 {
44+
width: 75%;
45+
}
46+
47+
.width-40vw {
48+
width: 40vw;
49+
}
50+
3751
.container_success {
3852
display: flex;
3953
flex-direction: column;
@@ -72,19 +86,33 @@ body {
7286
margin: 4px 2px;
7387
transition-duration: 0.4s;
7488
cursor: pointer;
75-
}
76-
77-
.button:hover {
89+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
90+
}
91+
92+
.button-outline {
93+
background-color: #f9f9fb;
94+
color: #6363f1;
95+
padding: 8px 16px;
96+
}
97+
98+
.button:hover,
99+
.button-outline:hover {
78100
background-color: #555555;
79101
border: 2px solid #555555;
80102
color: white;
81103
}
82104

105+
.sales-button {
106+
margin-left: 10px;
107+
}
108+
83109
.login_button {
84110
width: 95%;
111+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
85112
}
86113

87-
h2, h1 {
114+
h2,
115+
h1 {
88116
text-align: center;
89117
color: #555555;
90118
}
@@ -98,16 +126,18 @@ h2, h1 {
98126
align-items: center;
99127
position: relative;
100128
bottom: 10%;
101-
129+
/* background-color: #f9f9fb; */
102130
}
131+
103132
.logged_in_div_left {
104133
width: 40%;
105134
height: 100vh;
106135
display: flex;
107136
flex-direction: column;
108137
justify-content: center;
109-
align-items: center;
110-
background-color: #dad8d8;
138+
align-items: left;
139+
background-color: #f9f9fb;
140+
margin-left: 4vw;
111141
}
112142

113143
.logged_in_div_left div {
@@ -125,39 +155,67 @@ h2, h1 {
125155
letter-spacing: -.05em;
126156
}
127157

128-
.logged_in_div_left h2 {
129-
color: #6363f1;
130-
font-size: 75px;
158+
.home-hero-gradient {
159+
background-image: linear-gradient(45deg, #a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0));
160+
background-size: 150% 100%;
161+
background-repeat: no-repeat;
162+
-webkit-background-clip: text;
163+
-webkit-text-fill-color: transparent;
164+
background-clip: text;
165+
animation: intro-gradient 1.2s cubic-bezier(0.85, 0.26, 0.89, 0.93);
166+
animation-iteration-count: 1;
167+
animation-fill-mode: backwards;
168+
animation-delay: 0.4s;
131169
text-align: left;
132-
margin-top: 0px;
133-
font-weight: normal;
170+
font-size: 75px;
134171
letter-spacing: -.05em;
172+
font-weight: normal;
173+
margin-top: 0px;
174+
}
175+
176+
.title-text {
177+
margin-bottom: -50px;
178+
}
179+
180+
.title-subtext {
181+
color: gray;
182+
line-height: 10px;
183+
margin-bottom: 15px;
184+
font-weight: 200;
135185
}
136186

137187
.logged_in_div_left button {
138188
padding: 8px 22px;
189+
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
139190
}
140191

141192
div.text_box {
142-
background-color: #dad8d8;
143-
border-radius: 5px;
144-
border: 2px solid #6363f1;
145-
width: 75%;
193+
background-color: #f9f9fb;
194+
width: 40vw;
195+
max-height: 30vh;
146196
padding: 10px;
147197
word-wrap: break-word;
198+
overflow: scroll;
199+
border-width: 3px;
200+
border-style: solid;
201+
border-image:
202+
linear-gradient(#a163f1, #6363f1 22%, #3498ea 40%, #40dfa3 67%, rgba(64, 223, 163, 0)) 0 100%;
148203
}
149204

150205
.logged_in_nav {
151206
display: flex;
152207
justify-content: space-between;
153-
background-color: #6363f1;
208+
background-color: #f9f9fb;
154209
height: 60px;
155-
padding: 7px 7px 7px 10px;
210+
padding: 15px 30px 15px 30px;
211+
212+
z-index: 1000;
156213
}
214+
157215
.logged_in_nav p {
158216
padding: 4px 0px 0px 15px;
159217
line-height: 1;
160-
color: white;
218+
color: #29363d;
161219
}
162220

163221
.logged_in_nav img {
@@ -168,4 +226,28 @@ div.text_box {
168226

169227
.logged_in_nav img:hover {
170228
border: 2px solid #555555;
229+
}
230+
231+
.nav-item {
232+
color: black;
233+
border: 2px solid #f9f9fb;
234+
background-color: #f9f9fb;
235+
box-shadow: none;
236+
border-radius: 5px;
237+
}
238+
239+
.blog-nav-button {
240+
margin-right: 20px;
241+
background-color: #f9f9fb;
242+
border: 2px solid #f9f9fb;
243+
}
244+
245+
.nav-item:hover {
246+
background-color: #f9f9fb;
247+
border: 2px solid #f9f9fb;
248+
color: #a6a4a4;
249+
}
250+
251+
pre.prettyprint {
252+
border: none !important;
171253
}
Lines changed: 50 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,61 @@
1-
21
<html>
3-
<head>
4-
<link rel="stylesheet" href="../../static/css/login.css">
5-
</head>
6-
<body class="container_success">
7-
<div class="logged_in_nav">
2+
3+
<head>
4+
<link rel="stylesheet" href="../../static/css/login.css">
5+
</head>
6+
7+
<body class="container_success">
8+
<div class="logged_in_nav">
9+
<div class="flex">
10+
<div>
11+
<img src="../../static/images/workos_logo_new.png" alt="workos logo">
12+
</div>
813
<div class="flex">
914
<p>You're logged in {{first_name}}, welcome!</p>
1015
</div>
11-
<div>
12-
<img src="../../static/images/workos_logo_new.png" alt="workos logo">
16+
</div>
17+
<div>
18+
<a href="https://workos.com/docs" target="_blank"><button class='button nav-item'>Documentation</button></a>
19+
<a href="https://workos.com/docs/reference" target="_blank"><button class='button nav-item'>API
20+
Reference</button></a>
21+
<a href="https://workos.com/blog" target="_blank"><button
22+
class='button nav-item blog-nav-button'>Blog</button></a>
23+
<a href="https://workos.com/" target="_blank"><button class='button button-outline'>WorkOS</button></a>
24+
</div>
25+
</div>
26+
<div class='flex'>
27+
<div class="logged_in_div_left">
28+
<div class="title-text">
29+
<h1>Your app,</h1>
30+
<h2 class="home-hero-gradient">Enterprise Ready</h2>
31+
</div>
32+
<div class="title-subtext">
33+
<p>Start selling to enterprise customers with just a few lines of code.</p>
34+
<p>Implement features like single sign-on in minutes instead of months.</p>
35+
</div>
36+
<div class="flex success-buttons">
37+
<a href="https://workos.com/signup" target="_blank"><button class='button'>Get Started</button></a>
38+
<a href="mailto:[email protected]?subject=WorkOS Sales Inquiry" target="_blank"><button
39+
class='button button-outline sales-button'>Contact
40+
Sales</button></a>
1341
</div>
1442
</div>
15-
<div class='flex'>
16-
<div class="logged_in_div_left">
17-
<div>
18-
<h1>Your app,</h1>
19-
<h2>Enterprise Ready</h2>
20-
</div>
21-
<div>
22-
<a href="https://workos.com/" target="_blank"><button class='button'>WorkOS</button></a>
23-
<a href="https://workos.com/docs" target="_blank"><button class='button'>Documentation</button></a>
24-
<a href="https://workos.com/docs/reference" target="_blank"><button class='button'>API Reference</button></a>
25-
<a href="https://workos.com/blog" target="_blank"><button class='button'>Blog</button></a>
26-
43+
<div class="logged_in_div_right">
44+
<div class="flex_column">
45+
<h2>Raw Profile Response Details</h2>
46+
<div class="text_box">
47+
<pre class="prettyprint">
48+
49+
{{raw_profile}}
50+
</pre>
2751
</div>
52+
<a href="/logout"><button class='button'>Logout</button></a>
2853
</div>
29-
<div class="logged_in_div_right">
30-
<div class="flex_column">
31-
<h2>Raw Profile Response Details</h2>
32-
<div class="text_box">
33-
<p>{{raw_profile}}</p>
34-
</div>
35-
<a href="/logout"><button class='button'>Logout</button></a>
36-
</div>
3754

38-
</div>
3955
</div>
40-
</body>
56+
</div>
57+
<script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js"></script>
58+
</body>
59+
</body>
60+
4161
</html>

python-django-sso-example/sso/views.py

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import os
22
import workos
3+
import json
34
from django.conf import settings
45
from django.shortcuts import redirect, render
56

@@ -34,7 +35,7 @@ def login(request):
3435
{
3536
"p_profile": request.session.get("p_profile"),
3637
"first_name": request.session.get("first_name"),
37-
"raw_profile": request.session.get("raw_profile"),
38+
"raw_profile": json.dumps(request.session.get("raw_profile"), indent=2),
3839
},
3940
)
4041

0 commit comments

Comments
 (0)