Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Div
idwho-hub-for
classsection
Div
classcontainer
Div
classcols
Div

Who's the HUB for?

Div
classcols gap-lg align-items-center
Div
classcol-4

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

Html-bobswift
<h3 class="h4">National coordination groups</h3> 
<p>Responsible for the <strong>implementation of OOTS</strong> in their member state.</p>
Div
classcol-4 col-separator-before col-separator-after

HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-competent-authorities.png
altillustration of a checklist
height80px

Html-bobswift
<h3 class="h4">Competent authorities</h3> 
<p>The authorities which must <strong>allow their users to retrieve requested evidence</strong> using OOTS.</p>
Div
classcol-4

HTML Image
srchttps://ec.europa.eu/digital-building-blocks/sites/download/attachments/565379323/illu-solution-providers.png
altillustration of a light bulb
height80px

Html-bobswift
<h3 class="h4">Solution providers</h3> 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</p>
Div
idtechnical-documentation
classsection
Div
classcontainer
Div
classcols
Div
classcol-8

Technical documentation

The technical and operational specifications of the Once Only Technical System (OOTS), laid down in the Commission’s Implementing Regulation setting out the system, are complemented by detailed, non-binding technical design documents (TDDs) resulting from the common efforts of the Commission and Member States.

Div
classcols
Div
classcol-4
Html-bobswift
<div class="card-grid">
<div class="card-grid-body">
<p><small class="text-secondary">Chapter 1</small></p>
<h3 class="h5">Introduction - High Level Architecture</h3>
<p>This chapter provides a high-level overview of the architecture of the Once-Only Technical System (OOTS) of the Single Digital Gateway (SDG) and serves as an introduction to all technical design documents.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><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 class="text-secondary">Chapter 2</small></p>
<h3 class="h5">User Identification, Authentication and Record Matching</h3>
<p>This chapter deepdives into the use and purpose of the eID Building Block and eIDAS attributes in the Once-Only Technical System to support user identification and authentication.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><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 class="text-secondary">Chapter 3</small></p>
<h3 class="h5">Common services</h3>
<p>This chapter provides the information model and technical documentation of the identified Common Services, which are the Data Service Directory, the Evidence Broker and the Semantic Repository.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><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 class="text-secondary">Chapter 4</small></p>
<h3 class="h5">Evidence Exchange</h3>
<p>This chapter describes correlated messages and how the Once-Only Technical System (OOTS) specifications define in detail the structure, content and message exchange parameters.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><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 class="text-secondary">Chapter 5</small></p>
<h3 class="h5">Data Models</h3>
<p>This chapter has coveres the semantic interoperability issues in designing the single technical system for the SDG and ensuring its interconnection with EU Member States' IT systems and EU-level systems.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><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 class="text-secondary">Chapter 6</small></p>
<h3 class="h5">OOTS Guidance & UX Recommendations</h3>
<p>This chapter provides a high-level overview of how the Once-Only Technical System (OOTS) of the Single Digital Gateway (SDG) works as well as detailed UX recommendations.</p>
</div>
<div class="card-grid-footer">
<p><a class="btn primary" href="#"><span>View chapter</span><span class="ico-cta"></span></a></p>
</div>
</div>
Div
classcols text-right
Div
Html-bobswift
<p><a class="btn ghost" href="#"><span>View all latest chapter releases</span><span class="ico-cta"></span></a></p>

...

CSS Stylesheet
/*---INTRODUCTION---*/
#introduction { padding-bottom: 15rem;
 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;
}

/*---WHO HUB FOR---*/
#who-hub-for { margin-top:-12rem; padding-top: 0;}
#who-hub-for .col-4 p:nth-child(3) { margin-bottom:0;}

/**/
#technical-documentation {}

/*---SERVICES---*/
#services { background: #00284A;}
#services h2, #services h3, #services p { color: white;}
#services .opacity-75 { opacity: 0.75;}
#services .opacity-50 { opacity: 0.50;}
#services .badge { color: #995E00; background: #FFEECC;}

/*HACK remove empty p from Confluence*/
#services .col-4 > p:first-child { border:1px solid green; display: none;}
#services .card-grid { padding: 0; background: transparent;}
#services .card-grid-body p:last-child { margin-bottom:0;}

@media screen and (min-width: 769px) {
 .col-separator-before, .col-separator-after { position:relative; }
.col-separator-before:before, .col-separator-after:after { content:''; position:absolute; top:0; height:100%; border-left:1px solid #CBCEFD;}
.col-separator-before:before { left:-0.25rem;}
.col-separator-after:after { right:-0.25rem;}
}