@rero/rero-ils-ui
Version:
User interface for RERO integrated library system (RERO ILS).
21 lines (20 loc) • 8.28 kB
HTML
<html lang="fr" data-beasties-container>
<head>
<meta charset="utf-8">
<title>SearchBar</title>
<base href="/">
<style>
@layer bootstrap, theme, rero-ils-ui, primeng, utilities;
</style>
<style>@layer properties;@layer theme{:root{--ui-font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--ui-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--ui-color-red-200:var(--p-red-200);--ui-color-red-500:var(--p-red-500);--ui-color-orange-200:var(--p-orange-200);--ui-color-orange-600:var(--p-orange-600);--ui-color-yellow-500:var(--p-yellow-500);--ui-color-green-200:var(--p-green-200);--ui-color-green-500:var(--p-green-500);--ui-color-cyan-600:var(--p-cyan-600);--ui-color-blue-100:var(--p-blue-100);--ui-color-blue-200:var(--p-blue-200);--ui-color-blue-500:var(--p-blue-500);--ui-color-blue-600:var(--p-blue-600);--ui-color-blue-700:var(--p-blue-700);--ui-color-gray-500:var(--p-gray-500);--ui-color-gray-600:var(--p-gray-600);--ui-color-gray-900:var(--p-gray-900);--ui-color-white:#fff;--ui-spacing:.25rem;--ui-breakpoint-sm:40rem;--ui-breakpoint-xl:80rem;--ui-container-3xs:16rem;--ui-container-xs:20rem;--ui-text-xs:.75rem;--ui-text-xs--line-height:calc(1 / .75);--ui-text-sm:.875rem;--ui-text-sm--line-height:calc(1.25 / .875);--ui-text-base:1rem;--ui-text-base--line-height:1.5 ;--ui-text-lg:1.125rem;--ui-text-lg--line-height:calc(1.75 / 1.125);--ui-text-xl:1.25rem;--ui-text-xl--line-height:calc(1.75 / 1.25);--ui-text-2xl:1.5rem;--ui-text-2xl--line-height:calc(2 / 1.5);--ui-text-3xl:1.875rem;--ui-text-3xl--line-height:1.2 ;--ui-text-4xl:2.25rem;--ui-text-4xl--line-height:calc(2.5 / 2.25);--ui-text-5xl:3rem;--ui-text-5xl--line-height:1;--ui-text-7xl:4.5rem;--ui-text-7xl--line-height:1;--ui-text-8xl:6rem;--ui-text-8xl--line-height:1;--ui-font-weight-light:300;--ui-font-weight-medium:500;--ui-font-weight-bold:700;--ui-font-weight-extrabold:800;--ui-tracking-tight:-.025em;--ui-radius-md:.375rem;--ui-radius-lg:.5rem;--ui-animate-spin:spin 1s linear infinite;--ui-animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--ui-default-font-family:var(--ui-font-sans);--ui-default-mono-font-family:var(--ui-font-mono)}}@layer utilities{}@-webkit-keyframes blink{50%{background-color:transparent}}@layer properties;@layer theme{:root{--core-color-red-500:var(--p-red-500);--core-color-gray-400:var(--p-gray-400);--core-color-gray-500:var(--p-gray-500);--core-color-white:#fff;--core-spacing:.25rem;--core-text-sm:.875rem;--core-text-sm--line-height:calc(1.25 / .875);--core-text-2xl:1.5rem;--core-text-2xl--line-height:calc(2 / 1.5);--core-text-4xl:2.25rem;--core-text-4xl--line-height:calc(2.5 / 2.25);--core-font-weight-bold:700}}@layer utilities{}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))){*,:before,:after{--tw-border-style:solid;--tw-font-weight:initial}}}@layer rero-ils-ui{@layer base{.rero-ils-ui :after,.rero-ils-ui :before,.rero-ils-ui ::backdrop,.rero-ils-ui ::file-selector-button{box-sizing:border-box;margin:0;padding:0;border:0 solid}.rero-ils-ui :host{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:var(--ui-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--ui-default-font-feature-settings, normal);font-variation-settings:var(--ui-default-font-variation-settings, normal);-webkit-tap-highlight-color:transparent}.rero-ils-ui :-moz-focusring{outline:auto}.rero-ils-ui ::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;border-radius:0;background-color:transparent;opacity:1}.rero-ils-ui ::file-selector-button{margin-inline-end:4px}.rero-ils-ui ::placeholder{opacity:1}@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){.rero-ils-ui ::placeholder{color:currentcolor}}.rero-ils-ui ::-webkit-search-decoration{-webkit-appearance:none}.rero-ils-ui ::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}.rero-ils-ui ::-webkit-datetime-edit{display:inline-flex}.rero-ils-ui ::-webkit-datetime-edit-fields-wrapper{padding:0}.rero-ils-ui ::-webkit-datetime-edit,.rero-ils-ui ::-webkit-datetime-edit-year-field,.rero-ils-ui ::-webkit-datetime-edit-month-field,.rero-ils-ui ::-webkit-datetime-edit-day-field,.rero-ils-ui ::-webkit-datetime-edit-hour-field,.rero-ils-ui ::-webkit-datetime-edit-minute-field,.rero-ils-ui ::-webkit-datetime-edit-second-field,.rero-ils-ui ::-webkit-datetime-edit-millisecond-field,.rero-ils-ui ::-webkit-datetime-edit-meridiem-field{padding-block:0}.rero-ils-ui ::-webkit-calendar-picker-indicator{line-height:1}.rero-ils-ui :-moz-ui-invalid{box-shadow:none}.rero-ils-ui ::file-selector-button{appearance:button}.rero-ils-ui ::-webkit-inner-spin-button,.rero-ils-ui ::-webkit-outer-spin-button{height:auto}}.rero-ils-ui :root{--callout-color-info:37, 99, 235;--callout-color-success:34, 197, 94;--callout-color-warning:234, 179, 8;--callout-color-danger:255, 61, 50}}@property --tw-border-spacing-x{syntax:"<length>";inherits:false;initial-value:0;}@property --tw-border-spacing-y{syntax:"<length>";inherits:false;initial-value:0;}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid;}@property --tw-font-weight{syntax:"*";inherits:false;}@property --tw-tracking{syntax:"*";inherits:false;}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}@property --tw-shadow-color{syntax:"*";inherits:false;}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%;}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}@property --tw-inset-shadow-color{syntax:"*";inherits:false;}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%;}@property --tw-ring-color{syntax:"*";inherits:false;}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}@property --tw-inset-ring-color{syntax:"*";inherits:false;}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}@property --tw-ring-inset{syntax:"*";inherits:false;}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0px;}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff;}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid}}}</style><link rel="stylesheet" href="styles-ESBDNWHO.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles-ESBDNWHO.css"></noscript></head>
<body>
<div class="container">
<h4>Search bar</h4>
<div style="margin-bottom: 10px; width: 600px">
<main-search-bar styleclass="ui:w-full" inputstyleclass="ui:text-lg ui:w-full" placeholder="Search (Aoste view)" viewcode="aoste" language="fr" class="rero-ils-ui"></main-search-bar>
</div>
<main-search-bar styleclass="ui:w-full" inputstyleclass="ui:text-lg ui:w-full" placeholder="Search (Admin view)" language="fr" class="rero-ils-ui" internal></main-search-bar>
</div>
<link rel="modulepreload" href="chunk-V6CBOCDD.js"><script src="polyfills-BUUDEW7V.js" type="module"></script><script src="main-VIPBXTW2.js" type="module"></script></body>
</html>