Changes for page Collaborate on reproducible science, anywhere
Summary
-
Page properties (2 modified, 0 added, 0 removed)
-
Objects (1 modified, 1 added, 0 removed)
Details
- Page properties
-
- Author
-
... ... @@ -1,1 +1,1 @@ 1 -XWiki. hbpadmin1 +XWiki.bougault - Content
-
... ... @@ -2,11 +2,124 @@ 2 2 #set($displayContentFooter=false) 3 3 #set($displayDocExtra=false) 4 4 #set($displayContentMenu=false) 5 -{{/velocity}} 6 6 6 +#content() 7 +#end 8 + 9 + 7 7 {{html clean="false"}} 8 -<div class="container clb-content"> 11 + <div class="container"> 12 + <div class="row"> 13 + <div class="col-md-7 col-md-push-5"> 14 + <img class="img-responsive" src="/bin/skin/Collaboratory/UX/HbpSkin/wiki_home_graphic.svg" /> 15 + </div> 16 + <div class="col-md-5 col-md-pull-7 hero-text"> 17 + <h3>Collaborate.<br/>Create reproducible science.<br/>Discover EBRAINS services at work.<br/>From anywhere.</h3> 18 + <a class="btn btn-primary btn-lg" href="/bin/view/Collabs/the-collaboratory/Getting%20Started/">Getting started</a> 19 + </div> 20 + </div> 21 + </div> 22 + <div class="container-fluid search__row"> 23 + <div class="container"> 24 + <div class="col-md-6 col-md-offset-3"> 25 + <form role="search" class="clb-search-bar" action="/bin/view/Main/Search" method="GET"> 26 + <div> 27 + <input type="text" class="form-control" name="text" placeholder="Search in the collaboratory"> 28 + <i class="glyphicon glyphicon-search"></i> 29 + </div> 30 + <button class="btn clb-btn-default" type="submit">Search</button> 31 + </form> 32 + </div> 33 + </div> 34 + </div> 9 9 36 + <div class="container highlighted"> 37 + <h4 class="highlighted__title">Highlighted collabs</h4> 38 + <div class="row highlighted_row"> 39 + <div class="col-sm-6 col-md-6 col-md-push-3"> 40 + <div class="thumbnail"> 41 + <img class="img-responsive" src="/bin/skin/Collaboratory/UX/HbpSkin/wiki_home_graphic.svg" /> 42 + <div class="caption"> 43 + <h3><a href="/bin/view/Collabs/the-collaboratory/" class="stretched-link">The Collaboratory</a></h3> 44 + <p>The EBRAINS Collaboratory opens a portal onto the full gamut of EBRAINS services, providing you with examples of how to access services and resources, and a means of applying this quickly with little effort to you research. </p> 45 + </div> 46 + </div> 47 + </div> 48 + </div> 49 + </div> 50 + 51 + {{collaboratory.ux.highlightedcollabs slider="false"/}} 52 + 53 + <div class="container"> 54 + <div class="row explore-all"> 55 + <div class="col-md-12"> 56 + Explore all the <a href="/bin/view/Collabs">Collabs</a> 57 + </div> 58 + </div> 59 + </div> 60 + 61 + 62 +<!-- 63 + <div class="container get-started"> 64 + <h4 class="get-started__title">Get started</h4> 65 + <div class="row get-started__row"> 66 + <div class="col-xs-12 col-md-6"> 67 + <img class="img-responsive" 68 + src="https://via.placeholder.com/600x300"/> 69 + </div> 70 + <div class="col-xs-12 col-md-6"> 71 + <a href="#"> 72 + <h2 class="get-started__row__title">Create a collab</h2> 73 + <p class="get-started__row__text"> 74 + Discover how to create Collabs, a space which enables you to 75 + collaborate. 76 + </p> 77 + </a> 78 + </div> 79 + </div> 80 + <div class="row get-started__row"> 81 + <div class="col-md-6"> 82 + <img 83 + class="img-responsive" 84 + src="https://via.placeholder.com/600x300" 85 + /> 86 + </div> 87 + <div class="col-md-6"> 88 + <a href="#"> 89 + <h2 class="get-started__row__title">Team</h2> 90 + <p class="get-started__row__text"> 91 + Add members to your team in the collab. 92 + </p> 93 + </a> 94 + </div> 95 + </div> 96 + <div class="row get-started__row"> 97 + <div class="col-md-6"> 98 + <img 99 + class="img-responsive" 100 + src="https://via.placeholder.com/600x300" 101 + /> 102 + </div> 103 + <div class="col-md-6"> 104 + <a href="#"> 105 + <h2 class="get-started__row__title">Jupyter Notebook</h2> 106 + <p class="get-started__row__text"> 107 + Run your Jupyter notebook. Share it with colleagues. 108 + </p> 109 + </a> 110 + </div> 111 + </div> 112 +</div> --> 113 +<div class="container"> 114 + <div class="row pre-footer"> 115 + <div class="col-md-12"> 116 + Discover all the 117 + <a href="https://ebrains.eu" rel="noopener" target="_blank">EBRAINS services</a>. 118 + </div> 119 + </div> 120 +</div> 121 +<!--div class="container clb-content"> 122 + 10 10 <div class="teasing"> 11 11 <div class="row"> 12 12 <div class="col-md-3"> ... ... @@ -90,7 +90,7 @@ 90 90 </a> 91 91 </div> 92 92 </div> 93 - </div> <!-- /.col-md-4 -->206 + </div> 94 94 95 95 <div class="col-md-4"> 96 96 <div class="row"> ... ... @@ -103,7 +103,7 @@ 103 103 </a> 104 104 </div> 105 105 </div> 106 - </div> <!-- /.col-md-4 -->219 + </div> 107 107 108 108 <div class="col-md-4"> 109 109 <div class="row"> ... ... @@ -116,8 +116,9 @@ 116 116 </a> 117 117 </div> 118 118 </div> 119 - </div> <!-- /.col-md-4 -->232 + </div> 120 120 </div> 121 121 </div> 122 -</div> 235 +</div --> 123 123 {{/html}} 237 +{{/velocity}}
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -1,31 +1,30 @@ 1 +/* 1 1 .teasing .collaborate {background-image: url('/bin/skin/Collaboratory/UX/HbpSkin/collaborate.jpg');} 2 2 .teasing .reproductible {background-image: url('/bin/skin/Collaboratory/UX/HbpSkin/reproducible.jpg');} 3 3 .teasing .science {background-image: url('/bin/skin/Collaboratory/UX/HbpSkin/science.jpg');} 4 4 .teasing .anywhere {background-image: url('/bin/skin/Collaboratory/UX/HbpSkin/anywhere.jpg');} 5 - 6 +*/ 6 6 #mainContentArea{ 7 7 padding:0; 8 8 padding-top:1.25rem 9 9 } 11 +.document-header, 10 10 #mainContentArea #hierarchy, 11 11 #mainContentArea .xcontent>hr, 12 12 #mainContentArea .xdocLastModification{ 13 13 display:none 14 14 } 17 + 15 15 #mainContentArea .xcontent>.row{ 16 16 margin-left:0; 17 17 margin-right:0 18 18 } 19 19 20 -.document-header .document-info{ 21 - width:100%; 22 - text-align:center; 23 - margin-top:3rem 24 -} 25 25 #xwikicontent{ 26 26 padding-left:0; 27 27 padding-right:0; 28 28 min-height:300px; 27 +/* 29 29 p.alert-info{ 30 30 padding:2rem 31 31 } ... ... @@ -118,6 +118,7 @@ 118 118 .clb-content>.row{ 119 119 margin-bottom:5rem 120 120 } 120 +*/ 121 121 .clb-search-bar{ 122 122 display:flex; 123 123 align-items:stretch; ... ... @@ -150,6 +150,7 @@ 150 150 .clb-search-bar input[type=text]:focus~i{ 151 151 color: @color-brand-primary; 152 152 } 153 + /* 153 153 @media screen and (min-width:992px){ 154 154 .teasing .row{ 155 155 display:flex ... ... @@ -175,6 +175,7 @@ 175 175 display:block 176 176 } 177 177 } 179 + */ 178 178 } 179 179 180 180 .clb-box{ ... ... @@ -209,3 +209,120 @@ 209 209 background-color: darken(@color-brand-primary, 15%); 210 210 } 211 211 } 214 + 215 +#xwikicontent .get-started__row__title { 216 + margin: 1rem 0; 217 + font-weight: 400; 218 + color: var(@color-brand-primary); 219 +} 220 + 221 +.hero-text h3 { 222 + line-height:1.3em; 223 +} 224 + 225 +.search__row { 226 + padding:2rem; 227 + margin: 2rem 0; 228 + background: @color-xwiki-gray; 229 +} 230 +.get-started__row__text { 231 + color: #4a5568; 232 +} 233 +.get-started__title, .highlighted__title{ 234 + text-align: center; 235 + color: #aaa; 236 + /*padding: 10rem 0;*/ 237 + padding:5rem 0; 238 + font-size: 2rem; 239 + /*border-top: 1px solid #ccc;*/ 240 + /*margin-top: 10rem;*/ 241 + /*margin-top: 5rem;*/ 242 +} 243 +.get-started__row { 244 + margin-top: 3rem; 245 +} 246 + 247 +.pre-footer, .explore-all { 248 + font-size: 32px; 249 + line-height: 42px; 250 + text-align: center; 251 +} 252 + 253 +.explore-all{ 254 + padding-top: 5rem; 255 +} 256 + 257 +@media screen and (min-width: 992px) { 258 + .get-started__row { 259 + display: flex; 260 + align-items: center; 261 + } 262 + #xwikicontent .get-started__row__title { 263 + margin: 0; 264 + margin-bottom: 1rem; 265 + } 266 +} 267 + 268 +.stretched-link { 269 + &::after { 270 + position: absolute; 271 + top: 0; 272 + right: 0; 273 + bottom: 0; 274 + left: 0; 275 + z-index: 1; 276 + // Just in case `pointer-events: none` is set on a parent 277 + pointer-events: auto; 278 + content: ""; 279 + // IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color 280 + background-color: rgba(0, 0, 0, 0); 281 + } 282 +} 283 + 284 +.pre-footer { 285 + margin: 8rem 0 2rem; 286 + padding: 5rem 0; 287 + border-top: 1px solid #ccc; 288 + /*border-bottom: 1px solid #ccc;*/ 289 +} 290 + 291 +.tags__title, .tags__text { 292 + text-align: center; 293 +} 294 + 295 +.tags__title--collaborate, 296 +.tags__title--science, 297 +.tags__title--reproducible, 298 +.tags__title--anywhere { 299 + padding-top: 4rem; 300 + position: relative; 301 +} 302 + 303 +.tags__title--collaborate::before, 304 +.tags__title--science::before, 305 +.tags__title--reproducible::before, 306 +.tags__title--anywhere::before { 307 + position: absolute; 308 + width: 50px; 309 + height: 50px; 310 + background-repeat: none; 311 + top: 0; 312 + margin-left: 50%; 313 + left: -25px; 314 + content: " "; 315 + display: table; 316 +} 317 + 318 +.tags__title--collaborate::before { 319 + background-image: url("/bin/skin/Collaboratory/UX/HbpSkin/Collaborate.svg"); 320 +} 321 +.tags__title--science::before { 322 + background-image: url("/bin/skin/Collaboratory/UX/HbpSkin/Science.svg"); 323 +} 324 +.tags__title--reproducible::before { 325 + background-image: url("/bin/skin/Collaboratory/UX/HbpSkin/Reproducible.svg"); 326 +} 327 +.tags__title--anywhere::before { 328 + background-image: url("/bin/skin/Collaboratory/UX/HbpSkin/Anywhere.svg"); 329 +} 330 +
- XWiki.DocumentSheetBinding[0]
-