vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Cosmetics on demos

pull/12/head
cagataycivici 2019-03-20 14:29:54 +03:00
parent bb1d3e1dba
commit 2ca8fab339
3 changed files with 45 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/assets/styles/app.scss
View File

@ -270,7 +270,7 @@ body {
background-color: #ffffff; background-color: #ffffff;
color: #42b983; color: #42b983;
img{ img {
&.layout-menu-icon-active { &.layout-menu-icon-active {
display: inline; display: inline;
} }
@ -391,7 +391,7 @@ body {
.content-section { .content-section {
display: block; display: block;
padding: 30px; padding: 30px;
background-color: #f5f7f8; background-color: #f8f8f8;
&:first-of-type > div > span { &:first-of-type > div > span {
line-height: 1.5em; line-height: 1.5em;
@ -502,6 +502,8 @@ body {
} }
&.documentation { &.documentation {
border-top: 1px solid #dadada;
h3 { h3 {
color: #484848; color: #484848;
margin-top: 25px; margin-top: 25px;
@ -524,11 +526,12 @@ body {
} }
.doc-tablewrapper { .doc-tablewrapper {
margin: 10px 0; margin: 16px 0;
overflow: auto;
} }
a { a {
color: #03c4e8; color: #42b983;
} }
.btn-viewsource { .btn-viewsource {
@ -569,21 +572,24 @@ body {
.p-tabview-nav { .p-tabview-nav {
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
padding: 4px 4px 0px 4px; padding: 4px 4px 0px 4px;
@include background-gradient-left2right(#008fba, #03c4e8); border-bottom: 1px solid #dadada;
li { li {
margin-right: 4px; margin-right: 4px;
box-shadow: none !important; box-shadow: none !important;
border: none; border: 0 none;
top: 1px; top: 1px;
@include border-radius-top(3px); @include border-radius-top(3px);
a { a {
color: #ffffff; font-weight: 700;
color: #34495e;
text-shadow: none; text-shadow: none;
height: inherit; height: inherit;
background-color: #0080a7; background-color: transparent;
padding-top: 8px; padding-top: 8px;
border: 0 none;
border-bottom: 1px solid transparent;
@include border-radius-top(3px); @include border-radius-top(3px);
@include transition(background-color .2s); @include transition(background-color .2s);
} }
@ -592,13 +598,19 @@ body {
margin-right: 0; margin-right: 0;
} }
&.p-highlight a { &.p-highlight a,
&.p-highlight:hover a {
border: 0 none;
background: #f5f7f8; background: #f5f7f8;
color: #484848; color: #42b983;
border-bottom: 1px solid #42b983;
} }
&:not(.p-highlight) a:hover { &:not(.p-highlight):not(.p-disabled):hover a {
background-color: #007294; color: #34495e;
background-color: transparent;
border: 0 none;
border-bottom: 1px solid #42b983;
} }
} }
} }
@ -636,25 +648,28 @@ body {
width: 100%; width: 100%;
th { th {
background-color: #cce8f1; background-color: #b3e3cd;
padding: 8px 14px; padding: 8px 14px;
text-align: left; text-align: left;
border: solid 1px #b7d0d8; border: solid 1px #b3e3cd;
} }
tbody{ tbody{
td { td {
padding: 8px 14px; padding: 8px 14px;
border: 1px solid #d4e1e3; border: 1px solid #ecf7f2;
word-break: break-word;
} }
tr{ tr{
&:nth-child(even) { &:nth-child(even) {
background-color: #f3fbfc; background-color: #ecf7f2;
} }
&:nth-child(odd) { &:nth-child(odd) {
background-color: #ffffff; background-color: #ffffff;
td {
border: 1px solid #ffffff;
}
} }
} }
} }
@ -784,7 +799,7 @@ body {
h3 { h3 {
font-size:24px; font-size:24px;
color: #484848; color: #484848;
margin-bottom: 25px; margin-bottom: 32px;
} }
img { img {
@ -1050,11 +1065,12 @@ a{
} }
} }
pre[class*="language-"] { pre[class*="language-"] code {
border-left: 10px solid #b2e0e8 !important; border-left: 10px solid #b3e3cd !important;
box-shadow: -1px 0px 0px 0px #b2e0e8, 0px 0px 0px 1px #dfdfdf !important; box-shadow: -1px 0px 0px 0px #b3e3cd, 0px 0px 0px 1px #f8f8f8 !important;
webkit-box-shadow: -1px 0px 0px 0px #b2e0e8, 0px 0px 0px 1px #dfdfdf !important; webkit-box-shadow: -1px 0px 0px 0px #b3e3cd, 0px 0px 0px 1px #f8f8f8 !important;
background: #ffffff !important; background: #ffffff !important;
margin: 1em 0;
code { code {
font-size: 14px; font-size: 14px;

7
src/views/codehighlight/CodeHighlight.vue
View File

@ -1,9 +1,6 @@
<template> <template>
<pre :class="languageClass" ref="code"> <pre :class="languageClass" ref="code"><code><slot></slot>
<code> </code></pre>
<slot></slot>
</code>
</pre>
</template> </template>
<script> <script>

8
src/views/paginator/PaginatorDoc.vue
View File

@ -4,13 +4,13 @@
<TabPanel header="Documentation"> <TabPanel header="Documentation">
<h3>Import</h3> <h3>Import</h3>
<CodeHighlight lang="javascript"> <CodeHighlight lang="javascript">
import {Paginator} from 'primereact/paginator'; import {Paginator} from 'primereact/paginator';
</CodeHighlight> </CodeHighlight>
<h3>Getting Started</h3> <h3>Getting Started</h3>
<p>Rows and TotalRecords define how many pages the paginator should display. Paginator below will have 10 pages.</p> <p><i>rows</i> and <i>totalRecords</i> define how many pages the paginator should display. Paginator below has 10 pages.</p>
<CodeHighlight> <CodeHighlight>
&lt;Paginator :rows="10" :totalRecords="120" &gt;&lt;/Paginator&gt; &lt;Paginator :rows="10" :totalRecords="100"&gt;&lt;/Paginator&gt;
</CodeHighlight> </CodeHighlight>
<h3>Rows Per Page</h3> <h3>Rows Per Page</h3>
@ -141,7 +141,7 @@
</div> </div>
<h3>Styling</h3> <h3>Styling</h3>
<p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">&#9679; theming</router-link> page.</p> <p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">theming</router-link> page.</p>
<div class="doc-tablewrapper"> <div class="doc-tablewrapper">
<table class="doc-table"> <table class="doc-table">
<thead> <thead>