Changes

2,086 bytes added ,  17:35, 5 October 2021
add columns
Line 1: Line 1:  
{{#css:
 
{{#css:
 +
.row{
 +
display:flex;
 +
        flex-wrap: wrap;
 +
        margin-right: -15px;
 +
        margin-left: -15px;
 +
        max-width: 100%;
 +
}
 +
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
 +
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
 +
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
 +
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
 +
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
 +
.col-xl-auto {
 +
  position: relative;
 +
  width: 100%;
 +
  min-height: 1px;
 +
  padding-right: 15px;
 +
  padding-left: 15px;
 +
}
 +
@media (max-width: 576px) {
 +
  .col-sm-12 {
 +
    flex: 0 0 100%;
 +
    max-width: 100%; }
 +
  .primary-btn{
 +
    display:none;
 +
  }
 +
}
 +
@media screen and (min-width: 576px) {
 +
  .col-md-6 {
 +
    flex: 0 0 450%;
 +
    max-width: 45%;
 +
  }
 +
  .col-md-4 {
 +
    flex: 0 0 30%;
 +
    max-width: 30%; }
 +
}
 +
@media screen and (min-width: 992px) {
 +
  .col-lg {
 +
    flex-basis: 0;
 +
    flex-grow: 1;
 +
    max-width: 100%; }
 +
  .col-lg-4 {
 +
    flex: 0 0 30%;
 +
    max-width: 30%; }
 +
  .col-lg-2{
 +
    flex: 0 0 15%;
 +
    max-width: 15%;
 +
  }
 +
}
 
.secondary{
 
.secondary{
 
   list-style-type:circle !important;
 
   list-style-type:circle !important;
Line 44: Line 93:  
.navMenu .active a, .primary-btn a{
 
.navMenu .active a, .primary-btn a{
 
   color: white;
 
   color: white;
}
  −
@media (max-width: 576px) {
  −
  .col-sm-12 {
  −
    flex: 0 0 100%;
  −
    max-width: 100%; }
  −
  .primary-btn{
  −
    display:none;
  −
  }
   
}
 
}
 
.primary-btn{
 
.primary-btn{
Line 155: Line 196:  
<p>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.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. </p>
 
<p>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.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. </p>
 
<h4>Compensation & Benefits</h4>  
 
<h4>Compensation & Benefits</h4>  
 +
<div class="row">
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 
<h5>Collective Agreements</h5>  
 
<h5>Collective Agreements</h5>  
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
 +
<h5>Pensions</h5>
 +
<ul>
 +
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 +
</ul>
 +
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 
<h5>Pay</h5>  
 
<h5>Pay</h5>  
 
<ul>
 
<ul>
Line 166: Line 215:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
 +
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 
<h5>Benefits</h5>  
 
<h5>Benefits</h5>  
 
<ul>
 
<ul>
Line 174: Line 225:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
 +
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 
<h5>Leave and Vacation</h5>  
 
<h5>Leave and Vacation</h5>  
 
<ul>
 
<ul>
Line 179: Line 232:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
<h5>Pensions</h5>  
+
</div>
<ul>
+
<div class="col-sm-12 col-md-4 col-lg-2">
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
  −
</ul>
   
<h4> Other Resources</h4>  
 
<h4> Other Resources</h4>  
 
<ul>
 
<ul>
Line 189: Line 240:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
 +
</div>
 +
</div>
 
<h4>Download the MyESDC mobile app</h4>  
 
<h4>Download the MyESDC mobile app</h4>  
 
<p>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.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. </p>
 
<p>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.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. </p>
Line 197: Line 250:  
<h3><span class="checkbox"></span>Explore (and join!) our networks and communities</h3>
 
<h3><span class="checkbox"></span>Explore (and join!) our networks and communities</h3>
 
<p>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.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. </p>
 
<p>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.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. </p>
 +
<div class="row">
 +
<div class="col-sm-12 col-md-4">
 
<h4>National Networks</h4>  
 
<h4>National Networks</h4>  
 
<ul>
 
<ul>
Line 210: Line 265:  
<li>Lorem ipsum dolor sit amet, consectetur</li>  
 
<li>Lorem ipsum dolor sit amet, consectetur</li>  
 
</ul>
 
</ul>
 +
</div>
 +
<div class="col-sm-12 col-md-4">
 
<h4>Regional Networks</h4>  
 
<h4>Regional Networks</h4>  
 
<ul>
 
<ul>
Line 216: Line 273:  
<li>Lorem ipsum dolor sit amet, consectetur</li>  
 
<li>Lorem ipsum dolor sit amet, consectetur</li>  
 
</ul>
 
</ul>
 +
</div>
 +
</div>
 
</div>
 
</div>
   Line 229: Line 288:  
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<h4>Twitter</h4>
+
<div class="row">
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 +
<p><strong>Twitter</strong></p>
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
Line 236: Line 297:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
<h4>Facebook</h4>
+
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 +
<p><strong>Facebook</strong></p>
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
Line 243: Line 306:  
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
<h4>YouTube</h4>
+
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 +
<p><strong>YouTube</strong></p>
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
<h4>LinkedIn</h4>
+
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 +
<p><strong>LinkedIn</strong></p>
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
<h4>Instagram</h4>
+
</div>
 +
<div class="col-sm-12 col-md-4 col-lg-2">
 +
<p><strong>Instagram</strong></p>
 
<ul>
 
<ul>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
<li>[https://www.canada.ca/en/employment-social-development.html '''ESDC''']</li>
 
</ul>
 
</ul>
 +
</div>
 +
</div>
 
</div>
 
</div>
 
</div>
 
</div>
    
[[fr:Accueil_et_intégration_EDSC]]
 
[[fr:Accueil_et_intégration_EDSC]]
233

edits