Add feature images
After Width: | Height: | Size: 13 KiB |
After Width: | Height: | Size: 29 KiB |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 8.8 KiB |
After Width: | Height: | Size: 36 KiB |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 14 KiB |
After Width: | Height: | Size: 12 KiB |
|
@ -82,7 +82,7 @@ body {
|
||||||
|
|
||||||
.menu-button {
|
.menu-button {
|
||||||
display: none;
|
display: none;
|
||||||
color: #ffffff;
|
color: #484848;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
@ -95,7 +95,7 @@ body {
|
||||||
@include transition(background-color .2s);
|
@include transition(background-color .2s);
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #363c3f;
|
background-color: #eeeeee;
|
||||||
}
|
}
|
||||||
|
|
||||||
i {
|
i {
|
||||||
|
@ -988,13 +988,13 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
.topbar-menu {
|
.topbar-menu {
|
||||||
background-color: #20272a;
|
background-color: #ffffff;
|
||||||
float: none;
|
float: none;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 41px;
|
height: 41px;
|
||||||
margin: -1px 0 0 0;
|
margin: -1px 0 0 0;
|
||||||
border-bottom: 1px solid #363c3f;
|
border-bottom: 1px solid #e3e9ea;
|
||||||
border-top: 1px solid #363c3f;
|
border-top: 1px solid #e3e9ea;
|
||||||
|
|
||||||
> li {
|
> li {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
|
@ -15,78 +15,87 @@
|
||||||
a vendor with years of expertise in developing open source UI solutions. For project news and updates, please <a href="https://twitter.com/primevue">follow us on twitter</a> and <a href="https://www.primefaces.org/category/primevue/">visit our blog</a>.</p>
|
a vendor with years of expertise in developing open source UI solutions. For project news and updates, please <a href="https://twitter.com/primevue">follow us on twitter</a> and <a href="https://www.primefaces.org/category/primevue/">visit our blog</a>.</p>
|
||||||
|
|
||||||
<div class="p-grid">
|
<div class="p-grid">
|
||||||
<div class="p-col-12 p-md-3">
|
<div class="p-col-12 p-md-4">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<img alt="component" src="https://placehold.it/400x150" />
|
<img alt="component" src="../assets/images/home/vue-components.png" />
|
||||||
<div class="feature-card-detail">
|
<div class="feature-card-detail">
|
||||||
<span class="feature-name">50+ COMPONENTS</span>
|
<span class="feature-name">50+ COMPONENTS</span>
|
||||||
<p>The most complete set of native widgets featuring 50+ easy to use components for all your UI requirements.</p>
|
<p>The most complete set of native widgets featuring 50+ easy to use components for all your UI requirements.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12 p-md-3">
|
<div class="p-col-12 p-md-4">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<img alt="opensource" src="https://placehold.it/400x150" />
|
<img alt="opensource" src="../assets/images/home/vue-opensource.png" />
|
||||||
<div class="feature-card-detail">
|
<div class="feature-card-detail">
|
||||||
<span class="feature-name">OPEN SOURCE</span>
|
<span class="feature-name">OPEN SOURCE</span>
|
||||||
<p>Hosted at <a href="https://github.com/primefaces/primevue">GitHub</a>, all widgets are open source and free to use under MIT license. Feel the power of open source.</p>
|
<p>Hosted at <a href="https://github.com/primefaces/primevue">GitHub</a>, all widgets are open source and free to use under MIT license. Feel the power of open source.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12 p-md-3">
|
<div class="p-col-12 p-md-4">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<img alt="themes" src="https://placehold.it/400x150" />
|
<img alt="themes" src="../assets/images/home/vue-themes.png" />
|
||||||
<div class="feature-card-detail">
|
<div class="feature-card-detail">
|
||||||
<span class="feature-name">THEMES</span>
|
<span class="feature-name">THEMES</span>
|
||||||
<p>Don’t get tied up in just one look&feel. Choose from a variety of options including material and flat design.</p>
|
<p>Don’t get tied up in just one look&feel. Choose from a variety of options including material and flat design.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12 p-md-3">
|
<div class="p-col-12 p-md-4">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<img alt="community" src="https://placehold.it/400x150" />
|
<img alt="community" src="../assets/images/home/vue-templates.png" />
|
||||||
<div class="feature-card-detail">
|
|
||||||
<span class="feature-name">COMMUNITY</span>
|
|
||||||
<p>Join PrimeVue community to become a part of an active, vibrant and growing open source foundation.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="p-col-12 p-md-3">
|
|
||||||
<div class="feature-card">
|
|
||||||
<img alt="productive" src="https://placehold.it/400x150" />
|
|
||||||
<div class="feature-card-detail">
|
|
||||||
<span class="feature-name">PRODUCTIVITY</span>
|
|
||||||
<p>Allocate your valuable time on business logic rather than dealing with the complex user interface requirements.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="p-col-12 p-md-3">
|
|
||||||
<div class="feature-card">
|
|
||||||
<img alt="mobile" src="https://placehold.it/400x150" />
|
|
||||||
<div class="feature-card-detail">
|
|
||||||
<span class="feature-name">MOBILE</span>
|
|
||||||
<p>Enhanced mobile user experience with touch optimized responsive design elements.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="p-col-12 p-md-3">
|
|
||||||
<div class="feature-card">
|
|
||||||
<img alt="templates" src="https://placehold.it/400x150" />
|
|
||||||
<div class="feature-card-detail">
|
<div class="feature-card-detail">
|
||||||
<span class="feature-name">TEMPLATES</span>
|
<span class="feature-name">TEMPLATES</span>
|
||||||
<p>Professionally designed highly customizable Vue application templates to get started in no time.</p>
|
<p>Professionally designed highly customizable Vue application templates to get started in no time.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-12 p-md-3">
|
<div class="p-col-12 p-md-4">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<img alt="templates" src="https://placehold.it/400x150" />
|
<img alt="productive" src="../assets/images/home/vue-accesibility.png" />
|
||||||
<div class="feature-card-detail">
|
<div class="feature-card-detail">
|
||||||
<span class="feature-name">ACCESSIBILITY</span>
|
<span class="feature-name">ACCESSIBILITY</span>
|
||||||
<p>Fully accessible and in complaince with Section 508 standards.</p>
|
<p>Fully accessible and in complaince with Section 508 standards.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="p-col-12 p-md-4">
|
||||||
|
<div class="feature-card">
|
||||||
|
<img alt="mobile" src="../assets/images/home/vue-pro.png" />
|
||||||
|
<div class="feature-card-detail">
|
||||||
|
<span class="feature-name">PRO SUPPORT</span>
|
||||||
|
<p>With the exclusive services of Pro account, you no longer need to post your questions in the community forum and your issues to community issue tracker.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-col-12 p-md-4">
|
||||||
|
<div class="feature-card">
|
||||||
|
<img alt="templates" src="../assets/images/home/vue-lts.png" />
|
||||||
|
<div class="feature-card-detail">
|
||||||
|
<span class="feature-name">LTS</span>
|
||||||
|
<p>Allocate your valuable time on business logic rather than dealing with the complex user interface requirements.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-col-12 p-md-4">
|
||||||
|
<div class="feature-card">
|
||||||
|
<img alt="templates" src="../assets/images/home/vue-community.png" />
|
||||||
|
<div class="feature-card-detail">
|
||||||
|
<span class="feature-name">COMMUNITY</span>
|
||||||
|
<p>Join PrimeVue community to become a part of an active, vibrant and growing open source foundation.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-col-12 p-md-4">
|
||||||
|
<div class="feature-card">
|
||||||
|
<img alt="templates" src="../assets/images/home/vue-mobile.png" />
|
||||||
|
<div class="feature-card-detail">
|
||||||
|
<span class="feature-name">MOBILE</span>
|
||||||
|
<p>Enhanced mobile user experience with touch optimized responsive design elements.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|