forked from databricks-demos/dbdemos
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtest_list_html.html
148 lines (143 loc) · 6.55 KB
/
test_list_html.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<style>
.dbdemo {
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji,FontAwesome;
color: #3b3b3b;
padding: 0px 0px 20px 0px;
}
.dbdemo_box {
width: 400px;
padding: 10px;
box-shadow: 0 .15rem 1.15rem 0 rgba(58,59,69,.15)!important;
float: left;
min-height: 170px;
margin: 0px 20px 20px 20px;
}
.dbdemo_category {
clear: both;
}
.category {
margin-left: 20px;
margin-bottom: 5px;
}
.dbdemo_logo {
width: 100%;
height: 225px;
}
.code {
padding: 5px;
border: 1px solid #e4e4e4;
font-family: monospace;
background-color: #f5f5f5;
margin: 5px 0px 0px 0px;
}
.dbdemo_description {
height: 100px;
}
.menu_button {
font-size: 15px;
cursor: pointer;
border: 0px;
padding: 10px 20px 10px 20px;
margin-right: 10px;
background-color: rgb(238, 237, 233);
border-radius: 20px;
}
.menu_button:hover {
background-color: rgb(245, 244, 242)
}
.menu_button.selected {
background-color: rgb(158, 214, 196)
}
.new_tag {
background-color: red;
color: white;
font-size: 13px;
padding: 2px 7px;
border-radius: 3px;
margin-right: 5px;
}
</style>
<div class="dbdemo">
<div style="padding: 10px 0px 20px 20px"><button category="lakehouse" class="menu_button selected" type="button"><span>Lakehouse</span></button><button category="data-science" class="menu_button " type="button"><span>Data-science</span></button><button category="data-engineering" class="menu_button " type="button"><span>Data-engineering</span></button><button category="AI-BI" class="menu_button " type="button"><span class="new_tag">NEW!</span><span>Ai-bi</span></button><button category="governance" class="menu_button " type="button"><span>Governance</span></button><button category="DBSQL" class="menu_button " type="button"><span>Dbsql</span></button></div><div class="dbdemo_category" style="min-height: 200px; display: block" id="category-lakehouse">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/lakehouse-fsi-credit.jpg" />
<div class="dbdemo_description">
<h2>Lakehouse for Retail Banking: Credit Decisioning</h2>
Build your banking data platform and identify credit worthy customers
</div>
<div class="code">
dbdemos.install('lakehouse-fsi-credit')
</div>
</div></div><div class="dbdemo_category" style="min-height: 200px; display: none" id="category-data-science">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/mlops-end2end.jpg" />
<div class="dbdemo_description">
<h2>MLOps - End 2 end pipeline</h2>
Automate your model deployment with MLFlow and UC, end 2 end!
</div>
<div class="code">
dbdemos.install('mlops-end2end')
</div>
</div></div><div class="dbdemo_category" style="min-height: 200px; display: none" id="category-data-engineering">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/cdc-pipeline.jpg" />
<div class="dbdemo_description">
<h2>CDC Pipeline with Delta</h2>
Process CDC data to build an entire pipeline and materialize your operational tables in your lakehouse.
</div>
<div class="code">
dbdemos.install('cdc-pipeline')
</div>
</div></div><div class="dbdemo_category" style="min-height: 200px; display: none" id="category-AI-BI">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/aibi-sales-pipeline-review.jpg" />
<div class="dbdemo_description">
<h2>AI/BI: Sales Pipeline Review</h2>
Optimize your sales pipeline visibility and insights with AI/BI Dashboards, and leverage Genie to ask questions about your data in natural language.
</div>
<div class="code">
dbdemos.install('aibi-sales-pipeline-review')
</div>
</div></div><div class="dbdemo_category" style="min-height: 200px; display: none" id="category-governance">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/uc-01-acl.jpg" />
<div class="dbdemo_description">
<h2>Table ACL & Row + Column Level security with UC</h2>
Discover how to GRANT permission on your table with Unity Catalog and implement fined grained control such as data masking at column level or filter rows based on each user.
</div>
<div class="code">
dbdemos.install('uc-01-acl')
</div>
</div></div><div class="dbdemo_category" style="min-height: 200px; display: none" id="category-DBSQL">
<div class="dbdemo_box">
<img class="dbdemo_logo" src="https://github.com/databricks-demos/dbdemos-resources/raw/main/icon/identity-pk-fk.jpg" />
<div class="dbdemo_description">
<h2>Data Warehousing with Identity, Primary Key & Foreign Key</h2>
Define your schema with auto incremental column and Primary + Foreign Key. Ideal for Data Warehouse & BI support!
</div>
<div class="code">
dbdemos.install('identity-pk-fk')
</div>
</div></div></div><script>
const buttons = document.querySelectorAll('.menu_button');
const sections = document.querySelectorAll('.dbdemo_category');
buttons.forEach(button => {
button.addEventListener('click', () => {
const selectedCategory = button.getAttribute('category');
sections.forEach(section => {
if (section.id === `category-${selectedCategory}`) {
section.style.display = 'block';
} else {
section.style.display = 'none';
}
});
buttons.forEach(btn => {
if (btn === button) {
btn.classList.add('selected');
} else {
btn.classList.remove('selected');
}
});
});
});
</script>