remove unnecessary css && update app.code
This commit is contained in:
parent
6d82b10cd3
commit
bbab294d80
@ -88,7 +88,7 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
pre[class*="language-"] {
|
||||
:host ::ng-deep pre[class*="language-"] {
|
||||
margin: 0 !important;
|
||||
|
||||
&:before, &:after {
|
||||
@ -103,31 +103,6 @@ pre[class*="language-"] {
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
padding: 0 2rem !important;
|
||||
|
||||
.token {
|
||||
&.tag,
|
||||
&.keyword {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-name,
|
||||
&.attr-string {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-value {
|
||||
color: #4CAF50 !important;
|
||||
}
|
||||
|
||||
&.punctuation {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
&.operator,
|
||||
&.string {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -141,8 +116,4 @@ pre[class*="language-"] {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
::ng-deep pre{
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
@ -1,5 +1,6 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { environment } from '../environments/environment';
|
||||
|
||||
enum BlockView {
|
||||
PREVIEW,
|
||||
CODE
|
||||
@ -30,7 +31,8 @@ enum BlockView {
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
<div *ngIf="blockView == BlockView.CODE && !codeDisabled">
|
||||
<app-code lang="markup" ngPreserveWhitespaces>{{code}}</app-code>
|
||||
<app-code lang="markup" ngPreserveWhitespaces>{{code}}
|
||||
</app-code>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,68 +0,0 @@
|
||||
.p-d-flex > div,
|
||||
.box {
|
||||
background-color: var(--surface-e);
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
|
||||
}
|
||||
|
||||
.p-d-flex > div {
|
||||
width: 8rem;
|
||||
}
|
||||
|
||||
i:not([class~="pi"]) {
|
||||
background-color: var(--surface-b);
|
||||
color: var(--primary-color);
|
||||
font-family: Monaco, courier, monospace;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
padding: 2px 4px;
|
||||
letter-spacing: .5px;
|
||||
border-radius: 3px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
:host ::ng-deep pre[class*="language-"] {
|
||||
box-shadow: none;
|
||||
border: 0 none;
|
||||
|
||||
&:before, &:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
code {
|
||||
border-left: 0px solid var(--surface-d) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-b) !important;
|
||||
margin: 0 !important;
|
||||
padding-bottom: 1.5rem;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
|
||||
.token {
|
||||
&.tag,
|
||||
&.keyword {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-name,
|
||||
&.attr-string {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-value {
|
||||
color: #4CAF50 !important;
|
||||
}
|
||||
|
||||
&.punctuation {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
&.operator,
|
||||
&.string {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -7,7 +7,6 @@ import { CommonModule } from '@angular/common';
|
||||
<pre [ngClass]="'language-' + lang"><code #code><ng-content></ng-content>
|
||||
</code></pre>
|
||||
`,
|
||||
styleUrls: ['./app.code.component.scss']
|
||||
})
|
||||
export class AppCodeComponent implements AfterViewInit {
|
||||
|
||||
|
@ -14,7 +14,8 @@
|
||||
<p>Sakai has no direct dependency other than PrimeNG. More information about dependencies is available at <a href="https://www.primefaces.org/why-primeng-templates/">Why PrimeNG Templates</a> article.</p>
|
||||
|
||||
<app-code ngPreserveWhitespaces ngNonBindable lang="markup">
|
||||
npm install -g @angular/cli</app-code>
|
||||
npm install -g @angular/cli
|
||||
</app-code>
|
||||
|
||||
<p>Once CLI is ready in your system, extract the contents of the Sakai zip file distribution, cd to the directory,
|
||||
install the libraries from npm and then execute "ng serve" to run the application in your local environment.</p>
|
||||
@ -22,7 +23,8 @@ npm install -g @angular/cli</app-code>
|
||||
<app-code ngPreserveWhitespaces ngNonBindable lang="markup">
|
||||
cd sakai-ng
|
||||
npm install
|
||||
ng serve</app-code>
|
||||
ng serve
|
||||
</app-code>
|
||||
|
||||
<p>The application should run at http://localhost:4200/, you may now start with the development of your application.</p>
|
||||
|
||||
@ -39,7 +41,8 @@ Run 'ng test' to execute the unit tests via [Karma](https://karma-runner.github.
|
||||
|
||||
Run 'ng e2e' to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
|
||||
|
||||
Run 'ng help' for more options.</app-code>
|
||||
Run 'ng help' for more options.
|
||||
</app-code>
|
||||
|
||||
<h5>Structure</h5>
|
||||
<p>Sakai consists of 2 main parts; the application layout, layout resources. <i>app.component.html</i> inside app folder is the html template for the base layout,
|
||||
@ -78,7 +81,8 @@ Run 'ng help' for more options.</app-code>
|
||||
<app-config></app-config>
|
||||
|
||||
<div *ngIf="menuActiveMobile" class="layout-mask p-component-overlay"></div>
|
||||
</div></app-code>
|
||||
</div>
|
||||
</app-code>
|
||||
|
||||
<h5>Menu</h5>
|
||||
<p>Menu is a separate component defined in app.menu.component.ts file based on PrimeNG MenuModel API. In order to define the menuitems,
|
||||
@ -115,8 +119,14 @@ export class AppMenuComponent implements OnInit, AfterViewInit {
|
||||
{label: 'Tree', icon: 'pi pi-fw pi-share-alt', routerLink: ['/uikit/tree']},
|
||||
{label: 'Panel', icon: 'pi pi-fw pi-tablet', routerLink: ['/uikit/panel']},
|
||||
{label: 'Overlay', icon: 'pi pi-fw pi-clone', routerLink: ['/uikit/overlay']},
|
||||
{label: 'Media', icon: 'pi pi-fw pi-image', routerLink: ['/uikit/media']},
|
||||
{label: 'Menu', icon: 'pi pi-fw pi-bars', routerLink: ['/uikit/menu']},
|
||||
{label: 'Menu', icon: 'pi pi-fw pi-bars', routerLink: ['/uikit/menu'],
|
||||
children:[
|
||||
{label: '', component: 'PersonalDemoComponent'},
|
||||
{label: 'seat', component: 'SeatDemoComponent'},
|
||||
{label: 'payment', component: 'PaymentDemoComponent'},
|
||||
{label: 'confirmation', component: 'ConfirmationDemoComponent'},
|
||||
]
|
||||
},
|
||||
{label: 'Message', icon: 'pi pi-fw pi-comment', routerLink: ['/uikit/message']},
|
||||
{label: 'File', icon: 'pi pi-fw pi-file', routerLink: ['/uikit/file']},
|
||||
{label: 'Chart', icon: 'pi pi-fw pi-chart-bar', routerLink: ['/uikit/charts']},
|
||||
|
@ -0,0 +1,28 @@
|
||||
pre[class*="language-"] {
|
||||
&:before, &:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
code {
|
||||
border-left: 6px solid var(--surface-border) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-ground) !important;
|
||||
margin: 1em 0;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
i:not([class~="pi"]) {
|
||||
background-color: transparent;
|
||||
color: #2196f3;
|
||||
font-family: Monaco, courier, monospace;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
padding: 0 4px;
|
||||
letter-spacing: .5px;
|
||||
font-weight: 600;
|
||||
margin: 0 2px;
|
||||
display: inline-flex;
|
||||
}
|
@ -8,65 +8,4 @@
|
||||
@import "../node_modules/@fullcalendar/timegrid/main.min.css";
|
||||
@import "assets/demo/flags/flags.css";
|
||||
@import "assets/demo/badges.scss";
|
||||
@import "assets/demo/documentation.scss";
|
||||
|
||||
.docs {
|
||||
i:not([class~="pi"]) {
|
||||
background-color: transparent;
|
||||
color: #2196f3;
|
||||
font-family: Monaco, courier, monospace;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
padding: 0 4px;
|
||||
letter-spacing: .5px;
|
||||
font-weight: 600;
|
||||
margin: 0 2px;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
pre[class*="language-"] {
|
||||
&:before, &:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
code {
|
||||
border-left: 6px solid var(--surface-border) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-ground) !important;
|
||||
margin: 1em 0;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.token {
|
||||
&.tag,
|
||||
&.keyword {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-name,
|
||||
&.attr-string {
|
||||
color: #2196F3 !important;
|
||||
}
|
||||
|
||||
&.attr-value {
|
||||
color: #4CAF50 !important;
|
||||
}
|
||||
|
||||
&.punctuation {
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
&.operator,
|
||||
&.variable,
|
||||
&.string {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "assets/demo/documentation.scss";
|
Loading…
Reference in New Issue
Block a user