Skip to content

Commit 02e5f56

Browse files
authored
Improve Evaluation Sign Up UX #233 (#274)
Signed-off-by: tdruez <[email protected]>
1 parent f684272 commit 02e5f56

File tree

3 files changed

+86
-31
lines changed

3 files changed

+86
-31
lines changed

dejacode/static/css/dejacode_bootstrap.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -693,6 +693,19 @@ a[data-category-pk]:focus,
693693
body.signup-form {
694694
background-color: var(--bs-djc-blue-bg);
695695
}
696+
body.signup-form .nav-link {
697+
color: white;
698+
}
699+
body.signup-form .nav-link.active {
700+
color: white;
701+
background-color: var(--bs-djc-blue-bg);
702+
}
703+
body.signup-form .nav-item.show .nav-link,
704+
body.signup-form .nav-link.active {
705+
border-top-width: 1px;
706+
border-top-color: initial;
707+
border-bottom-color: var(--bs-djc-blue-bg);
708+
}
696709
body.signup-form label {
697710
display: none;
698711
}

dje/registration.py

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -165,14 +165,14 @@ def helper(self):
165165
),
166166
Div(
167167
Field("updates_email_notification"),
168-
css_class="alert alert-primary px-2",
168+
css_class="alert alert-primary px-2 py-2",
169169
),
170170
"hcaptcha",
171171
tos,
172172
Div(
173173
StrictSubmit(
174174
"submit",
175-
_("Create your account"),
175+
_("Create account"),
176176
css_class="btn btn-warning",
177177
),
178178
css_class="d-grid",

dje/templates/django_registration/registration_form.html

Lines changed: 71 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -9,38 +9,72 @@
99

1010
{% block content %}
1111
<div class="row">
12-
<div class="col-sm-6 text-white">
13-
<h2 class="mb-3">Explore DejaCode now</h2>
14-
<p>
15-
A free DejaCode trial account allows you to use DejaCode in a shared public dataspace!
16-
</p>
17-
<p>When you sign in to the DejaCode public evaluation dataspace with your free trial account, you can:</p>
18-
<ul>
19-
<li>Explore, create, and modify components, packages, licenses and assign usage policies to them.</li>
20-
<li>Create your own test products and generate attribution.</li>
21-
<li>Exercise the DejaCode API and DejaCode integrations with open source tools, such as ScanCode.io.</li>
22-
<li>Run reports and use workflow requests.</li>
23-
</ul>
24-
<p>To get started, sign up for a free DejaCode trial account via the form on this page.</p>
25-
26-
<h2 class="mt-4 mb-3">Securely use your own data</h2>
27-
<p>
28-
We can set up a private instance for evaluating DejaCode using your own data,
29-
with access to all features including:
30-
</p>
31-
<ul>
32-
<li>Import your own data privately and securely, including proprietary and third-party software components and licenses.</li>
33-
<li>Design and apply your own usage policies.</li>
34-
<li>Create your own workflow requests and reports.</li>
35-
<li>Generate FOSS compliance artifacts, including Software Bill of Materials (SBOM) for your products and attribution notices.</li>
12+
<div class="col-sm-5 text-white" style="font-size: 1.1rem !important;">
13+
<ul class="nav nav-tabs nav-fill" role="tablist">
14+
<li class="nav-item" role="presentation">
15+
<a class="nav-link active" role="tab" aria-controls="explore-now-tab" aria-current="page" data-bs-toggle="tab" data-bs-target="#explore-now-tab" href="#">Explore now</a>
16+
</li>
17+
<li class="nav-item" role="presentation">
18+
<a class="nav-link" role="tab" aria-controls="about-tab" data-bs-toggle="tab" data-bs-target="#about-tab" href="#">About DejaCode</a>
19+
</li>
20+
<li class="nav-item" role="presentation">
21+
<a class="nav-link" role="tab" aria-controls="private-evaluation-tab" data-bs-toggle="tab" data-bs-target="#private-evaluation-tab" href="#">Private Evaluation</a>
22+
</li>
3623
</ul>
37-
<p>Each private evaluation is limited to 30 days with unlimited use of DejaCode and free support.</p>
38-
<a class="btn btn-warning" href="https://nexb.com/evaluation/" target="_blank">
39-
Request private evaluation
40-
</a>
24+
<div class="tab-content p-3">
25+
<div class="tab-pane fade show active" id="explore-now-tab" role="tabpanel" aria-labelledby="explore-now-tab">
26+
<h4 class="text-warning mb-3 mt-2">Get Started with DejaCode for Free</h4>
27+
<p>
28+
Sign up for a <strong>free DejaCode account</strong> and access a shared public dataspace where you can:
29+
</p>
30+
<ul class="list-unstyled ms-3">
31+
<li class="mb-3"><strong class="text-warning">Explore Packages, Components, and Licenses</strong></li>
32+
<li class="mb-3"><strong class="text-warning">Create & Track Products</strong> – Manage your software inventory effortlessly and Generate attribution.</li>
33+
<li class="mb-3"><strong class="text-warning">Assign Usage Policies</strong> – Define and apply license policies on your inventory items.</li>
34+
<li class="mb-3"><strong class="text-warning">Leverage Powerful Integrations</strong> – Leverage tools like <a class="text-warning text-decoration-underline" href="https://github.com/aboutcode-org/scancode.io" target="_blank">ScanCode.io</a> for seamless code scanning, and <a class="text-warning text-decoration-underline" href="https://github.com/aboutcode-org/vulnerablecode" target="_blank">VulnerableCode</a> for vulnerability management.</li>
35+
<li class="mb-3"><strong class="text-warning">Run Reports & Automate Workflows</strong> – Gain insights with built-in reporting and workflow automation.</li>
36+
</ul>
37+
<p>
38+
<strong>Ready to get started?</strong> Sign up now for a <strong>free DejaCode trial</strong> using the form on this page!
39+
</p>
40+
</div>
41+
<div class="tab-pane fade" id="about-tab" role="tabpanel" aria-labelledby="about-tab">
42+
<h4 class="text-warning mb-3 mt-2">Automate Enterprise-Wide Continuous Compliance with DejaCode</h4>
43+
<p>
44+
<strong>Your system of record for SBOMs, backed by open data.</strong>
45+
</p>
46+
<ul class="list-unstyled ms-3">
47+
<li class="mb-3"><strong class="text-warning">Scan & Track Open Source and Third-Party Components</strong> – Identify and manage all open source and third-party software used in your projects.</li>
48+
<li class="mb-3"><strong class="text-warning">Enforce Compliance Policies</strong> – Apply usage policies at the license or package level and integrate with ScanCode to ensure compliance.</li>
49+
<li class="mb-3"><strong class="text-warning">Capture & Maintain SBOMs</strong> – Generate, store, and manage Software Bill of Materials (SBOMs) while keeping historical data for audits.</li>
50+
<li class="mb-3"><strong class="text-warning">Enterprise-Grade Compliance & DevOps Integration</strong> – Leverage advanced compliance features with seamless integration into DevOps and software workflows.</li>
51+
</ul>
52+
</div>
53+
<div class="tab-pane fade" id="private-evaluation-tab" role="tabpanel" aria-labelledby="private-evaluation-tab">
54+
<h4 class="text-warning mb-3 mt-2">Private DejaCode Evaluation Instance</h4>
55+
<p>
56+
We can set up a private instance for evaluating DejaCode using your own data, with access to all features, including:
57+
</p>
58+
<ul class="list-unstyled ms-3">
59+
<li class="mb-3"><strong class="text-warning">Import your own data privately and securely</strong>, including proprietary and third-party software components and licenses.</li>
60+
<li class="mb-3"><strong class="text-warning">Design and apply your own usage policies</strong>.</li>
61+
<li class="mb-3"><strong class="text-warning">Create your own workflow requests and reports</strong>.</li>
62+
<li class="mb-3"><strong class="text-warning">Generate FOSS compliance artifacts</strong>, including Software Bill of Materials (SBOM) for your products and attribution notices.</li>
63+
</ul>
64+
<p>
65+
<strong>Each private evaluation is limited to 30 days</strong> with unlimited use of DejaCode and free support.
66+
</p>
67+
<div class="d-grid">
68+
<a class="btn btn-warning" href="https://nexb.com/evaluation/" target="_blank">
69+
Request private evaluation
70+
</a>
71+
</div>
72+
</div>
73+
</div>
4174
</div>
4275

4376
<div class="col-sm-5 offset-sm-1">
77+
<h1 class="text-white mt-0 mb-2">Create your DejaCode account</h1>
4478
<div class="card">
4579
<div class="card-body">
4680
{% crispy form %}
@@ -53,4 +87,12 @@ <h2 class="mt-4 mb-3">Securely use your own data</h2>
5387
</div>
5488
{% endblock %}
5589

56-
{% block footer %}{% endblock %}
90+
{% block footer %}
91+
<footer class="mt-auto">
92+
<div class="container">
93+
<p class="text-center text-white mb-2">
94+
Copyright (c) nexB Inc., AboutCode and others.
95+
</p>
96+
</div>
97+
</footer>
98+
{% endblock %}

0 commit comments

Comments
 (0)