Versions Compared

Old Version 295

changes.mady.by.user Virginie MANGELINCK

Saved on

compared with

New Version 296

changes.mady.by.user Virginie MANGELINCK

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Div
idintroduction
classsection
Div
classcontainer
Div
classcols align-items-center
Div
classcol-7
Html-bobswift
<h1><span class="d-block text-primary">The Once Only Hub.</span>Building the European data-<span class="d-block not-d-block-mobile">space.</span></h1>
<p class="lead">The Once-Only Technical System will connect EU public authorities, so they can exchange official documents and data at the citizen’s request. It puts into practice the Once-Only Principle, which states that citizens should not be forced to provide information to authorities if another authority already holds that information in electronic format.</p>
Div
classcol-4
HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-introduction.svg
altillustration Once Only Technical System (OOTS), a laptop shows secure documents
classimg-fluid img-mobile
Div
idwho-hub-for
classsection
Div
classcontainer
Div
classcols align-items-center
Div
classcol-4 text-center remove-on-mobile

HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-national-coordination-groups.png
altillustration of a writing hand

Html-bobswift
<div class="col-8">

<h2>Who is the Once-Only Hub for?</h2>
<div class="who-hub-for-container">
<p><strong>Implementers from EU Member States</strong>, building and maintaining the Once-Only Technical System. A single environment providing them with information and access to services.</p>
<p><strong>Anyone</strong> can browse the Hub to learn more about the system, program and the benefits for them. </p>
</div>

</div>
Div
idarchitectural-design
classsection
Html-bobswift
<div class="container">

<div class="cols">
<div class="col-9">
<h2>Architectural design of the Once-Only Technical System</h2>
<p class="lead">The Once-Only Technical System (OOTS) is a technical framework for data sharing. Citizens and businesses will be able to request official documents (known as “evidence”) to complete administrative procedures allowing people to study, work, live and retire in other EU countries. The decentralised architecture connects public authorities, so they can exchange evidences (official documents) at the citizen's request.</p>
<p class="lead">The citizen or business is identified and, having actively confirmed that they wish to use the Once-Only Technical System, is shown a list of the types of document that are possible to be retrieved directly from data sources abroad. The citizen will then select which documents they wish to retrieve from the data sources.</p>
</div>
</div>

<div class="cols">
<div><p class="text-right"><a class="btn ghost" href="#"><span>Download the OOTS Guidance Report</span><span class="ico-download"></span></a></p></div>
</div>

<div class="cols">
<div><img class="img-fluid" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/diagram-how-does-it-work.png" alt=""></div>
</div>

<div class="cols">
<div class="col-9">
<p class="lead">In technical terms, the exchange is done using the popular digital building block for secure data exchanged called eDelivery. eDelivery is a package of technical specifications based on open standards installable software and ancillary services to allow Member States to create a network of nodes for secure digital data exchange.</p> 
<p class="lead">The authentication mechanism of citizens and businesses is done using the eIDAS eID building block.</p>
<p class="lead">Finally, the European Commission provides several Common Services as part of the Once-Only Technical Architecture.</p>
</div>
</div>  

</div>
Div
idtechnical-documentation
classsection
Div
classcontainer
Div
classcols
Div
classcol-9

Documentation

Html-bobswift
<p class="lead">The technical and operational specifications of the Once-Only Technical System, laid down in the Commission’s Implementing Regulation ((EU) 2022/1463) setting out the system, are complemented by detailed, non-binding technical design documents jointly prepared by the Commission and Member States.</p>
Div
stylemargin-top:-3rem;
classcols
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 1</small></p>
<h3 class="h5">Introduction - High Level Architecture</h3>
<p>This chapter introduces the high-level architecture of the Once-Only Technical System and the key concepts and themes found in the subsequent chapters.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p>
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/WoUvHQ"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 2</small></p>
<h3 class="h5">User Identification, Authentication and Record Matching</h3>
<p>This chapter explains how those submitting or receiving evidences through the Once-Only Technical System are identified and authenticated.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p> 
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/mYUvHQ"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 3</small></p>
<h3 class="h5">Common Services</h3>
<p>This chapter looks at the Common Services (provided by the Commission) necessary for the proper execution of the evidence exchange process.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p> 
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/vYUvHQ"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcols
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 4</small></p>
<h3 class="h5">Evidence Exchange</h3>
<p>This chapter introduces evidence exchange in the Once-Only Technical System, which is based on bilateral data exchange between relevant authorities.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p>
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/4IUvHQ"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 5</small></p>
<h3 class="h5">Data Models</h3>
<p>This chapter looks at the data models that streamline the exchange of evidences, together with a methodology for defining new data models and code lists.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p> 
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/T4YvHQ"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small>Chapter 6</small></p>
<h3 class="h5">OOTS Guidance & UX Recommendations</h3>
<p>This chapter provides an overview of how the Once-Only Technical System works as part of the wider Single Digital Gateway and looks at the first set of UX recommendations.</p>
</div>
<div class="card-grid-footer">
<p>Release date: <strong>October 2022</strong></p> 
<p><a class="btn primary" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/P4CYI"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Html-bobswift
<div class="cols text-right">

<div>
<p class="technical-documentation-cta"><a class="btn ghost" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/PQF1Fg"><span>View all latest chapter releases</span><span class="ico-cta"></span></a></p>
</div>

</div>
Div
idservices
classsection
Div
classcontainer
Div
classcols
Html-bobswift
<div class="col-9">
<h2>Common services</h2>
<p class="lead opacity-75">The Commission provides the following Common Services to allow for the proper exchange of evidences.</p>
</div>
Div
classcols gap-lg
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body"> 
<p><img aria-hidden="true" alt="" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/ico-article-secondary.svg"></p> 
<h3 class="h5">Data Service Directory (DSD)</h3>
<p class="opacity-75">The Data Service Directory is a common service that acts as a catalogue of evidence types that can be provided upon request.</p>
</div>
<div class="card-grid-footer">
<p><span class="badge sm">In development</span></p>
<p class="opacity-50">Expected release date: <strong>December 2022</strong></p>
</div>
</div>
Div
classcol-4 col-separator-before col-separator-after
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><img aria-hidden="true" alt="" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/ico-assured-workload-secondary.svg"></p>
<h3 class="h5">Evidence Broker (EB)</h3>
<p class="opacity-75">The Evidence Broker is an authoritative system that maps specific data sets as evidence types that prove specific requirements.  </p>
</div>
<div class="card-grid-footer"> 
<p><span class="badge sm">In development</span></p> 
<p class="opacity-50">Expected release date: <strong>December 2022</strong></p>
</div>
</div>
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><img aria-hidden="true" alt="" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/ico-dns-secondary.svg"></p>
<h3 class="h5">Semantic Repository (SR)</h3>
<p class="opacity-75">The Semantic Repository is a common service that acts as a data portal for the technical system.</p>
</div>
<div class="card-grid-footer"> 
<p><span class="badge sm">In development</span></p> 
<p class="opacity-50">Expected release date: <strong>December 2022</strong></p>
</div>
</div>
Div
idsupporting-services
classsection
Div
classcontainer
Div
classcols
Div
classcol-8
Html-bobswift
<h2>Supporting services</h2>
<p><img aria-hidden="true" alt="" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/ico-quiz-primary.svg"></p>
<h3 class="h5">Testing service</h3>

<div class="supporting-services-container">
<p>The goal of the OOTS Testing services is to assist Member State teams in implementing the Once-Only Technical System (OOTS) as defined in the Implementing Regulation (IR) and Technical Design Documents (TDDs). Information on the available testing services, including the test platform and tools to facilitate testing can be found on the following protected wiki space.</p> 
<p><a class="btn ghost" target="_blank" href="https://ec.europa.eu/digital-building-blocks/sites/x/kwPTI"><span>Go to wiki</span><span class="ico-cta"></span></a></p>
</div>

<hr>

<div class="supporting-services-container">
<p>Access a test platform and tools through our secure testing service</p>
<p><a class="btn ghost" target="_blank" href="#"><span>Go to testing service</span><span class="ico-external"></span></a></p>
</div>

<div class="supporting-services-container">
<p>Request access via your National Coordinator or the Support Desk directly via <a href="mailto:EC-OOTS-SUPPORT@ec.europa.eu" target="_blank">EC-OOTS-SUPPORT@ec.europa.eu</a></p>
<p><a class="btn ghost" target="_blank" href="mailto:EC-OOTS-SUPPORT@ec.europa.eu"><span>Contact via email</span><span class="ico-email"></span></a></p>
</div>
Div
idlatest-news
classsection
Div
classcontainer
Html-bobswift
<div class="container">
<div class="cols">

<div class="col-7">
<h2>Latest news</h2>
</div>

<div class="col-5 text-right">
<p><a class="link-cta after text-primary" href="https://ec.europa.eu/digital-building-blocks/sites/x/iAJTIw"><span>Go to news room</span></a></p>
</div>

</div>
</div>

News Teaser
filterStartDate
newsTextshort_excerpt
colorwhite
showCreatedDatefalse
columns3
showStatsfalse
linktrue
showDatetrue
showErrorfalse
maxResults3
promotedLabel
contentTypepage, blogpost
imageLabelsooh-news-highlight
showCreatorfalse
filterByDatefalse
openLinksInNewWindowfalse
spacesSelectedOOTS
showSpacefalse
showAuthorfalse
labelColor#0049B0
timeFrame
filterEndDate
labelsooh, news, event
layoutcards
sortOrderlastmodified desc
promotedFirsttrue
cql

Div
idcollaborate-with-us
classsection
Html-bobswift
<div class="container"> 

<h2>Collaborate with us</h2>

<div class="cols gap-lg">

<div class="col-4">
<h3 class="h5">As part of the SDG coordination group</h3>
<p class="opacity-75">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p><a class="btn primary-negative" href="#"><span>Visit our space</span><span class="ico-cta"></span></a></p>
</div>

<div class="col-4 col-separator-before">
<h3 class="h5">As an expert in our subgroups</h3>
<p class="opacity-75">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p><a class="btn primary-negative" href="#"><span>Visit our space</span><span class="ico-cta"></span></a></p>
</div>

</div>

</div>
Div
idservice-desk
classsection
Div
classcontainer
Div
classcols justify-content-center align-items-center
Div
classcol-4 text-center

HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-service-desk.png
altillustration customer service desk, a phone with message
classimg-fluid img-mobile

Html-bobswift
<div class="col-5">
<h2>Service desk</h2>
<p class="lead">This Service Desk provides helps users improve the performance, continuity and reliability of their Once-Only Technical system implementations.</p>
<p class="service-desk-cta"><a class="btn ghost" target="_blank" href="https://ec.europa.eu/digital-building-blocks/tracker/plugins/servlet/desk/portal/15"><span>Contact the service desk</span><span class="ico-question"></span></a></p>
</div>
CSS Stylesheet
/*---------------------------------*/
/*---OOH HOME PAGE - 05-10-2022---*/
/*-------------------------------*/

@media screen and (max-width: 769px) {
  .img-mobile { width: 180px;}
  .remove-on-mobile { display:none !important;}
}  

@media screen and (max-width: 1200px) {
  .not-d-block-mobile  { display:inline !important;}
} 

/*---INTRODUCTION---*/
#introduction { padding-bottom: 26rem;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/bg-illu-sigle-home-introduction.svg");
background-position: bottom right;
background-repeat: no-repeat;
background-size: cover;
}

#introduction h1 { margin-bottom:2.5rem;}

/*---WHO HUB FOR---*/
#who-hub-for { margin-top:-23rem; padding-top: 0;}
#who-hub-for img { height: 120px;}

@media screen and (min-width: 769px) {
  .who-hub-for-container { display: flex; justify-content: space-between;}
  .who-hub-for-container p { width: 45%;}
}    

/*---ARCHITECTURAL DESIGN---*/
#architectural-design { background: #F3F4F7;}
#architectural-design .cols:last-child p:last-child { margin-bottom:0;} 
/*hack - remove empty p from confluence*/
#architectural-design > p:first-child, #architectural-design > p:last-child { display: none; border:1px solid red;}  

/*---TECHNICAL DOCUMENTATION---*/
#technical-documentation { background: white;} 
#technical-documentation .container > p:last-child { display:none; border:1px solid red;}
#technical-documentation .card-grid small { color: #5D24A4;}
#technical-documentation .card-grid-footer { text-align: right;}
#technical-documentation .card-grid-footer p:first-child { margin-bottom:1.5rem;}
.technical-documentation-cta { margin-top:2.5rem !important; margin-bottom:0 !important;}

@media screen and (min-width: 769px) {
  #technical-documentation .card-grid-body p:last-child { margin-bottom: 0;}
}

/*---SERVICES---*/
#services { background: #00284A;}
#services h2, #services h3, #services p { color: white;}
#services .card-grid { padding: 0; background: transparent;}
#services .col-separator-before:before, 
#services .col-separator-after:after { border-left:1px solid rgba(255, 255, 255, 0.12);}  
#services .opacity-75 { opacity: 0.75;}
#services .opacity-50 { opacity: 0.50;}
#services .badge { margin-bottom:0.5rem; color: #995E00; background: #FFEECC;}
/*HACK remove empty p from Confluence*/
#services .col-4 > p:first-child { border:1px solid green; display: none;}

@media screen and (min-width: 769px) {
  #services { padding-bottom:6rem;}
  #services .card-grid-body p:last-child { margin-bottom:0;}
}    

/*---SUPPORTING SERVICES---*/
#supporting-services { padding-bottom:11.25rem; background: #F3F4F7;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/bg-illu-sigle-supporting-services.svg");
background-position: bottom right;
background-repeat: no-repeat;
background-size: cover;
}
#supporting-services .cols:last-child { margin-top:-3rem;}
#supporting-services h2 { margin-bottom:2.5rem;}
#supporting-services hr { margin:2rem 0 3rem 0; border:none; border-top:1px solid #E3E6EB; height: 1px;}

@media screen and (min-width: 769px) {
  .supporting-services-container { display: flex; justify-content: space-between;}
  .supporting-services-container p:first-child { width: 70%;}
  .supporting-services-container p:last-child { width: 30%; text-align: right;}
  .supporting-services-container .btn { margin-left:1rem;}
}     

/*---LATEST NEWS---*/
#latest-news .news-teaser-root > div > div > div {display: inline-block; margin-top:1rem; background: #FFFFFF; border-radius: 12px; box-shadow: 0px 2px 12px rgba(0, 24, 50, 0.12);}
#latest-news .news-teaser-root a img {  border-radius:0% 100% 0% 100% / 24% 0% 100% 76%; border-top-left-radius: 12px; border-top-right-radius: 12px;}
#latest-news .news-teaser-root > div > div > div > div > div > div:last-child { padding:0 2rem 0.25rem 2rem;}
#latest-news .news-teaser-root a h2 {font-size: 1.2rem; line-height: 1.4; text-transform: initial; text-decoration:none;}
#latest-news .news-teaser-root a, #latest-news .news-teaser-root a:link { display: inline-block; margin-bottom:0; color: #001832; text-decoration: none;}
#latest-news .news-teaser-root a:hover { text-decoration: underline;}
#latest-news .news-teaser-root .aui-group span { font-size: initial; color: #001832; }
#latest-news .news-teaser-root > div > div:last-child button { color: #001832 !important; background-color: transparent; border: 1px solid #B7C2CF; border-radius: 6px;}
#latest-news .news-teaser-root > div > div:last-child button:hover { text-decoration: underline;}

@media screen and (max-width: 768px) {
#latest-news .news-teaser-root > div > div > div  { position:relative !important; width: auto !important; left: auto !important; top: auto !important;}
#latest-news .news-teaser-root .aui-group { min-height: auto !important;}
}

/*hack - remove empty p from confluence*/
#latest-news .container > p:first-child, #latest-news .container > p:last-child { display:none; border:1px solid red;}

/*---COLLABORATE WITH US---*/
#collaborate-with-us { position:relative; z-index: 5; margin-bottom: -16rem; padding-top: 0; padding-bottom: 0; background: linear-gradient(to right, #00284A 0%, #00284A 50%, transparent 50%, transparent 100%);}
#collaborate-with-us .container { padding: 6rem 3rem 6rem 0; background-color: #00284A; border-top-right-radius: 60px; border-bottom-right-radius: 60px;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-launch-rocket.png");
background-position:  90% bottom;
background-repeat: no-repeat;
}
#collaborate-with-us h2 { margin-bottom:2.5rem;}
#collaborate-with-us .col-separator-before:before, 
#collaborate-with-us .col-separator-after:after { border-left:1px solid rgba(255, 255, 255, 0.12);}  
#collaborate-with-us .opacity-75 { opacity: 0.75;}
#collaborate-with-us h2, #collaborate-with-us h3, #collaborate-with-us p { color: white;}

/*hack - remove empty p from confluence*/
#collaborate-with-us > p:first-child,  #collaborate-with-us > p:last-child { display:none; border:1px solid red;}

/*---SERVICE DESK---*/
#service-desk { position:relative; z-index: 4; padding-top: 21rem;
background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/bg-illu-sigle-service-desk.svg");
background-position: top right;
background-repeat: no-repeat;
background-size: cover;} 
#service-desk .service-desk-cta { margin-top: 2.5rem; margin-bottom:0;}