Difference between revisions of "Test layout"

From wiki
Jump to navigation Jump to search
(Blanked the page)
Tag: Blanking
 
(56 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{Test layout}}
 
  
<!--The following line of code hides the page title-->
 
{{DISPLAYTITLE:<span style="position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px);">{{FULLPAGENAME}}</span>}}
 
 
<br>
 
{{#css:
 
 
div.nav {
 
    margin: 0 0 15px 0;
 
    background-color: #000000;
 
    font-size:0;
 
}
 
div.nav ul {
 
    padding: 0;
 
    margin: 0;
 
    list-style: none;
 
    position: relative;
 
    }
 
div.nav ul li {
 
    display:inline-block;
 
    background-color: #000000;
 
    }
 
 
}
 
 
div.nav ul ul {
 
    display: none;
 
    position: absolute;
 
    top: 60px;
 
z-index:500;
 
border-left:2px solid white;
 
border-right:2px solid white;
 
border-bottom:2px solid white;
 
}
 
div.nav ul li:hover > ul {
 
    display:inherit;
 
}
 
div.nav ul ul li {
 
    width:230px;
 
    float:none;
 
    display:list-item;
 
    position: relative;
 
}
 
div.nav ul ul ul li {
 
    position: relative;
 
    top:-60px;
 
    left:230px;
 
}
 
div.nav ul ul li {
 
    border: 0px solid white;
 
}
 
li > a:after { content:  ' ▼'; }
 
li > a:only-child:after { content: ''; }
 
 
.banner img {
 
width:100%;
 
height:auto;
 
}
 
 
}}
 
 
<div class="banner">[[File:banner-test.svg|link=|class=banner]]</div>
 
 
<p style="text-align:center"></p>
 
 
<p style="text-align:center"></p>
 
 
<br>
 
<br>
 
 
 
<p style="text-align:center"><span style="color:#343742"><span style="font-size:24px"><strong><span style="font-family:Franklin Gothic, Demi Cond, sans-serif">INNOVATION FRAMEWORK</span></strong></span></span></p>
 
 
<p>&nbsp;</p>
 
 
<p><span style="font-size:16px"><span style="font-family:Georgia,serif">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non mollis augue. Quisque pretium et quam ultrices placerat. Vivamus nec cursus diam, id suscipit augue. Mauris a pretium nisi, at eleifend augue. Fusce tellus turpis, pharetra eget urna in, consequat mattis leo. Sed ut dolor eget metus tristique lobortis. Sed laoreet ante fermentum tincidunt pellentesque. Nunc libero sem, venenatis non sollicitudin sed, ultrices non neque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras sit amet dictum erat, non tincidunt magna.<p><p>
 
<br>
 
<p><span style="font-size:16px"><span style="font-family:Georgia,serif">Nulla facilisi. Praesent non arcu dignissim, mattis nisl at, posuere sem. Proin luctus eros a molestie consectetur. Maecenas a viverra neque. Nunc faucibus libero odio, quis lobortis nunc ornare ut. Vestibulum vitae porta tellus. Nam vel rhoncus mauris. Proin sed ex neque.
 
<br><br>
 
 
<p style="text-align:center"></p>
 
 
<p style="text-align:center">&nbsp;</p>
 
 
<p style="text-align:center">&nbsp;<span style="color:#343742"><span style="font-size:24px"><strong><span style="font-family:Franklin Gothic, Demi Cond, sans-serif">THEMES</span></strong></span></span></p>
 
 
<p style="text-align:center">&nbsp;</p>__NOTOC__{{#css:
 
 
body {
 
font-family: 'Nunito Sans', sans-serif;
 
            }
 
 
.res-img img {
 
        max-width:100%;
 
        height:auto;
 
            }
 
 
#topten {
 
        margin-top: 2.2em;
 
            }
 
 
.btn {
 
  display: inline-block;
 
  margin-bottom: 0;
 
  font-weight: 400;
 
  text-align: center;
 
  white-space: nowrap;
 
  vertical-align: middle;
 
  -ms-touch-action: manipulation;
 
  touch-action: manipulation;
 
  cursor: pointer;
 
  background-image: none;
 
  border: 1px solid transparent;
 
  padding: 6px 6px;
 
  font-size: 14px;
 
  line-height: 1.42857143;
 
  border-radius: 20px;
 
        width: auto; 
 
        height: auto;
 
        background-color: rgba(108,77,133,0.8);
 
        border: 1px solid rgb(108,77,133);
 
        transition: 1s ease;
 
            }
 
 
.btn a {
 
        color: rgb(255, 255, 255);
 
        text-decoration: none;
 
            }
 
 
.btn a.external {
 
        color: rgb(255, 255, 255);
 
        text-decoration: none;
 
            }
 
 
.btn a.external:visited {
 
color: rgb(255, 255, 255);
 
        text-decoration: none;
 
            }
 
 
.btn a.external:hover {
 
color: rgb(255,255,255);
 
        text-decoration: underline;
 
            }
 
 
.btn:hover {
 
  background-color: rgba(108,77,133,0.5);
 
        transition: 1s ease;
 
        text-decoration: underline;
 
            }
 
 
 
.start:hover {
 
  background-color: rgba(108,77,133,0.5);
 
        transition: 1s ease;
 
            }
 
 
.items a {
 
color: rgb(255,255,255);
 
        text-decoration: none;
 
white-space: nowrap;
 
            }
 
 
.items a:visited {
 
color: rgb(255,255,255);
 
        text-decoration: none;
 
            }
 
 
.items a:hover {
 
color: rgb(255,255,255);
 
        text-decoration: underline;
 
            }
 
 
.items a.external {
 
color: rgb(255,255,255);
 
        text-decoration: none;
 
            }
 
 
.items a.external:visited {
 
color: rgb(255,255,255);
 
        text-decoration: none;
 
            }
 
 
.items a.external:hover {
 
color: rgb(255,255,255);
 
        text-decoration: underline;
 
            }
 
 
.fadein img {
 
opacity:1;
 
        transition: 1s ease;
 
            }
 
 
.fadein img:hover {
 
opacity:0.5;
 
transition: 1s ease;
 
            }
 
 
.start-icon {
 
margin: 0px 5px 0px 5px;
 
            }
 
 
.alert {
 
border: 1px solid transparent;
 
            }
 
 
.alert-primary {
 
background-color: rgba(1, 204, 220, 0.16);
 
box-shadow: 0px 0px 2px #03fff5;
 
border-color: rgb(1, 204, 220);
 
border-style: solid;
 
border-left: 3px solid  #2f6aa5;
 
border-right: 3px solid  #2f6aa5;
 
border-bottom-right-radius: 6px;
 
border-top-right-radius: 6px;
 
border-bottom-left-radius: 6px;
 
border-top-left-radius: 6px;
 
padding: 3px 10px 3px 10px;
 
            }
 
 
.alert-primary:hover {
 
background-color: rgba(1, 204, 220, 0.3);
 
transition: 0.5s;
 
            }
 
 
.times
 
{
 
-webkit-animation: blink 2s 1 both;
 
        animation: blink 2s 1 both;
 
            }
 
 
@-webkit-keyframes blink {
 
  0%,
 
  50%,
 
  100% {
 
    opacity: 1;
 
  }
 
  25%,
 
  75% {
 
    opacity: 0;
 
  }
 
            }
 
@keyframes blink {
 
  0%,
 
  50%,
 
  100% {
 
    opacity: 1;
 
  }
 
  25%,
 
  75% {
 
    opacity: 0;
 
  }
 
            }
 
 
}}__NOTOC__
 
<!--SYSTEM NOTICE
 
<div class="alert alert-primary>
 
      <p><span class="start-icon times" role="presentation" aria-hidden="true"></span>
 
 
 
 
 
</div>-->
 
<div class="mainpage_row"><div class="mainpage_box"><center><div class="mainpage_row">
 
<div class="mainpage_box">
 
{| style="text-align: center;"
 
|- 
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme1.svg|link=https://wiki.gccollab.ca/Theme_1|alt=Theme 1|center|frameless]]
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme2.svg|alt=Theme 2|center|frameless]]
 
|-
 
|
 
|
 
|-
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme3.svg|alt=Theme 3|center|frameless]]
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme4.svg|alt=Theme 4|center|frameless]]
 
|-
 
|
 
|
 
|-
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme5_1.svg|alt=Theme 5|center|frameless]]
 
| class="res-img fadein" style="padding: 0px 10px" |[[File:Theme6.svg|alt=Theme 6|center|frameless]]
 
|}
 
<br>
 
<br>
 
<br>
 
<br>
 
<p style="text-align:center"><span style="color:#343742"><span style="font-size:18px"><strong><span style="font-family:Franklin Gothic, Demi Cond, sans-serif">Contact Us</span></strong></span></span>
 
<br>
 
 
|
 
|-
 
| class="res-img fadein" style="padding: 0px 0px" |[[File:Home_InnovationFramework.svg|link=https://wiki.gccollab.ca/Theme_1alt=home|right|frameless|50x50px]]
 
|-
 
|
 
<br>
 
<br>
 

Latest revision as of 09:23, 24 October 2023