f.spilla/nx-primeng-sakai-v17
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed markup, refactored css

Browse Source
This commit is contained in:
Cagatay Civici 2022-10-19 14:11:56 +03:00
parent 25dbe641da
commit 3c79cad7a2
3 changed files with 11 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/demo/components/pages/timeline/timelinedemo.component.html
View File

@ -88,3 +88,4 @@
   
</ng-template> </ng-template>
</p-timeline> </p-timeline>
</div>

10
src/app/demo/components/uikit/charts/chartsdemo.component.html
View File

@ -2,17 +2,17 @@
<div class="col-12 lg:col-6"> <div class="col-12 lg:col-6">
<div class="card"> <div class="card">
<h5>Linear Chart</h5> <h5>Linear Chart</h5>
<p-chart type="line" [data]="lineData" [options]="lineOptions" [style]="{'width': '50%'}"></p-chart> <p-chart type="line" [data]="lineData" [options]="lineOptions"></p-chart>
</div> </div>
<div class="card flex flex-column align-items-center"> <div class="card flex flex-column align-items-center">
<h5 class="text-left w-full">Pie Chart</h5> <h5 class="text-left w-full">Pie Chart</h5>
<p-chart type="pie" [data]="pieData" [options]="pieOptions" [style]="{'width': '50%'}"></p-chart> <p-chart type="pie" [data]="pieData" [options]="pieOptions"></p-chart>
</div> </div>
<div class="card flex flex-column align-items-center"> <div class="card flex flex-column align-items-center">
<h5 class="text-left w-full">Polar Area Chart</h5> <h5 class="text-left w-full">Polar Area Chart</h5>
<p-chart type="polarArea" [data]="polarData" [options]="polarOptions" [style]="{'width': '50%'}"></p-chart> <p-chart type="polarArea" [data]="polarData" [options]="polarOptions"></p-chart>
</div> </div>
</div> </div>
<div class="col-12 lg:col-6"> <div class="col-12 lg:col-6">
@ -23,12 +23,12 @@
<div class="card flex flex-column align-items-center"> <div class="card flex flex-column align-items-center">
<h5 class="text-left w-full">Doughnut Chart</h5> <h5 class="text-left w-full">Doughnut Chart</h5>
<p-chart type="doughnut" [data]="pieData" [options]="pieOptions" [style]="{'width': '50%'}"></p-chart> <p-chart type="doughnut" [data]="pieData" [options]="pieOptions"></p-chart>
</div> </div>
<div class="card flex flex-column align-items-center"> <div class="card flex flex-column align-items-center">
<h5 class="text-left w-full">Radar Chart</h5> <h5 class="text-left w-full">Radar Chart</h5>
<p-chart type="radar" [data]="radarData" [options]="radarOptions" [style]="{'width': '50%'}"></p-chart> <p-chart type="radar" [data]="radarData" [options]="radarOptions"></p-chart>
</div> </div>
</div> </div>
</div> </div>

20
src/assets/demo/styles/badges.scss
View File

@ -1,11 +1,15 @@
.product-badge { .customer-badge,
.product-badge,
.order-badge {
border-radius: var(--border-radius); border-radius: var(--border-radius);
padding: .25em .5rem; padding: .25em .5rem;
text-transform: uppercase; text-transform: uppercase;
font-weight: 700; font-weight: 700;
font-size: 12px; font-size: 12px;
letter-spacing: .3px; letter-spacing: .3px;
}
.product-badge {
&.status-instock { &.status-instock {
background: #C8E6C9; background: #C8E6C9;
color: #256029; color: #256029;
@ -23,13 +27,6 @@
} }
.customer-badge { .customer-badge {
border-radius: var(--border-radius);
padding: .25em .5rem;
text-transform: uppercase;
font-weight: 700;
font-size: 12px;
letter-spacing: .3px;
&.status-qualified { &.status-qualified {
background: #C8E6C9; background: #C8E6C9;
color: #256029; color: #256029;
@ -62,13 +59,6 @@
} }
.order-badge { .order-badge {
border-radius: var(--border-radius);
padding: .25em .5rem;
text-transform: uppercase;
font-weight: 700;
font-size: 12px;
letter-spacing: .3px;
&.order-delivered { &.order-delivered {
background: #C8E6C9; background: #C8E6C9;
color: #256029; color: #256029;