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

em to rem conversion

pull/345/head
cagataycivici 2020-05-14 11:51:13 +03:00
parent 417516b084
commit 4e6080d505
90 changed files with 294 additions and 294 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/assets/styles/app/_config.scss
View File

@ -106,7 +106,7 @@
}
.p-grid > div {
padding: 1em .5em;
padding: 1em .5rem;
text-align: center;
span {
@ -140,7 +140,7 @@
}
.free-themes {
padding: 2em;
padding: 2rem;
color: var(--text-color);
background-color: var(--layer-0);
@ -173,7 +173,7 @@
left: 50%;
margin-left: -18px;
margin-top: -18px;
padding: .18em;
padding: .18rem;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25);
background-color: #ffffff;
border-radius: 50%;
@ -191,7 +191,7 @@
}
.premium-themes {
padding: 2em;
padding: 2rem;
background-color: #212529;
color: #ffffff;

14
src/assets/styles/app/_home.scss
View File

@ -43,7 +43,7 @@
margin-left: -50px;
margin-bottom: 20px;
padding: 10px 50px 10px 175px;
font-size: 1.5em;
font-size: 1.5rem;
background-image: linear-gradient(90deg, #445C72 0%, #DBDCDE 100%);
position: relative;
color: #ffffff;
@ -89,18 +89,18 @@
display: block;
font-weight: bold;
font-size: 16px;
margin-top: 1em;
margin-top: 1rem;
}
p {
margin-top: 1em;
margin-bottom: 2em;
margin-top: 1rem;
margin-bottom: 2rem;
&.features-tagline {
color: var(--text-color);
margin-bottom: 0;
margin-top: -5px;
margin-bottom: 2em;
margin-bottom: 2rem;
}
}
}
@ -123,7 +123,7 @@
}
.p-grid > div {
padding: 2em .5em;
padding: 2em .5rem;
}
p {
@ -188,7 +188,7 @@
p {
line-height: 22px;
margin-bottom: 1em;
margin-bottom: 1rem;
}
h3 {

4
src/assets/styles/app/_icons.scss
View File

@ -4,10 +4,10 @@
}
.icons-list i {
font-size: 2em;
font-size: 2rem;
}
.icons-list .p-md-2 {
padding-bottom: 2em;
padding-bottom: 2rem;
}
}

6
src/assets/styles/app/_news.scss
View File

@ -32,14 +32,14 @@
color: #f2b837;
font-size: 25px;
font-weight: bold;
margin: 0 .25em;
margin: 0 .25rem;
}
.helper-text {
background-color: #f2b837;
color: #212121;
padding: 0 0.2em;
margin-right: 0.3em;
padding: 0 0.2rem;
margin-right: 0.3rem;
}
}

2
src/components/autocomplete/AutoComplete.vue
View File

@ -437,7 +437,7 @@ export default {
.p-autocomplete-loader {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-autocomplete-dd .p-autocomplete-input {

2
src/components/badge/Badge.css
View File

@ -11,7 +11,7 @@
}
.p-tag.p-tag-rounded {
border-radius: 10em;
border-radius: 10rem;
}
.p-overlay-badge {

2
src/components/datatable/DataTable.vue
View File

@ -1926,7 +1926,7 @@ export default {
top: 0;
right: 0;
margin: 0;
width: .5em;
width: .5rem;
height: 100%;
padding: 0px;
cursor:col-resize;

2
src/components/dialog/Dialog.vue
View File

@ -332,7 +332,7 @@ export default {
.p-dialog-topright .p-dialog,
.p-dialog-bottomleft .p-dialog,
.p-dialog-bottomright .p-dialog {
margin: .75em;
margin: .75rem;
transform: translate3d(0px, 0px, 0px);
}
.p-dialog-top .p-dialog-enter-active,

4
src/components/dropdown/Dropdown.vue
View File

@ -466,7 +466,7 @@ export default {
.p-dropdown-clear-icon {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-dropdown-trigger {
@ -529,7 +529,7 @@ input.p-dropdown-label {
.p-dropdown-filter-icon {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-fluid .p-dropdown {

118
src/components/editor/Editor.vue
View File

@ -177,7 +177,7 @@ export default {
}
.ql-editor ol,
.ql-editor ul {
padding-left: 1.5em;
padding-left: 1.5rem;
}
.ql-editor ol > li,
.ql-editor ul > li {
@ -209,24 +209,24 @@ export default {
.ql-editor li::before {
display: inline-block;
white-space: nowrap;
width: 1.2em;
width: 1.2rem;
}
.ql-editor li:not(.ql-direction-rtl)::before {
margin-left: -1.5em;
margin-right: 0.3em;
margin-left: -1.5rem;
margin-right: 0.3rem;
text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
margin-left: 0.3em;
margin-right: -1.5em;
margin-left: 0.3rem;
margin-right: -1.5rem;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
padding-left: 1.5em;
padding-left: 1.5rem;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
padding-right: 1.5em;
padding-right: 1.5rem;
}
.ql-editor ol li {
counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
@ -314,112 +314,112 @@ export default {
content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
padding-left: 3em;
padding-left: 3rem;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
padding-left: 4.5em;
padding-left: 4.5rem;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 3em;
padding-right: 3rem;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 4.5em;
padding-right: 4.5rem;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
padding-left: 6em;
padding-left: 6rem;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
padding-left: 7.5em;
padding-left: 7.5rem;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 6em;
padding-right: 6rem;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 7.5em;
padding-right: 7.5rem;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
padding-left: 9em;
padding-left: 9rem;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
padding-left: 10.5em;
padding-left: 10.5rem;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 9em;
padding-right: 9rem;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 10.5em;
padding-right: 10.5rem;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
padding-left: 12em;
padding-left: 12rem;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
padding-left: 13.5em;
padding-left: 13.5rem;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 12em;
padding-right: 12rem;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 13.5em;
padding-right: 13.5rem;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
padding-left: 15em;
padding-left: 15rem;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
padding-left: 16.5em;
padding-left: 16.5rem;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 15em;
padding-right: 15rem;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 16.5em;
padding-right: 16.5rem;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
padding-left: 18em;
padding-left: 18rem;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
padding-left: 19.5em;
padding-left: 19.5rem;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 18em;
padding-right: 18rem;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 19.5em;
padding-right: 19.5rem;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
padding-left: 21em;
padding-left: 21rem;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
padding-left: 22.5em;
padding-left: 22.5rem;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 21em;
padding-right: 21rem;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 22.5em;
padding-right: 22.5rem;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
padding-left: 24em;
padding-left: 24rem;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
padding-left: 25.5em;
padding-left: 25.5rem;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 24em;
padding-right: 24rem;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 25.5em;
padding-right: 25.5rem;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
padding-left: 27em;
padding-left: 27rem;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
padding-left: 28.5em;
padding-left: 28.5rem;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 27em;
padding-right: 27rem;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 28.5em;
padding-right: 28.5rem;
}
.ql-editor .ql-video {
display: block;
@ -480,13 +480,13 @@ export default {
font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
font-size: 0.75em;
font-size: 0.75rem;
}
.ql-editor .ql-size-large {
font-size: 1.5em;
font-size: 1.5rem;
}
.ql-editor .ql-size-huge {
font-size: 2.5em;
font-size: 2.5rem;
}
.ql-editor .ql-direction-rtl {
direction: rtl;
@ -707,22 +707,22 @@ export default {
display: none;
}
.ql-snow .ql-editor h1 {
font-size: 2em;
font-size: 2rem;
}
.ql-snow .ql-editor h2 {
font-size: 1.5em;
font-size: 1.5rem;
}
.ql-snow .ql-editor h3 {
font-size: 1.17em;
font-size: 1.17rem;
}
.ql-snow .ql-editor h4 {
font-size: 1em;
font-size: 1rem;
}
.ql-snow .ql-editor h5 {
font-size: 0.83em;
font-size: 0.83rem;
}
.ql-snow .ql-editor h6 {
font-size: 0.67em;
font-size: 0.67rem;
}
.ql-snow .ql-editor a {
text-decoration: underline;
@ -888,22 +888,22 @@ export default {
content: 'Heading 6';
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
font-size: 2em;
font-size: 2rem;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
font-size: 1.5em;
font-size: 1.5rem;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
font-size: 1.17em;
font-size: 1.17rem;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
font-size: 1em;
font-size: 1rem;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
font-size: 0.83em;
font-size: 0.83rem;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
font-size: 0.67em;
font-size: 0.67rem;
}
.ql-snow .ql-picker.ql-font {
width: 108px;

56
src/components/fullcalendar/FullCalendar.vue
View File

@ -71,7 +71,7 @@ export default {
body .fc {
/* extra precedence to overcome jqui */
font-size: 1em; }
font-size: 1rem; }
/* Colors
--------------------------------------------------------------------------------------------------*/
@ -99,10 +99,10 @@ body .fc {
box-sizing: border-box;
/* dimensions */
margin: 0;
height: 2.1em;
padding: 0 .6em;
height: 2.1rem;
padding: 0 .6rem;
/* text & cursor */
font-size: 1em;
font-size: 1rem;
/* normalize */
white-space: nowrap;
cursor: pointer; }
@ -130,9 +130,9 @@ body .fc {
.fc button .fc-icon {
/* non-theme */
position: relative;
top: -0.05em;
top: -0.05rem;
/* seems to be a good adjustment across browsers */
margin: 0 .2em;
margin: 0 .2rem;
vertical-align: middle; }
/*
@ -266,7 +266,7 @@ hr.fc-divider {
table-layout: fixed;
border-collapse: collapse;
border-spacing: 0;
font-size: 1em;
font-size: 1rem;
/* normalize cross-browser */ }
.fc th {
@ -392,7 +392,7 @@ temporary rendered events).
/* for resize handle and other inner positioning */
display: block;
/* make the <a> tag block */
font-size: .85em;
font-size: .85rem;
line-height: 1.3;
border-radius: 3px;
border: 1px solid #3a87ad;
@ -612,7 +612,7 @@ tr:first-child > td > .fc-day-grid-event {
/* "more" link that represents hidden events */
a.fc-more {
margin: 1px 3px;
font-size: .85em;
font-size: .85rem;
cursor: pointer;
text-decoration: none; }
@ -691,9 +691,9 @@ TODO: more distinction between this file and common.css
--------------------------------------------------------------------------------------------------*/
.fc-icon {
display: inline-block;
height: 1em;
line-height: 1em;
font-size: 1em;
height: 1rem;
line-height: 1rem;
font-size: 1rem;
text-align: center;
overflow: hidden;
font-family: "Courier New", Courier, monospace;
@ -764,7 +764,7 @@ NOTE: use percentage font sizes or else old IE chokes
border-style: solid; }
.fc-unthemed .fc-popover .fc-header .fc-close {
font-size: .9em;
font-size: .9rem;
margin-top: 2px; }
/* List View
@ -864,10 +864,10 @@ NOTE: use percentage font sizes or else old IE chokes
text-align: center; }
.fc-toolbar.fc-header-toolbar {
margin-bottom: 1em; }
margin-bottom: 1rem; }
.fc-toolbar.fc-footer-toolbar {
margin-top: 1em; }
margin-top: 1rem; }
.fc-toolbar .fc-left {
float: left; }
@ -882,7 +882,7 @@ NOTE: use percentage font sizes or else old IE chokes
.fc .fc-toolbar > * > * {
/* extra precedence to override button border margins */
float: left;
margin-left: .75em; }
margin-left: .75rem; }
/* the first thing within each left/center/right section */
.fc .fc-toolbar > * > :first-child {
@ -934,11 +934,11 @@ NOTE: use percentage font sizes or else old IE chokes
.fc-basicWeek-view .fc-content-skeleton,
.fc-basicDay-view .fc-content-skeleton {
/* there may be week numbers in these views, so no padding-top */
padding-bottom: 1em;
padding-bottom: 1rem;
/* ensure a space at bottom of cell for user selecting/clicking */ }
.fc-basic-view .fc-body .fc-row {
min-height: 4em;
min-height: 4rem;
/* ensure that all rows are at least this tall */ }
/* a "rigid" row will take up a constant amount of height because content-skeleton is absolute */
@ -979,7 +979,7 @@ NOTE: use percentage font sizes or else old IE chokes
border-radius: 0 0 0 3px; }
.fc-basic-view .fc-day-top .fc-week-number {
min-width: 1.5em;
min-width: 1.5rem;
text-align: center;
background-color: #f2f2f2;
color: #808080; }
@ -991,7 +991,7 @@ NOTE: use percentage font sizes or else old IE chokes
.fc-basic-view td.fc-week-number > * {
/* work around the way we do column resizing and ensure a minimum width */
display: inline-block;
min-width: 1.25em; }
min-width: 1.25rem; }
/* AgendaView all-day area
--------------------------------------------------------------------------------------------------*/
@ -1001,11 +1001,11 @@ NOTE: use percentage font sizes or else old IE chokes
/* so the "more.." popover will be over the time grid */ }
.fc-agenda-view .fc-day-grid .fc-row {
min-height: 3em;
min-height: 3rem;
/* all-day section will never get shorter than this */ }
.fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton {
padding-bottom: 1em;
padding-bottom: 1rem;
/* give space underneath events for clicking/selecting days */ }
/* TimeGrid axis running down the side (for both the all-day area and the slot area)
@ -1086,7 +1086,7 @@ NOTE: use percentage font sizes or else old IE chokes
/* TimeGrid Slats (lines that run horizontally)
--------------------------------------------------------------------------------------------------*/
.fc-time-grid .fc-slats td {
height: 1.5em;
height: 1.5rem;
border-bottom: 0;
/* each cell is responsible for its top border */ }
@ -1173,7 +1173,7 @@ be a descendant of the grid when it is being dragged.
padding: 0 1px; }
.fc-time-grid-event .fc-time {
font-size: .85em;
font-size: .85rem;
white-space: nowrap; }
/* short mode, where time and title are on the same line */
@ -1200,7 +1200,7 @@ be a descendant of the grid when it is being dragged.
/* seperate with a dash, wrapped in nbsp's */ }
.fc-time-grid-event.fc-short .fc-title {
font-size: .85em;
font-size: .85rem;
/* make the title text the same size as the time */
padding: 0;
/* undo padding from above */ }
@ -1405,12 +1405,12 @@ be a descendant of the grid when it is being dragged.
/* use a more border-friendly method for this... */ }
.fc tbody .fc-row .fc-content-skeleton tbody tr:last-child td {
/* only works in newer browsers */
padding-bottom: 1em;
padding-bottom: 1rem;
/* ...gives space within the skeleton. also ensures min height in a way */ }
.fc tbody .fc-row .fc-content-skeleton table {
/* provides a min-height for the row, but only effective for IE, which exaggerates this value,
making it look more like 3em. for other browers, it will already be this tall */
height: 1em; }
height: 1rem; }
/* Undo month-view event limiting. Display all events and hide the "more" links
--------------------------------------------------------------------------------------------------*/
.fc-more-cell,
@ -1442,7 +1442,7 @@ be a descendant of the grid when it is being dragged.
position: static; }
/* in case there are no events, we still want some height */
.fc-time-grid .fc-content-skeleton table {
height: 4em; }
height: 4rem; }
/* kill the horizontal spacing made by the event container. event margins will be done below */
.fc-time-grid .fc-event-container {
margin: 0 !important; }

4
src/components/galleria/Galleria.vue
View File

@ -195,7 +195,7 @@ export default {
.p-galleria-preview-nav-button {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
display: inline-flex;
justify-content: center;
align-items: center;
@ -404,7 +404,7 @@ export default {
.p-galleria-mask .p-galleria-preview-nav-button {
position: fixed;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
/* Keyboard Support */

6
src/components/inputtext/InputText.css
View File

@ -35,7 +35,7 @@
position: absolute;
pointer-events: none;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
transition-property: all;
transition-timing-function: ease;
line-height: 1;
@ -45,7 +45,7 @@
.p-float-label input.p-filled ~ label,
.p-float-label .p-inputwrapper-focus ~ label,
.p-float-label .p-inputwrapper-filled ~ label {
top: -.75em;
top: -.75rem;
font-size: 12px;
}
@ -63,5 +63,5 @@
.p-input-icon-right > i {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}

2
src/components/listbox/Listbox.vue
View File

@ -253,7 +253,7 @@ export default {
.p-listbox-filter-icon {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-listbox-filter {

2
src/components/megamenu/MegaMenu.vue
View File

@ -371,7 +371,7 @@ export default {
.p-megamenu-col-6,
.p-megamenu-col-12 {
flex: 0 0 auto;
padding: 0.5em;
padding: 0.5rem;
}
.p-megamenu-col-2 {

2
src/components/multiselect/MultiSelect.vue
View File

@ -482,7 +482,7 @@ export default {
.p-multiselect-filter-icon {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-multiselect-filter-container .p-inputtext {

4
src/components/orderlist/OrderList.vue
View File

@ -318,8 +318,8 @@ export default {
margin: 0;
padding: 0;
overflow: auto;
min-height: 12em;
max-height: 24em;
min-height: 12rem;
max-height: 24rem;
}
.p-orderlist-item {

2
src/components/organizationchart/OrganizationChart.vue
View File

@ -97,7 +97,7 @@ export default {
.p-organizationchart-table > tbody > tr > td {
text-align: center;
vertical-align: top;
padding: 0 .75em;
padding: 0 .75rem;
}
.p-organizationchart-node-content {

2
src/components/overlaypanel/OverlayPanel.vue
View File

@ -195,7 +195,7 @@ export default {
.p-overlaypanel:after, .p-overlaypanel:before {
bottom: 100%;
left: 1.25em;
left: 1.25rem;
content: " ";
height: 0;
width: 0;

4
src/components/picklist/PickList.vue
View File

@ -495,8 +495,8 @@ export default {
margin: 0;
padding: 0;
overflow: auto;
min-height: 12em;
max-height: 24em;
min-height: 12rem;
max-height: 24rem;
}
.p-picklist-item {

22
src/components/sidebar/Sidebar.vue
View File

@ -168,14 +168,14 @@ export default {
.p-sidebar-left {
top: 0;
left: 0;
width: 20em;
width: 20rem;
height: 100%;
}
.p-sidebar-right {
top: 0;
right: 0;
width: 20em;
width: 20rem;
height: 100%;
}
@ -183,14 +183,14 @@ export default {
top: 0;
left: 0;
width: 100%;
height: 10em;
height: 10rem;
}
.p-sidebar-bottom {
bottom: 0;
left: 0;
width: 100%;
height: 10em;
height: 10rem;
}
.p-sidebar-full {
@ -234,32 +234,32 @@ export default {
.p-sidebar-left.p-sidebar-sm,
.p-sidebar-right.p-sidebar-sm {
width: 20em;
width: 20rem;
}
.p-sidebar-left.p-sidebar-md,
.p-sidebar-right.p-sidebar-md {
width: 40em;
width: 40rem;
}
.p-sidebar-left.p-sidebar-lg,
.p-sidebar-right.p-sidebar-lg {
width: 60em;
width: 60rem;
}
.p-sidebar-top.p-sidebar-sm,
.p-sidebar-bottom.p-sidebar-sm {
height: 10em;
height: 10rem;
}
.p-sidebar-top.p-sidebar-md,
.p-sidebar-bottom.p-sidebar-md {
height: 20em;
height: 20rem;
}
.p-sidebar-top.p-sidebar-lg,
.p-sidebar-bottom.p-sidebar-lg {
height: 30em;
height: 30rem;
}
@media screen and (max-width: 64em) {
@ -267,7 +267,7 @@ export default {
.p-sidebar-left.p-sidebar-md,
.p-sidebar-right.p-sidebar-lg,
.p-sidebar-right.p-sidebar-md {
width: 20em;
width: 20rem;
}
}
</style>

2
src/components/terminal/Terminal.vue
View File

@ -62,7 +62,7 @@ export default {
<style>
.p-terminal {
height: 18em;
height: 18rem;
overflow: auto;
}

2
src/components/toast/Toast.vue
View File

@ -96,7 +96,7 @@ export default {
<style>
.p-toast {
position: fixed;
width: 25em;
width: 25rem;
}
.p-toast-message {

18
src/components/tooltip/Tooltip.css
View File

@ -1,13 +1,13 @@
.p-tooltip {
position:absolute;
display:none;
padding: .25em .5em;
max-width: 12.5em;
padding: .25em .5rem;
max-width: 12.5rem;
}
.p-tooltip.p-tooltip-right,
.p-tooltip.p-tooltip-left {
padding: 0 .25em;
padding: 0 .25rem;
}
.p-tooltip.p-tooltip-top,
@ -30,15 +30,15 @@
.p-tooltip-right .p-tooltip-arrow {
top: 50%;
left: 0;
margin-top: -.25em;
margin-top: -.25rem;
border-width: .25em .25em .25em 0;
}
.p-tooltip-left .p-tooltip-arrow {
top: 50%;
right: 0;
margin-top: -.25em;
border-width: .25em 0 .25em .25em;
margin-top: -.25rem;
border-width: .25em 0 .25em .25rem;
}
.p-tooltip.p-tooltip-top {
@ -48,13 +48,13 @@
.p-tooltip-top .p-tooltip-arrow {
bottom: 0;
left: 50%;
margin-left: -.25em;
margin-left: -.25rem;
border-width: .25em .25em 0;
}
.p-tooltip-bottom .p-tooltip-arrow {
top: 0;
left: 50%;
margin-left: -.25em;
border-width: 0 .25em .25em;
margin-left: -.25rem;
border-width: 0 .25em .25rem;
}

4
src/components/tree/Tree.vue
View File

@ -319,12 +319,12 @@ export default {
.p-tree-filter-icon {
position: absolute;
top: 50%;
margin-top: -.5em;
margin-top: -.5rem;
}
.p-tree-loading {
position: relative;
min-height: 4em;
min-height: 4rem;
}
.p-tree .p-tree-loading-mask {

2
src/components/treetable/TreeTable.vue
View File

@ -956,7 +956,7 @@ export default {
top: 0;
right: 0;
margin: 0;
width: .5em;
width: .5rem;
height: 100%;
padding: 0px;
cursor:col-resize;

2
src/views/accordion/AccordionDemo.vue
View File

@ -134,7 +134,7 @@ export default {
}
span {
margin: 0 .5em;
margin: 0 .5rem;
}
}

2
src/views/accordion/AccordionDoc.vue
View File

@ -391,7 +391,7 @@ export default {
}
span {
margin: 0 .5em;
margin: 0 .5rem;
}
}
</CodeHighlight>

2
src/views/blockui/BlockUIDemo.vue
View File

@ -69,6 +69,6 @@ export default {
}
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/button/ButtonDoc.vue
View File

@ -241,7 +241,7 @@ import Button from 'primevue/button';
<CodeHighlight lang="css">
button {
margin-right: .5em;
margin-right: .5rem;
}
</CodeHighlight>
</TabPanel>

2
src/views/card/CardDemo.vue
View File

@ -8,7 +8,7 @@
</div>
<div class="content-section implementation">
<Card style="width: 25em; margin-bottom: 2em">
<Card style="width: 25rem; margin-bottom: 2em">
<template slot="title">
Simple Card
</template>

2
src/views/card/CardDoc.vue
View File

@ -81,7 +81,7 @@ import Card from 'primevue/card';
</a>
<CodeHighlight>
<template v-pre>
&lt;Card style="width: 25em; margin-bottom: 2em"&gt;
&lt;Card style="width: 25rem; margin-bottom: 2em"&gt;
&lt;template slot="title"&gt;
Simple Card
&lt;/template&gt;

8
src/views/carousel/CarouselDemo.vue
View File

@ -145,7 +145,7 @@ export default {
> .p-grid {
border: 1px solid #dee2e6;
border-radius: 3px;
margin: .3em;
margin: .3rem;
text-align: center;
padding: 2em 0 2.25em 0;
}
@ -163,7 +163,7 @@ export default {
}
button {
margin-left: .5em;
margin-left: .5rem;
&:first-child {
margin-left: 0;
@ -187,7 +187,7 @@ export default {
&.p-carousel-item-start {
.car-details {
> .p-grid {
margin-left: .6em;
margin-left: .6rem;
}
}
}
@ -195,7 +195,7 @@ export default {
&.p-carousel-item-end {
.car-details {
> .p-grid {
margin-right: .6em;
margin-right: .6rem;
}
}
}

8
src/views/carousel/CarouselDoc.vue
View File

@ -397,7 +397,7 @@ export default {
> .p-grid {
border: 1px solid #dee2e6;
border-radius: 3px;
margin: .3em;
margin: .3rem;
text-align: center;
padding: 2em 0 2.25em 0;
}
@ -415,7 +415,7 @@ export default {
}
button {
margin-left: .5em;
margin-left: .5rem;
&amp;:first-child {
margin-left: 0;
@ -439,7 +439,7 @@ export default {
&amp;.p-carousel-item-start {
.car-details {
> .p-grid {
margin-left: .6em;
margin-left: .6rem;
}
}
}
@ -447,7 +447,7 @@ export default {
&amp;.p-carousel-item-end {
.car-details {
> .p-grid {
margin-right: .6em;
margin-right: .6rem;
}
}
}

2
src/views/checkbox/CheckboxDemo.vue
View File

@ -79,6 +79,6 @@ export default {
}
label {
margin-left: .5em;
margin-left: .5rem;
}
</style>

6
src/views/datatable/DataTableCrudDemo.vue
View File

@ -261,14 +261,14 @@ export default {
<style scoped>
.p-cardialog-content {
padding: 1em;
padding: 1rem;
}
.p-cardialog-content .p-col-4 {
padding: .75em;
padding: .75rem;
}
.p-cardialog-content .p-col-8 {
padding: .5em;
padding: .5rem;
}
</style>

6
src/views/datatable/DataTableDemo.vue
View File

@ -97,7 +97,7 @@
<InputText type="text" v-model="filters['activity']" class="p-column-filter" placeholder="Minimum"/>
</template>
</Column>
<Column headerStyle="width: 8em; text-align: center" bodyStyle="text-align: center; overflow: visible">
<Column headerStyle="width: 8rem; text-align: center" bodyStyle="text-align: center; overflow: visible">
<template #body>
<Button type="button" icon="pi pi-cog" class="p-button-secondary"></Button>
</template>
@ -183,7 +183,7 @@ export default {
<style lang="scss" scoped>
.customer-badge {
border-radius: 2px;
padding: .25em .5em;
padding: .25em .5rem;
text-transform: uppercase;
font-weight: 700;
font-size: 12px;
@ -230,7 +230,7 @@ export default {
}
span {
margin-top: .125em;
margin-top: .125rem;
}
}

12
src/views/datatable/DataTableDoc.vue
View File

@ -1633,10 +1633,10 @@ export default {
clear: left;
.p-column-title {
padding: .4em;
padding: .4rem;
min-width: 30%;
display: inline-block;
margin: -.4em 1em -.4em -.4em;
margin: -.4em 1em -.4em -.4rem;
font-weight: bold;
}
}
@ -1692,7 +1692,7 @@ export default {
<CodeHighlight lang="css">
.year-cell {
padding: 0.429em 0.857em;
padding: 0.429em 0.857rem;
&amp;.old-car {
background-color: #41b783;
@ -2473,7 +2473,7 @@ export default {
&lt;InputText type="text" v-model="filters['activity']" class="p-column-filter" placeholder="Minimum"/&gt;
&lt;/template&gt;
&lt;/Column&gt;
&lt;Column headerStyle="width: 8em; text-align: center" bodyStyle="text-align: center; overflow: visible"&gt;
&lt;Column headerStyle="width: 8rem; text-align: center" bodyStyle="text-align: center; overflow: visible"&gt;
&lt;template #body&gt;
&lt;Button type="button" icon="pi pi-cog" class="p-button-secondary"&gt;&lt;/Button&gt;
&lt;/template&gt;
@ -2553,7 +2553,7 @@ export default {
<CodeHighlight lang="css">
.customer-badge {
border-radius: 2px;
padding: .25em .5em;
padding: .25em .5rem;
text-transform: uppercase;
font-weight: 700;
font-size: 12px;
@ -2600,7 +2600,7 @@ export default {
}
span {
margin-top: .125em;
margin-top: .125rem;
}
}

6
src/views/datatable/DataTableEditDemo.vue
View File

@ -346,7 +346,7 @@ export default {
<style lang="scss" scoped>
/deep/ .p-datatable th,
/deep/ .p-datatable td {
height: 3.5em;
height: 3.5rem;
}
.p-dropdown-car-option {
@ -355,12 +355,12 @@ export default {
align-items: center;
img {
margin-right: .5em;
margin-right: .5rem;
width: 24px;
}
span {
margin-top: .125em;
margin-top: .125rem;
}
}
</style>

4
src/views/datatable/DataTableFilterDemo.vue
View File

@ -197,13 +197,13 @@ export default {
.p-dropdown-car-option {
img {
vertical-align: middle;
margin-right: .5em;
margin-right: .5rem;
width: 24px;
}
span {
float: right;
margin-top: .125em;
margin-top: .125rem;
}
}
</style>

8
src/views/datatable/DataTableResponsiveDemo.vue
View File

@ -117,10 +117,10 @@ export default {
clear: left;
.p-column-title {
padding: .4em;
padding: .4rem;
min-width: 30%;
display: inline-block;
margin: -.4em 1em -.4em -.4em;
margin: -.4em 1em -.4em -.4rem;
font-weight: bold;
}
}
@ -176,10 +176,10 @@ export default {
border: 0 none;
.p-column-title {
padding: .4em;
padding: .4rem;
min-width: 30%;
display: inline-block;
margin: -.4em 1em -.4em -.4em;
margin: -.4em 1em -.4em -.4rem;
font-weight: bold;
}
}

6
src/views/datatable/DataTableRowExpandDemo.vue
View File

@ -156,10 +156,10 @@ export default {
text-align: left;
button {
min-width: 10em;
min-width: 10rem;
&:first-child {
margin-right: .5em;
margin-right: .5rem;
}
}
}
@ -168,7 +168,7 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2em;
padding: 2rem;
& > div {
display: flex;

2
src/views/datatable/DataTableRowGroupDemo.vue
View File

@ -217,7 +217,7 @@ export default {
.p-row-toggler {
vertical-align: middle;
margin-right: .25em;
margin-right: .25rem;
}
}

8
src/views/datatable/DataTableStateDemo.vue
View File

@ -283,24 +283,24 @@ export default {
}
.p-column-filter {
margin-top: .5em;
margin-top: .5rem;
}
.p-multiselect {
width: 100%;
margin-top: .5em;
margin-top: .5rem;
}
.p-dropdown-car-option {
img {
vertical-align: middle;
margin-right: .5em;
margin-right: .5rem;
width: 24px;
}
span {
float: right;
margin-top: .125em;
margin-top: .125rem;
}
}
</style>

4
src/views/datatable/DataTableStyleDemo.vue
View File

@ -69,7 +69,7 @@ export default {
<CodeHighlight lang="css">
.year-cell {
padding: 0.429em 0.857em;
padding: 0.429em 0.857rem;
&amp;.old-car {
background-color: #41b783;
@ -116,7 +116,7 @@ export default {
<style scoped lang="scss">
.year-cell {
padding: 0.429em 0.857em;
padding: 0.429em 0.857rem;
&.old-car {
background-color: #41b783;

10
src/views/dataview/DataViewDemo.vue
View File

@ -102,7 +102,7 @@ export default {
<style lang="scss" scoped>
.p-dropdown {
width: 12em;
width: 12rem;
font-weight: normal;
}
@ -111,7 +111,7 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2em;
padding: 2rem;
& > div {
display: flex;
@ -124,13 +124,13 @@ export default {
}
.car-detail {
padding: 0 1em 1em 1em;
padding: 0 1em 1em 1rem;
border-bottom: 1px solid #d9dad9;
margin: 1em;
margin: 1rem;
}
.p-panel-content {
padding: 1em;
padding: 1rem;
}
}

10
src/views/dataview/DataViewDoc.vue
View File

@ -498,7 +498,7 @@ export default {
<CodeHighlight lang="css">
.p-dropdown {
width: 12em;
width: 12rem;
font-weight: normal;
}
@ -507,7 +507,7 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2em;
padding: 2rem;
border-bottom: 1px solid #d9dad9;
&amp; > div {
@ -521,13 +521,13 @@ export default {
}
.car-detail {
padding: 0 1em 1em 1em;
padding: 0 1em 1em 1rem;
border-bottom: 1px solid #d9dad9;
margin: 1em;
margin: 1rem;
}
.p-panel-content {
padding: 1em;
padding: 1rem;
}
}

4
src/views/dropdown/DropdownDemo.vue
View File

@ -75,7 +75,7 @@ export default {
<style lang="scss" scoped>
.p-dropdown {
width: 12em;
width: 12rem;
}
.p-dropdown-car-option,
@ -85,7 +85,7 @@ export default {
align-items: center;
img {
margin-right: .5em;
margin-right: .5rem;
width: 24px;
}

4
src/views/dropdown/DropdownDoc.vue
View File

@ -356,7 +356,7 @@ export default {
<CodeHighlight lang="css">
.p-dropdown {
width: 12em;
width: 12rem;
}
.p-dropdown-car-option,
@ -366,7 +366,7 @@ export default {
align-items: center;
img {
margin-right: .5em;
margin-right: .5rem;
width: 24px;
}

6
src/views/flexgrid/FlexGridDemo.vue
View File

@ -453,8 +453,8 @@ export default {
.sample-layout > div {
background-color: #c2c8ce;
text-align: center;
padding-top: 1em;
padding-bottom: 1em;
padding-top: 1rem;
padding-bottom: 1rem;
border-radius: 4px;
}
@ -478,7 +478,7 @@ export default {
}
.nested-grid .p-col-4 {
padding-bottom: 1em;
padding-bottom: 1rem;
}
.dynamic-box-enter-active, .dynamic-box-leave-active {

6
src/views/flexgrid/FlexGridDoc.vue
View File

@ -1043,8 +1043,8 @@ export default {
.sample-layout > div {
background-color: #f1f1f1;
text-align: center;
padding-top: 1em;
padding-bottom: 1em;
padding-top: 1rem;
padding-bottom: 1rem;
border-radius: 4px;
}
@ -1068,7 +1068,7 @@ export default {
}
.nested-grid .p-col-4 {
padding-bottom: 1em;
padding-bottom: 1rem;
}
.dynamic-box-enter-active, .dynamic-box-leave-active {

4
src/views/galleria/GalleriaCaptionDemo.vue
View File

@ -18,7 +18,7 @@
</div>
</template>
<template #previewCaption="{item}">
<h4 style="margin-bottom: .5em;">{{item.title}}</h4>
<h4 style="margin-bottom: .5rem;">{{item.title}}</h4>
<p>{{item.alt}}</p>
</template>
</Galleria>
@ -39,7 +39,7 @@
&lt;/div&gt;
&lt;/template&gt;
&lt;template #previewCaption="{item}"&gt;
&lt;h4 style="margin-bottom: .5em;"&gt;{{item.title}}&lt;/h4&gt;
&lt;h4 style="margin-bottom: .5rem;"&gt;{{item.title}}&lt;/h4&gt;
&lt;p&gt;{{item.alt}}&lt;/p&gt;
&lt;/template&gt;
&lt;/Galleria&gt;

14
src/views/galleria/GalleriaDemo.vue
View File

@ -174,8 +174,8 @@ export default {
> button {
background-color: transparent;
padding: .3em;
margin: .2em;
padding: .3rem;
margin: .2rem;
border: 0 none;
border-radius: 0;
color: #ffffff;
@ -189,8 +189,8 @@ export default {
flex-grow: 1;
> span {
font-size: .9em;
padding-left: .829em;
font-size: .9rem;
padding-left: .829rem;
&.title {
font-weight: bold;
@ -204,9 +204,9 @@ export default {
.p-galleria-preview-container {
.p-galleria-preview-nav-button {
top: 50%;
height: 20em;
width: 4em;
margin-top: -10em;
height: 20rem;
width: 4rem;
margin-top: -10rem;
}
}
}

14
src/views/galleria/GalleriaDoc.vue
View File

@ -488,8 +488,8 @@ export default {
> button {
background-color: transparent;
padding: .3em;
margin: .2em;
padding: .3rem;
margin: .2rem;
border: 0 none;
border-radius: 0;
color: #ffffff;
@ -503,8 +503,8 @@ export default {
flex-grow: 1;
> span {
font-size: .9em;
padding-left: .829em;
font-size: .9rem;
padding-left: .829rem;
&.title {
font-weight: bold;
@ -518,9 +518,9 @@ export default {
.p-galleria-preview-container {
.p-galleria-preview-nav-button {
top: 50%;
height: 20em;
width: 4em;
margin-top: -10em;
height: 20rem;
width: 4rem;
margin-top: -10rem;
}
}
}

24
src/views/galleria/GalleriaIndicatorDemo.vue
View File

@ -63,7 +63,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="top">
<template #header>
Top
@ -78,7 +78,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="left">
<template #header>
Left
@ -93,7 +93,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="right">
<template #header>
Right
@ -128,7 +128,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;" class="custom-indicator-galleria"
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;" class="custom-indicator-galleria"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" indicatorsPosition="left">
<template #item="slotProps">
<img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" />
@ -145,7 +145,7 @@
</template>
</Galleria>
<Galleria :value="images2" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;" class="custom-indicator-galleria2"
<Galleria :value="images2" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;" class="custom-indicator-galleria2"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" indicatorsPosition="left">
<template #item="slotProps">
<img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" />
@ -156,7 +156,7 @@
</div>
</template>
<template #indicator="{index}">
<div style="padding: .2em; cursor: pointer">
<div style="padding: .2rem; cursor: pointer">
<img :src="images2[index].thumbnailImageSrc" :alt="images2[index].alt" style="display: block"/>
</div>
</template>
@ -229,7 +229,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="top"&gt;
&lt;template #header&gt;
Top
@ -244,7 +244,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="left"&gt;
&lt;template #header&gt;
Left
@ -259,7 +259,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;"
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" :showIndicatorsOnPreview="true" indicatorsPosition="right"&gt;
&lt;template #header&gt;
Right
@ -294,7 +294,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;" class="custom-indicator-galleria"
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;" class="custom-indicator-galleria"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" indicatorsPosition="left"&gt;
&lt;template #item="slotProps"&gt;
&lt;img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" /&gt;
@ -311,7 +311,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images2" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2em;" class="custom-indicator-galleria2"
&lt;Galleria :value="images2" :responsiveOptions="responsiveOptions" :numVisible="5" style="max-width: 520px; margin-top: 2rem;" class="custom-indicator-galleria2"
:showThumbnails="false" :showIndicators="true" :changePreviewOnIndicatorHover="true" indicatorsPosition="left"&gt;
&lt;template #item="slotProps"&gt;
&lt;img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" /&gt;
@ -322,7 +322,7 @@
&lt;/div&gt;
&lt;/template&gt;
&lt;template #indicator="{index}"&gt;
&lt;div style="padding: .2em; cursor: pointer"&gt;
&lt;div style="padding: .2rem; cursor: pointer"&gt;
&lt;img :src="images2[index].thumbnailImageSrc" :alt="images2[index].alt" style="display: block"/&gt;
&lt;/div&gt;
&lt;/template&gt;

12
src/views/galleria/GalleriaThumbnailDemo.vue
View File

@ -35,7 +35,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 610px; margin-top: 2em;">
<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 610px; margin-top: 2rem;">
<template #header>
Right
</template>
@ -49,7 +49,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="top" style="max-width: 520px; margin-top: 2em;">
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="top" style="max-width: 520px; margin-top: 2rem;">
<template #header>
Top
</template>
@ -63,7 +63,7 @@
</template>
</Galleria>
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="bottom" style="max-width: 520px; margin-top: 2em;">
<Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="bottom" style="max-width: 520px; margin-top: 2rem;">
<template #header>
Bottom
</template>
@ -110,7 +110,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 610px; margin-top: 2em;"&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 610px; margin-top: 2rem;"&gt;
&lt;template #header&gt;
Right
&lt;/template&gt;
@ -124,7 +124,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="top" style="max-width: 520px; margin-top: 2em;"&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="top" style="max-width: 520px; margin-top: 2rem;"&gt;
&lt;template #header&gt;
Top
&lt;/template&gt;
@ -138,7 +138,7 @@
&lt;/template&gt;
&lt;/Galleria&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="bottom" style="max-width: 520px; margin-top: 2em;"&gt;
&lt;Galleria :value="images" :responsiveOptions="responsiveOptions" :numVisible="5" thumbnailsPosition="bottom" style="max-width: 520px; margin-top: 2rem;"&gt;
&lt;template #header&gt;
Bottom
&lt;/template&gt;

2
src/views/icons/Icons.vue
View File

@ -91,7 +91,7 @@ export default {
<style lang="css" scoped>
.icon-filter {
width: 100%;
padding: 1em;
padding: 1rem;
margin: 16px 0 26px 0;
}
</style>

2
src/views/inplace/InplaceDemo.vue
View File

@ -22,7 +22,7 @@
<Inplace>
<template #display>
<span class="pi pi-search" style="vertical-align: middle"></span>
<span style="margin-left:.5em; vertical-align: middle">View Picture</span>
<span style="margin-left:.5rem; vertical-align: middle">View Picture</span>
</template>
<template #content>
<img src="demo/images/nature/nature1.jpg" />

4
src/views/inplace/InplaceDoc.vue
View File

@ -15,7 +15,7 @@ import Inplace from 'primevue/inplace';
&lt;Inplace&gt;
&lt;template #display&gt;
&lt;span class="pi pi-search" style="vertical-align: middle"&gt;&lt;/span&gt;
&lt;span style="margin-left:.5em; vertical-align: middle"&gt;View Picture&lt;/span&gt;
&lt;span style="margin-left:.5rem; vertical-align: middle"&gt;View Picture&lt;/span&gt;
&lt;/template&gt;
&lt;template #content&gt;
&lt;img src="demo/images/nature/nature1.jpg" /&gt;
@ -185,7 +185,7 @@ export default {
&lt;Inplace&gt;
&lt;template #display&gt;
&lt;span className="pi pi-search" style="vertical-align: middle"&gt;&lt;/span&gt;
&lt;span style="margin-left:.5em; vertical-align: middle"&gt;View Picture&lt;/span&gt;
&lt;span style="margin-left:.5rem; vertical-align: middle"&gt;View Picture&lt;/span&gt;
&lt;/template&gt;
&lt;template #content&gt;
&lt;img src="demo/images/nature/nature1.jpg" /&gt;

2
src/views/inputnumber/InputNumberDemo.vue
View File

@ -148,6 +148,6 @@ export default {
<style scoped>
.p-inputnumber {
margin-top: 1em;
margin-top: 1rem;
}
</style>

4
src/views/message/MessageDemo.vue
View File

@ -71,10 +71,10 @@ export default {
<style scoped>
button.p-button {
margin-right: .5em;
margin-right: .5rem;
}
.p-inputtext {
margin-right: .5em;
margin-right: .5rem;
}
</style>

4
src/views/message/MessageDoc.vue
View File

@ -287,11 +287,11 @@ export default {
<CodeHighlight lang="css">
button.p-button {
margin-right: .5em;
margin-right: .5rem;
}
.p-inputtext {
margin-right: .25em;
margin-right: .25rem;
}
</CodeHighlight>
</TabPanel>

4
src/views/orderlist/OrderListDemo.vue
View File

@ -63,13 +63,13 @@ export default {
.p-caritem-vin {
font-weight: 600;
display: block;
margin-bottom: .25em;
margin-bottom: .25rem;
}
img {
width: 48px;
height: 48px;
margin-right: .5em;
margin-right: .5rem;
}
}
</style>

4
src/views/orderlist/OrderListDoc.vue
View File

@ -219,13 +219,13 @@ export default {
.p-caritem-vin {
font-weight: 600;
display: block;
margin-bottom: .25em;
margin-bottom: .25rem;
}
img {
width: 48px;
height: 48px;
margin-right: .5em;
margin-right: .5rem;
}
}
</CodeHighlight>

2
src/views/organizationchart/OrganizationChartDemo.vue
View File

@ -185,7 +185,7 @@ export default {
}
.node-header, .node-content {
padding: .5em .7em;
padding: .5em .7rem;
}
.node-header {

2
src/views/organizationchart/OrganizationChartDoc.vue
View File

@ -655,7 +655,7 @@ export default {
}
.node-header, .node-content {
padding: .5em .7em;
padding: .5em .7rem;
}
.node-header {

2
src/views/paginator/PaginatorDemo.vue
View File

@ -65,6 +65,6 @@ export default {
.image-gallery {
text-align: center;
padding: 1em;
padding: 1rem;
}
</style>

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

@ -293,7 +293,7 @@ export default {
.image-gallery {
text-align: center;
padding: 1em;
padding: 1rem;
}
</CodeHighlight>
</TabPanel>

2
src/views/panelmenu/PanelMenuDemo.vue
View File

@ -148,6 +148,6 @@ export default {
<style scoped lang="scss">
.p-panelmenu {
width: 22em;
width: 22rem;
}
</style>

4
src/views/picklist/PickListDemo.vue
View File

@ -66,13 +66,13 @@ export default {
.p-caritem-vin {
font-weight: 600;
display: block;
margin-bottom: .25em;
margin-bottom: .25rem;
}
img {
width: 48px;
height: 48px;
margin-right: .5em;
margin-right: .5rem;
}
}
</style>

4
src/views/picklist/PickListDoc.vue
View File

@ -281,13 +281,13 @@ export default {
.p-caritem-vin {
font-weight: 600;
display: block;
margin-bottom: .25em;
margin-bottom: .25rem;
}
img {
width: 48px;
height: 48px;
margin-right: .5em;
margin-right: .5rem;
}
}
</CodeHighlight>

2
src/views/radiobutton/RadioButtonDemo.vue
View File

@ -70,6 +70,6 @@ export default {
}
label {
margin-left: .5em;
margin-left: .5rem;
}
</style>

2
src/views/selectbutton/SelectButtonDemo.vue
View File

@ -70,7 +70,7 @@ export default {
img {
width: 24px;
margin-right: .5em;
margin-right: .5rem;
}
}
</style>

2
src/views/selectbutton/SelectButtonDoc.vue
View File

@ -214,7 +214,7 @@ export default {
img {
width: 24px;
margin-right: .5em;
margin-right: .5rem;
}
}
</CodeHighlight>

4
src/views/slider/SliderDemo.vue
View File

@ -50,10 +50,10 @@ export default {
<style scoped>
.p-slider-horizontal, .p-inputtext {
width: 14em;
width: 14rem;
}
.p-slider-vertical {
height: 14em;
height: 14rem;
}
</style>

4
src/views/slider/SliderDoc.vue
View File

@ -213,11 +213,11 @@ export default {
<CodeHighlight lang="css">
.p-slider-horizontal, .p-inputtext {
width: 14em;
width: 14rem;
}
.p-slider-vertical {
height: 14em;
height: 14rem;
}
</CodeHighlight>
</TabPanel>

2
src/views/splitbutton/SplitButtonDemo.vue
View File

@ -75,6 +75,6 @@ export default {
<style lang="scss" scoped>
.p-splitbutton {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/splitbutton/SplitButtonDoc.vue
View File

@ -255,7 +255,7 @@ export default {
<CodeHighlight lang="css">
.p-splitbutton {
margin-right: .5em;
margin-right: .5rem;
}
</CodeHighlight>
</TabPanel>

4
src/views/tabmenu/TabMenuDemo.vue
View File

@ -41,7 +41,7 @@ export default {
/deep/ .tabmenudemo-content {
display: flex;
align-items: center;
padding: 1em;
padding: 1rem;
h1 {
font-weight: 400;
@ -49,7 +49,7 @@ export default {
}
i {
margin-right: .5em;
margin-right: .5rem;
}
}
</style>

4
src/views/tabview/TabViewDemo.vue
View File

@ -140,12 +140,12 @@ export default {
}
span {
margin: 0 .5em;
margin: 0 .5rem;
}
}
.p-button {
margin-right: .25em;
margin-right: .25rem;
}
.p-tabview p {

2
src/views/tabview/TabViewDoc.vue
View File

@ -359,7 +359,7 @@ export default {
}
span {
margin: 0 .5em;
margin: 0 .5rem;
}
}
</CodeHighlight>

2
src/views/tree/TreeDemo.vue
View File

@ -69,6 +69,6 @@ export default {
<style scoped>
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/tree/TreeFilterDemo.vue
View File

@ -115,6 +115,6 @@ export default {
<style scoped>
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/tree/TreeLazyDemo.vue
View File

@ -161,6 +161,6 @@ export default {
<style scoped>
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/tree/TreeSelectionDemo.vue
View File

@ -119,6 +119,6 @@ export default {
<style scoped>
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/tree/TreeTemplatingDemo.vue
View File

@ -103,7 +103,7 @@ export default {
<style scoped lang="scss">
button {
margin-right: .5em;
margin-right: .5rem;
}
/deep/ .p-tree {

2
src/views/treetable/TreeTableDemo.vue
View File

@ -91,6 +91,6 @@ export default {
<style scoped>
button {
margin-right: .5em;
margin-right: .5rem;
}
</style>

2
src/views/treetable/TreeTableDoc.vue
View File

@ -1246,7 +1246,7 @@ export default {
.sm-visible {
display: inline;
margin-right: .5em;
margin-right: .5rem;
}
}
}

4
src/views/treetable/TreeTableResponsiveDemo.vue
View File

@ -78,7 +78,7 @@ export default {
.sm-visible {
display: inline;
margin-right: .5em;
margin-right: .5rem;
}
}
}
@ -122,7 +122,7 @@ export default {
.sm-visible {
display: inline;
margin-right: .5em;
margin-right: .5rem;
}
}
}

2
src/views/tristatecheckbox/TriStateCheckboxDemo.vue
View File

@ -44,6 +44,6 @@ export default {
label {
font-weight: bold;
margin-left: .5em;
margin-left: .5rem;
}
</style>