Dashboardlarınızı oluştururken Apache Superset’in kendi default ara yüzünü kullanabilir ya da oluşturmuş olduğunuz css templateleri kullanarak dashboardlarınızın daha düzel gözükmesini sağlayabilirsiniz. Aşağıda yer alan ilk görselde Superset’in default arayüzü ikincisinde ise CSS template kullanılmış hali bulunmaktadır.

Kullanmış olduğum CSS template aşağıda yer almaktadır;

@import url(“https://fonts.googleapis.com/css?family=Montserrat:400,600,700”);
body {
background:radial-gradient(circle at center,white,#373f51);
font-family:Century Gothic, Helvetica, Tahoma, sans-serif;
}
.dashboard-component-header{
margin:0;
padding:20px;
margin-left:40%;
background-color:rgb(255,255,255);
}
li {
font-size: 18px;
line-height: 20px;
margin-bottom: 10px;
}
.dashboard-component-chart-holder{
box-shadow: 3px 3px 5px rgba(0,0,0,02);
transition: 0.5s;
z-index:1;
border-radius:10px;
padding:5px;
margin-top:10px;
text-align:center;
background:radial-gradient(circle at center,white,#778899);
color:#576675;
border-style:groove;
font-size:14px;
}
.header{
background:#576675;
color:white;
font-size:17px;
}
.nav-tabs{
-webkit-box-shadow: 20px 20px 20px #576675;
-moz-box-shadow: 20px 20px 20px #576675;
box-shadow: 3px 3px 3px #576675;
z-index:999;
background:#576675;
margin-top:0px;
}
.nav .editable-title{
color:white;
weight:400;
background:#576675;
padding-left:20px;
padding-right:20px;
padding-top:13px;
padding-bottom:13px;
font-size:16px;
}
.table{
weight:400;
background:radial-gradient(circle at center,white,#778899);
padding-left:20px;
padding-right:20px;
padding-top:13px;
padding-bottom:13px;
font-size:14px;
}

--

--