Merge pull request #9 from PumpkingWok/change-styl

[WIP] change style and add gulp
This commit is contained in:
Andy Tudhope 2018-11-19 13:48:22 +02:00 committed by GitHub
commit 8e842d018e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
49 changed files with 4319 additions and 2942 deletions

View File

@ -18,7 +18,6 @@ Make sure you have node.js installed first.
1. Open Terminal and navigate to the project root directory,
2. Run `npm install`,
3. Run `npm run build`,
4. Go to `public/` directory,
5. Start a simple HTTP server serving files, for example: `python -m SimpleHTTPServer 8000`,
6. Open http://localhost:8000 in a browser.
3. Run `./node_modules/.bin/gulp build`,
4. In another terminal, run `./node_modules/.bin/hexo serve`,
5. This prevents the need for any global installs, and will allow you to have live reloading for any changes you are making.

125
gulpfile.js Normal file
View File

@ -0,0 +1,125 @@
var gulp = require('gulp')
var log = require('fancy-log')
var source = require('vinyl-source-stream')
var babelify = require('babelify')
var watchify = require('watchify')
var exorcist = require('exorcist')
var browserify = require('browserify')
var browserSync = require('browser-sync').create()
var sass = require('gulp-sass')
var imagemin = require('gulp-imagemin')
var Hexo = require('hexo');
var runSequence = require('run-sequence');
var minify = require('gulp-minify');
let cleanCSS = require('gulp-clean-css');
var rename = require("gulp-rename");
// generate html with 'hexo generate'
var hexo = new Hexo(process.cwd(), {});
gulp.task('generate', function(cb) {
hexo.init().then(function() {
return hexo.call('generate', {
watch: false
});
}).then(function() {
return hexo.exit();
}).then(function() {
return cb()
}).catch(function(err) {
console.log(err);
hexo.exit(err);
return cb(err);
})
})
var config = {
paths: {
src: {
scss: './themes/navy/source/scss/*.scss',
js: './themes/navy/source/js/main.js',
},
dist: {
css: './public/css',
js: './public/js'
}
}
}
// Watchify args contains necessary cache options to achieve fast incremental bundles.
// See watchify readme for details. Adding debug true for source-map generation.
watchify.args.debug = true
// Input file.
var bundler = watchify(browserify(config.paths.src.js, watchify.args))
// Babel transform
bundler.transform(
babelify.configure({
sourceMapRelative: './themes/navy/source/js/'
})
)
// On updates recompile
bundler.on('update', bundle)
function bundle() {
log('Compiling JS...')
return bundler
.bundle()
.on('error', function(err) {
log(err.message)
browserSync.notify('Browserify Error!')
this.emit('end')
})
.pipe(exorcist('./themes/navy/source/js/vendor.js.map'))
.pipe(source('vendor.js'))
.pipe(gulp.dest('./themes/navy/source/js'))
.pipe(browserSync.stream({ once: true }))
}
gulp.task('compress', ['sass'], function() {
gulp.src('./themes/navy/source/js/vendor.js')
.pipe(minify({
ext: {
min: '.min.js'
},
}))
.pipe(gulp.dest('./public/js/'))
gulp.src('./public/css/main.css')
.pipe(cleanCSS())
.pipe(rename("main.min.css"))
.pipe(gulp.dest('./public/css/'));
});
gulp.task('bundle', function() {
return bundle()
})
gulp.task('sass', function() {
return gulp.src("./themes/navy/source/scss/main.scss")
.pipe(sass())
.on('error', log)
.pipe(gulp.dest(config.paths.dist.css))
.pipe(browserSync.stream())
})
gulp.task('watch', function() {
gulp.watch(config.paths.src.scss, ['compress'])
});
gulp.task('build', function(cb) {
runSequence('generate', 'compress', 'bundle', 'watch')
});
gulp.task('exit', function(cb) {
process.exit(0);
});
gulp.task('run', function(cb) {
runSequence('generate', 'compress', 'bundle', 'exit')
});
gulp.task('default', [])

View File

@ -7,12 +7,19 @@
},
"scripts": {
"clean": "rm -rf public/*",
"build": "hexo generate",
"build": "gulp run && hexo generate",
"eslint": "eslint .",
"deploy": "hexo deploy"
"deploy": "hexo deploy",
"serve":"gulp run && hexo server"
},
"dependencies": {
"cheerio": "^0.20.0",
"d3": "^5.1.0",
"d3-ease": "^1.0.2",
"d3-interpolate": "^1.1.2",
"d3-scale": "^1.0.4",
"es6-promise": "^4.2.5",
"gulp": "^3.9.1",
"hexo": "^3.7.1",
"hexo-deployer-git": "^0.3.1",
"hexo-generator-archive": "^0.1.4",
@ -22,13 +29,35 @@
"hexo-renderer-marked": "^0.2.10",
"hexo-renderer-stylus": "^0.3.1",
"hexo-server": "^0.2.0",
"isomorphic-fetch": "^2.2.1",
"lodash": "^4.5.1",
"lodash.assign": "^4.2.0",
"lodash.clone": "^4.0.1",
"lodash.foreach": "^4.0.0",
"lodash.isempty": "^4.0.0",
"lodash.isequal": "^4.0.0",
"lunr": "^2.1.2"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babelify": "^8.0.0",
"browser-sync": "^2.23.7",
"browserify": "^16.2.0",
"del": "^3.0.0",
"eslint": "^4.3.0",
"eslint-config-hexo": "^2.0.0",
"rename": "^1.0.4"
"exorcist": "^1.0.1",
"fancy-log": "^1.3.2",
"gulp-clean-css": "^3.10.0",
"gulp-imagemin": "^4.1.0",
"gulp-minify": "^3.1.0",
"gulp-rename": "^1.4.0",
"gulp-sass": "^4.0.1",
"js-yaml": "^3.12.0",
"qrcode": "^1.3.2",
"rename": "^1.0.4",
"run-sequence": "^2.2.1",
"vinyl-source-stream": "^2.0.0",
"watchify": "^3.11.0"
}
}
}

View File

@ -1,64 +1,4 @@
<!-- Scripts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="/js/bundle.js?v=0.0.1"></script>
<!-- build:js build/js/main.js -->
{{ js('js/lang_select') }}
{{ js('js/toc') }}
{{ js('js/mobile_nav') }}
{{ js('js/search') }}
{{ js('js/fetch_blog_posts') }}
<!-- endbuild -->
{% if page.layout === 'plugins' %}
<!-- Plugin search -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lunr.js/2.1.2/lunr.min.js"></script>
<!-- Lazy load -->
<script async src="https://cdn.jsdelivr.net/lazysizes/3.0.0/lazysizes.min.js"></script>
<!-- build:js build/js/plugins.js -->
{{ js('js/plugins') }}
<!-- endbuild -->
{% endif %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
<script async src="/js/highlight.pack.js"></script>
<script async src="/js/solidity.js"></script>
<script>
function highlight() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
}
$(document).ready(function() {
try {
highlight();
} catch(err) {
console.log("retrying...")
setTimeout(function() {
highlight();
}, 2500)
}
var clipboard = new ClipboardJS(".btn");
clipboard.on('success', function(e) {
var id = $(e.trigger).attr("data-clipboard-target");
$(id).toggleClass("flash");
setTimeout(function() {
$(id).toggleClass("flash");
}, 200);
e.clearSelection();
})
});
</script>
<!-- Algolia -->
{% if config.algolia[page.lang] %}
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
<script type="text/javascript">
document.getElementById('search-input-wrap').classList.add('on');
docsearch({
apiKey: '{{ config.algolia[page.lang].apiKey }}',
indexName: '{{ config.algolia[page.lang].indexName }}',
inputSelector: '#search-input'
});
</script>
{% endif %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/highlight.min.js"></script>
{{ js('js/vendor.min') }}

View File

@ -23,14 +23,7 @@
<link rel="apple-touch-icon" sizes="152x152" href="/img/apple-touch-icon-152.png?v=0.0.5">
<link rel="apple-touch-icon" sizes="180x180" href="/img/apple-touch-icon-180.png?v=0.0.5">
<link rel="apple-touch-icon" href="/img/apple-touch-icon-1024.png?v=0.0.5">
<!-- CSS -->
<!-- build:css build/css/navy.css -->
{{ css('css/navy') }}
<!-- endbuild -->
<link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" />
<!-- RSS -->
{{ css('css/main.min') }}
{{ feed_tag('atom.xml') }}
<meta property="og:title" content="Status Incubate: helping #buidl web3" />
</head>

View File

@ -14,7 +14,7 @@
<li>
<a href="https://status.im/docs/" class="main-link">Docs</a>
</li>
<li class="has-popup has-popup-community">
<li class="has-popup has-popup-projects">
<a href="#" class="main-link">Projects</a>
<svg width="11" height="7" viewBox="0 0 11 7" fill="none" xmlns="http://www.w3.org/2000/svg"> <g opacity="0.4"> <path fill-rule="evenodd" clip-rule="evenodd" d="M5.23198 3.83006L1.70264 0.292429C1.31888 -0.0922324 0.683447 -0.095995 0.293839 0.294529C-0.0984862 0.687776 -0.0967079 1.31728 0.291744 1.70664L4.52863 5.95348C4.72016 6.14547 4.97439 6.24257 5.22946 6.24313C5.48789 6.2456 5.74145 6.14782 5.93533 5.95348L10.1722 1.70664C10.556 1.32198 10.5597 0.685054 10.1701 0.294529C9.7778 -0.0987176 9.14977 -0.0969352 8.76132 0.292429L5.23198 3.83006Z" fill="#6E777E"/> </g> </svg>
</li>
@ -51,45 +51,125 @@
</div>
</div>
<div id="general-menu-backdrop"></div>
<div id="popup-community" class="general-menu-popup">
<div class="inner">
<h3>Community</h3>
<ul class="features">
<li>
<svg width="35" height="26" viewBox="0 0 35 26" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M0 20.5C0 17.4624 2.46243 15 5.5 15H18.5C21.5376 15 24 17.4624 24 20.5C24 23.5376 21.5376 26 18.5 26H5.5C2.46243 26 0 23.5376 0 20.5Z" fill="#4360DF"/> <mask id="path-2-outside-1" maskUnits="userSpaceOnUse" x="16" y="6" width="19" height="19" fill="black"> <rect fill="white" x="16" y="6" width="19" height="19"/> <path fill-rule="evenodd" clip-rule="evenodd" d="M24 20.5C24 21.3284 24.6716 22 25.5 22C26.3284 22 27 21.3284 27 20.5V17H30.5C31.3284 17 32 16.3284 32 15.5C32 14.6716 31.3284 14 30.5 14H27V10.5C27 9.67157 26.3284 9 25.5 9C24.6716 9 24 9.67157 24 10.5V14H20.5C19.6716 14 19 14.6716 19 15.5C19 16.3284 19.6716 17 20.5 17H24V20.5Z"/> </mask> <path fill-rule="evenodd" clip-rule="evenodd" d="M24 20.5C24 21.3284 24.6716 22 25.5 22C26.3284 22 27 21.3284 27 20.5V17H30.5C31.3284 17 32 16.3284 32 15.5C32 14.6716 31.3284 14 30.5 14H27V10.5C27 9.67157 26.3284 9 25.5 9C24.6716 9 24 9.67157 24 10.5V14H20.5C19.6716 14 19 14.6716 19 15.5C19 16.3284 19.6716 17 20.5 17H24V20.5Z" fill="#A8B6F0"/> <path d="M27 17V14H24V17H27ZM27 14H24V17H27V14ZM24 14V17H27V14H24ZM24 17H27V14H24V17ZM25.5 19C26.3284 19 27 19.6716 27 20.5H21C21 22.9853 23.0147 25 25.5 25V19ZM24 20.5C24 19.6716 24.6716 19 25.5 19V25C27.9853 25 30 22.9853 30 20.5H24ZM24 17V20.5H30V17H24ZM30.5 14H27V20H30.5V14ZM29 15.5C29 14.6716 29.6716 14 30.5 14V20C32.9853 20 35 17.9853 35 15.5H29ZM30.5 17C29.6716 17 29 16.3284 29 15.5H35C35 13.0147 32.9853 11 30.5 11V17ZM27 17H30.5V11H27V17ZM24 10.5V14H30V10.5H24ZM25.5 12C24.6716 12 24 11.3284 24 10.5H30C30 8.01472 27.9853 6 25.5 6V12ZM27 10.5C27 11.3284 26.3284 12 25.5 12V6C23.0147 6 21 8.01472 21 10.5H27ZM27 14V10.5H21V14H27ZM20.5 17H24V11H20.5V17ZM22 15.5C22 16.3284 21.3284 17 20.5 17V11C18.0147 11 16 13.0147 16 15.5H22ZM20.5 14C21.3284 14 22 14.6716 22 15.5H16C16 17.9853 18.0147 20 20.5 20V14ZM24 14H20.5V20H24V14ZM27 20.5V17H21V20.5H27Z" fill="#ECEFFC" mask="url(#path-2-outside-1)"/> <circle cx="13" cy="5" r="5" fill="#4360DF"/> </svg>
<h4>Join the chat in Status</h4>
<p>Whisper sweet, encrypted nothings on a distributed network that no-one owns.</p>
</li>
<li>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M24.3333 8C28.5675 8 32 11.377 32 15.5428V28.7428C32 29.2361 31.7068 29.6838 31.2504 29.8876C30.7937 30.0914 30.258 30.0138 29.8809 29.6889L26.2151 26.5332C25.5163 25.9316 24.6191 25.6 23.6907 25.6H15.3889C11.8603 25.6 9 22.7858 9 19.3143V14.2857C9 10.8141 11.8603 8 15.3889 8H24.3333Z" fill="#A8B6F0"/> <path d="M7.66667 0C3.43247 0 0 3.37703 0 7.54285V20.7428C0 21.2361 0.29324 21.6838 0.749634 21.8876C1.20634 22.0914 1.74197 22.0138 2.11913 21.6889L5.78494 18.5332C6.48372 17.9316 7.38091 17.6 8.3093 17.6H16.6111C20.1397 17.6 23 14.7858 23 11.3143V6.28571C23 2.81414 20.1397 0 16.6111 0H7.66667Z" fill="#4360DF"/> <circle cx="15" cy="9" r="2" fill="white"/> <circle cx="8" cy="9" r="2" fill="white"/> </svg>
<h4>Join the Discussion</h4>
<p>Join longer discussions, work in progress, and our research here.</p>
</li>
<li>
<svg width="33" height="31" viewBox="0 0 33 31" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M16.4495 0C7.36697 0 0 7.11346 0 15.8835C0 22.8995 4.74312 28.8436 11.2018 30.9874C12.0092 31.0848 12.3119 30.5976 12.3119 30.2078C12.3119 29.8181 12.3119 28.8436 12.3119 27.4794C7.77064 28.4538 6.76147 25.3356 6.76147 25.3356C6.05505 23.4842 4.94495 22.9969 4.94495 22.9969C3.43119 22.0225 5.04587 22.0225 5.04587 22.0225C6.66055 22.1199 7.56881 23.679 7.56881 23.679C9.08257 26.1152 11.4037 25.4331 12.3119 25.0433C12.4128 23.9714 12.9174 23.2893 13.3211 22.8995C9.68807 22.5097 5.85321 21.1455 5.85321 15.0065C5.85321 13.2525 6.45872 11.8882 7.56881 10.7189C7.46789 10.4266 6.86239 8.77002 7.77064 6.62624C7.77064 6.62624 9.18349 6.23646 12.3119 8.28279C13.6239 7.89302 15.0367 7.79557 16.4495 7.79557C17.8624 7.79557 19.2752 7.99046 20.5872 8.28279C23.7156 6.23646 25.1284 6.62624 25.1284 6.62624C26.0367 8.77002 25.4312 10.4266 25.3303 10.8164C26.3395 11.8882 27.0459 13.3499 27.0459 15.1039C27.0459 21.2429 23.211 22.5097 19.578 22.8995C20.1835 23.3867 20.6881 24.3612 20.6881 25.8228C20.6881 27.9666 20.6881 29.6232 20.6881 30.2078C20.6881 30.5976 20.9908 31.0848 21.7982 30.9874C28.3578 28.8436 33 22.8995 33 15.8835C32.8991 7.11346 25.5321 0 16.4495 0Z" fill="#4360DF"/> </svg>
<h4>Contribute to our Repos</h4>
<p>Help us #buidl the future by getting involved in the most active code base in Ethereum.</p>
</li>
</ul>
<h5>Find out more</h5>
<ul class="more">
<li>
<h4>Read our Blog</h4>
<p>Status is a community of people all over the world connected by a set of</p>
<a href="https://our.status.im/">Learn more and apply <svg width="7" height="11" viewBox="0 0 7 11" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M4.50752 5.75572L0.978261 9.29336C0.594509 9.67802 0.590756 10.3149 0.980356 10.7055C1.37267 11.0987 2.00068 11.0969 2.38913 10.7076L6.62591 6.46073C6.81745 6.26874 6.91432 6.01391 6.91487 5.75824C6.91734 5.4992 6.81979 5.24505 6.62591 5.05071L2.38913 0.803866C2.00538 0.419204 1.36996 0.415442 0.980356 0.805966C0.588039 1.19921 0.589818 1.82872 0.978261 2.21808L4.50752 5.75572Z" fill="#4360DF"/> </svg> </a>
</li>
<li>
<h4>Life at Status</h4>
<p>Explore open positions. Status is a community of people all over the world connected by a set </p>
<a href="https://status.im/contribute">Learn more and apply <svg width="7" height="11" viewBox="0 0 7 11" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M4.50752 5.75572L0.978261 9.29336C0.594509 9.67802 0.590756 10.3149 0.980356 10.7055C1.37267 11.0987 2.00068 11.0969 2.38913 10.7076L6.62591 6.46073C6.81745 6.26874 6.91432 6.01391 6.91487 5.75824C6.91734 5.4992 6.81979 5.24505 6.62591 5.05071L2.38913 0.803866C2.00538 0.419204 1.36996 0.415442 0.980356 0.805966C0.588039 1.19921 0.589818 1.82872 0.978261 2.21808L4.50752 5.75572Z" fill="#4360DF"/> </svg> </a>
</li>
<li>
<h4>Follow us on Twitter</h4>
<p>Status is a community of people all over the world connected by a set of</p>
<a href="https://twitter.com/ethstatus">Learn more and apply <svg width="7" height="11" viewBox="0 0 7 11" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M4.50752 5.75572L0.978261 9.29336C0.594509 9.67802 0.590756 10.3149 0.980356 10.7055C1.37267 11.0987 2.00068 11.0969 2.38913 10.7076L6.62591 6.46073C6.81745 6.26874 6.91432 6.01391 6.91487 5.75824C6.91734 5.4992 6.81979 5.24505 6.62591 5.05071L2.38913 0.803866C2.00538 0.419204 1.36996 0.415442 0.980356 0.805966C0.588039 1.19921 0.589818 1.82872 0.978261 2.21808L4.50752 5.75572Z" fill="#4360DF"/> </svg> </a>
</li>
</ul>
<a href="#" class="close"><svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M6 4.57404L1.72275 0.296796C1.32616 -0.0997918 0.689941 -0.0975927 0.296174 0.296174C-0.100338 0.692686 -0.0973145 1.32864 0.296796 1.72275L4.57404 6L0.296796 10.2772C-0.0997918 10.6738 -0.0975927 11.3101 0.296174 11.7038C0.692686 12.1003 1.32864 12.0973 1.72275 11.7032L6 7.42596L10.2772 11.7032C10.6738 12.0998 11.3101 12.0976 11.7038 11.7038C12.1003 11.3073 12.0973 10.6714 11.7032 10.2772L7.42596 6L11.7032 1.72275C12.0998 1.32616 12.0976 0.689941 11.7038 0.296174C11.3073 -0.100338 10.6714 -0.0973145 10.2772 0.296796L6 4.57404Z" fill="#6E777E"/> </svg> </a>
<div class="popup-wrap popup-wrap--community">
<div class="popup popup--community">
<a class="popup__button popup__button--close"></a>
<h3 class="popup__title">Community</h3>
<div class="popup__inner">
<div class="cards cards--three cards--three--even cards--community cards--community--light">
<div class="card">
<a href="https://get.status.im/chat/public/status" class="card-inner">
<div class="community-icon community-icon--join"></div>
<h4>Join the chat in Status</h4>
<p class="secondary-text">Whisper sweet, encrypted nothings on a distributed network that no-one owns.</p>
</a>
</div>
<div class="card">
<a href="https://discuss.status.im/" class="card-inner">
<div class="community-icon community-icon--discussion"></div>
<h4>Join the Discussion</h4>
<p class="secondary-text">Join longer discussions, work in progress, and our research here.</p>
</a>
</div>
<div class="card">
<a href="https://github.com/status-im/" class="card-inner">
<div class="community-icon community-icon--contrubute"></div>
<h4>Contribute to our Repos</h4>
<p class="secondary-text">Help us #buidl the future by getting involved in the most active code base in Ethereum.</p>
</a>
</div>
</div>
<h5>Find Out More</h5>
<div class="cards cards-community-more cards--three cards--three--even">
<div class="card">
<div class="card-inner">
<div class="card-content">
<div class="latest-posts"></div>
</div>
<div class="card-community-more__link"><a href="https://our.status.im/" class="link-arrow">Learn more</a></div>
</div>
</div>
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Life at Status</h4>
<p class="secondary-text">What's it like to live the decentralized lifestyle? Find out here.</p>
</div>
<div class="card-community-more__link"><a href={{url_for_lang('contribute')}} class="link-arrow">Learn more</a></div>
</div>
</div>
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Follow us on Twitter</h4>
<p class="secondary-text">Join the conversation on our social channels to learn more.</p>
</div>
<div class="card-community-more__link"><a href="https://twitter.com/ethstatus/" class="link-arrow">Learn more</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="general-popup-backdrop"></div>
</div>
<div class="popup-overlay"></div>
</div>
<div class="popup-wrap popup-wrap--projects">
<div class="popup popup--projects">
<a class="popup__button popup__button--close"></a>
<h3 class="popup__title">Projects</h3>
<div class="popup__inner">
<h5>Help us #buidl</h5>
<div class="cards cards-community-more cards--three cards--three--even">
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Embark</h4>
<p class="secondary-text">Embark is a simple and easy to use development framework that enables you to build and deploy your own decentralized applications smoothly.</p>
</div>
<div class="card-community-more__link"><a href="https://embark.status.im/" class="link-arrow">Learn more</a></div>
</div>
</div>
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Nimbus</h4>
<p class="secondary-text">A research project and light client for Ethereum 2.0 designed to perform well on embedded systems and resource-restricted hardware.</p>
</div>
<div class="card-community-more__link"><a href="https://nimbus.status.im" class="link-arrow">Learn more</a></div>
</div>
</div>
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Status Studio</h4>
<p class="secondary-text">Studio is an integrated developer environment and educational platform designed to be a one-stop-shop for ÐApp development.</p>
</div>
<div class="card-community-more__link"><a href="https://studio.status.im" class="link-arrow">Learn more</a></div>
</div>
</div>
</div>
<div class="separator"></div>
<h5>Tools for Everyone</h5>
<div class="cards cards-community-more cards--three cards--three--even">
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Incubate</h4>
<p class="secondary-text">Incubate supports open source, early stage startups with funding, technical mentorship, legal and regulatory compliance and much more.</p>
</div>
<div class="card-community-more__link"><a href="https://incubate.status.im/" class="link-arrow">Learn more</a></div>
</div>
</div>
<div class="card">
<div class="card-inner">
<div class="card-content">
<h4>Status Hardwallet</h4>
<p class="secondary-text">A hardware wallet in the form of a card with a safe, contactless transaction experience</p>
</div>
<div class="card-community-more__link"><a href="https://hardwallet.status.im/" class="link-arrow">Learn more</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="popup-overlay"></div>

View File

@ -1,24 +0,0 @@
.archive-post
padding: 1em 0
border-top: 1px solid color-border
&:last-child
padding-bottom: 40px
.archive-post-link
clearfix()
display: block
color: color-default
text-decoration: none
line-height: line-height
&:hover
color: color-link-hover
.archive-post-title
font-family: font-title
float: left
font-weight: bold
.archive-post-date
color: color-gray
float: right
font-size: 0.9em

View File

@ -1,51 +0,0 @@
global-reset()
html
box-sizing: border-box
*, *:before, *:after
box-sizing: inherit
button
input[type="reset"]
input[type="button"]
input[type="submit"]
&::-moz-focus-inner
padding: 0
margin: 0
border: 0
input, button, select
margin: 0
padding: 0
border: 0
html, body
@media screen
height: 100%
// overflow: hidden
body
background: color-navy
font-size: font-size
font-family: font-sans
color: color-default
text-rendering: optimizeLegibility
-webkit-font-smoothing: antialiased
-moz-osx-font-smoothing: grayscale
overflow-x: hidden
.wrapper
clearfix()
@media screen
max-width: 1200px;
margin: 0 auto;
.inner
clearfix()
#content-wrap
background: color-background-light
#content-wrap-apply
background: color-background

View File

@ -1,214 +0,0 @@
.footer
width 100%
display flex
justify-content center
background-color #262A39
position relative
z-index 998
margin 0 0 0 0
.footer-inner
display flex
flex-direction column
align-items center
justify-content space-between
width 1200px
padding 32px 0
.cards--community
&.cards--community--dark
margin 0
.card-inner
background-color transparent
a
h4
color $colorWhite
p
color $colorGray
opacity .7
&:hover
h4
opacity 0.8
.cards--community--dark
.community-icon--join
background-image url(../img/icon-join-dark.svg)
.community-icon--discussion
background-image url(../img/icon-discussion-dark.svg)
.community-icon--contrubute
background-image url(../img/icon-contribute-dark.svg)
.footer-nav
width 100%
display flex
align-items center
justify-content center
margin 32px 0 0 0
padding 32px 0
border-top 1px solid rgba(255, 255, 255, .1)
li
a
padding 0 12px
color $colorWhite
&:hover
opacity .8
.footer-logo-wrap
width 317px
display flex
text-align center
.footer-logo-wrap__inner
width 100%
display flex
flex-direction column
justify-content space-between
align-items center
padding 16px 0 16px 0
a
&.footer-logo
display block
width 52px
height 52px
background-size 52px
background-image url(../img/footer-logo.svg)
&:hover
opacity .8
.footer-address
padding 20px 0 0 0
color #939ba1
.footer-table
display flex
.footer-table__column
box-sizing border-box
padding 32px 74px 64px
.footer-header
color white
opacity .5
margin 0 0 40px 0
.footer-link
height 32px
line-height 32px
margin 0 0 15px 0
a
display flex
align-items center
color white
text-decoration none
&:hover
opacity .8
.footer-icon
display inline-block
width 32px
height 32px
background-color rgba(255, 255, 255, 0.1)
border-radius 50%
margin 0 15px 0 0
background-repeat no-repeat
background-size 24px
background-position center
.footer-link--fb
.footer-icon
background-image: url(../img/icon_fb.svg)
.footer-link--tw
.footer-icon
background-image: url(../img/icon_tw.svg)
.footer-link--ri
.footer-icon
background-image: url(../img/icon_ri.svg)
.footer-link--gh
.footer-icon
background-image: url(../img/icon_gh.svg)
.footer-link--rd
.footer-icon
background-image: url(../img/icon_rd.svg)
.footer-link--yt
.footer-icon
background-image: url(../img/icon_yt.svg)
.language-switcher
color white
-webkit-appearance none
font-size 16px
line-height 32px
padding 0 24px 0 0
background-image url(../img/new-site/icon_dropdown-white.svg)
background-size 24px
background-repeat no-repeat
background-position right center
&:focus
outline none
@media (max-width: 1248px)
.footer-inner
width 100%
padding 32px 24px
.footer-logo-wrap
//width 200px
@media (max-width: 960px)
.cards--community
&.cards--community--dark
.card-inner
height auto
min-height 180px
.footer-inner
width 820px
justify-content space-around
@media (max-width: 800px)
.cards--community
&.cards--community--dark
margin 0 auto
max-width 375px
.card-inner
padding 0 12px
@media (max-width: 767px)
.footer
border-top 0px
.footer-inner
padding 40px 0 0 0
flex-direction column
.footer-header
margin 0 0 16px 0
.footer-table
flex-direction column
align-items center
justify-content center
.footer-table__column
text-align center
padding 16px 16px
.footer-nav
margin 0 0 0 0
.footer-link
text-align center
height 24px
line-height 24px
margin 0 0 16px 0
a
justify-content center
text-align center
.footer-icon
display none
.footer-logo-wrap
width auto
order 2
.footer-logo-wrap__inner
width 100%
padding 32px 0 40px 0
align-items center
text-align center

View File

@ -1,212 +0,0 @@
header-padding-normal = 10px
header-padding-max = 30px
logo-size = 50px
#header
position: relative
padding: header-padding-normal 0
@media print
display: none
#header-inner
display: flex
flex-flow: row nowrap
align-items: center
width: 1190px
margin-left: -120px
@media mq-mobile
justify-content: center
.button--header
margin-top: 7px
#logo-wrap-page
flex: 0
-webkit-flex: none
margin-top: 8px
width: 200px
#logo
hide-text()
display: block
width: 56px;
height: 56px;
background-image: url(../img/logo_white.svg);
text-decoration: none;
margin: -20px 0 0 30px;
background-color: #5EC12F;
border-radius: 50%;
background-size: 22px;
background-position: center;
background-repeat: no-repeat;
.dropdown
display: flex
align-items: center
margin-left: 32px
nav
ul
li
float: left
margin: 8px
position: relative
a
color: #FFFFFF
text-decoration: none
font-weight: bold
&:hover
opacity: .7
&:focus
color: rgba(255, 255,255,1)
a
color: rgba(255,255,255,0.7)
&:hover
& > ul
display: block
z-index: 1
ul
background: #ffffff
border-radius: 5px
left: 0
padding: 10px 5px 5px 5px
position: absolute
top: 100%
li
float: none
width: 8.125em
a
&:hover
color #000
.dropdown:before,
.dropdown:after
clear: both
content: ""
display: table
.dropdown nav ul li ul li a:link,
.dropdown nav ul li ul li a:visited
color: #8d99a4
#search-input-wrap
display: none
height: 40px
width: 180px
background-color: #ff9c00
border-radius: 22px
padding: 0 12px
align-items: center
transition: 0.2s
&.on
display: flex
@media mq-mobile
width: 40px
cursor: pointer
&.standalone
position: absolute
right: 20px
&.active
width: 180px
background-color: color-background-light
#search-input-icon
color: rgba(255, 255, 255, 1)
height: 24px
width: 24px
margin: 0 2px 0 0
display: inline-block
opacity: 1
@media mq-mobile
height: auto;
#search-input-wrap.active #search-input-icon
color: color-navy
#search-input-wrap.active #search-input
color: color-navy
#search-input
background: none
width: 126px
height: 24px
font-size: 15px
color: color-main-link
outline: none
-webkit-appearance: none
@media mq-mobile
display: none
#search-input-wrap.active #search-input
display: inline;
#search-input::-webkit-input-placeholder {
color:rgba(255, 255, 255, .4)
}
#search-input::-moz-placeholder {
color:rgba(255, 255, 255, .4)
}
#search-input:-ms-input-placeholder {
color:rgba(255, 255, 255, .4)
}
#search-input:-moz-placeholder {
color:rgba(255, 255, 255, .4)
}
#search-input-wrap .algolia-autocomplete .ds-dropdown-menu
@media (max-width: 560px)
min-width: 400px
@media (max-width: 470px)
min-width: 300px
#lang-select-wrap
display: none
position: relative
@media mq-normal
display: block
#lang-select-label
color: color-main-link
opacity: 0.7
font-family: font-title
line-height: logo-size
span
padding-left: 8px
i
opacity: 0.7
#lang-select
opacity: 0
position: absolute
top: 0
left: 0
width: 100%
height: 100%
-webkit-appearance: menulist-button
font-size: inherit
.site-specific-menu
max-width: 1200px
width: 100%
padding: 11px 0 0 20px
border-top: 1px solid rgba(0,0,0,0.08)
margin: 0 auto;
span
padding-right: 24px
.site-name
font-weight: bold
font-size: 18px
color: #000
text-decoration: none
padding-right: 24px
.specific-nav-link
color: rgba(0,0,0,0.7)
font-size: 14px
text-decoration: none
.active
color: incubate

View File

@ -1,105 +0,0 @@
// https://github.com/chriskempson/tomorrow-theme
highlight-background = #fff
highlight-current-line = #efefef
highlight-selection = #d6d6d6
highlight-foreground = #4d4d4c
highlight-comment = #8e908c
highlight-red = #c82829
highlight-orange = #f5871f
highlight-yellow = #eab700
highlight-green = #718c00
highlight-aqua = #3e999f
highlight-blue = #4271ae
highlight-purple = #8959a8
pre, code
font-family: font-mono
color: highlight-foreground
background: #eee
font-size: 0.95em
code
padding: 0 5px
pre
padding: 10px 15px
line-height: 22px
code
border: none
display: block
padding: 0
.highlight
background: #eee
padding: 10px 15px
color: highlight-foreground
overflow: auto
margin: 0
table
margin: 0 !important
border: 0
th, td
padding: 0
figcaption
clearfix()
margin: -5px 0 5px
font-size: 0.9em
color: color-gray
a
float: right
pre
padding: 0
border: none
background: none
.line
height: 22px
pre
.comment
.title
color: highlight-comment
.variable
.attribute
.tag
.regexp
.ruby .constant
.xml .tag .title
.xml .pi
.xml .doctype
.html .doctype
.css .id
.css .class
.css .pseudo
color: highlight-red
.number
.preprocessor
.built_in
.literal
.params
.constant
color: highlight-orange
.class
.ruby .class .title
.css .rules .attribute
color: highlight-green
.string
.value
.inheritance
.header
.ruby .symbol
.xml .cdata
color: highlight-green
.css .hexcolor
color: highlight-aqua
.function
.python .decorator
.python .title
.ruby .function .title
.ruby .title .keyword
.perl .sub
.javascript .title
.coffeescript .title
color: highlight-blue
.keyword
.javascript .function
color: highlight-purple

View File

@ -1,125 +0,0 @@
#banner
color: rgba(255, 255, 255, 1.0)
text-align: center
#banner-title
padding-top: 20px
font-size: 40px
line-height: 1.15
font-weight: 300
font-family: font-title
@media mq-normal
padding-top: 100px
font-size: 50px
#banner-start
text-align: center
padding: 40px 0
@media mq-normal
padding: 60px 0
font-size: 18px
#banner-start-command
background: lighten(color-navy, 10%)
font-family: font-mono
display: inline-block
padding: 15px 20px
&:before
content: "$"
opacity: 0.5
padding-right: 10px
#banner-start-link
color: #fff
background: color-link
display: inline-block
padding: 15px
text-decoration: none
transition: 0.2s
&:hover
background: color-link-hover
#banner-share
display: none
padding-bottom: 60px
@media mq-normal
display: block
#intro-feature-list
padding-top: 20px
display: flex
flex-flow: column
@media mq-normal
flex-flow: row wrap
.intro-feature-wrap
padding-top: 20px
@media mq-normal
flex: 0 0 50%
padding-top: 50px
.intro-feature
position: relative
text-align: center
@media mq-normal
text-align: left
padding-left: 70px
.intro-feature-icon
color: color-link
font-size: 36px
padding-bottom: 26px
text-align: center
@media mq-normal
position: absolute
top: 0
left: 20px
font-size: 24px
width: @font-size
.intro-feature-title
color: color-link
font-family: font-title
font-size: 24px
.intro-feature-desc
margin: line-height 0
line-height: line-height
#intro-cmd-wrap
max-width: 700px
background: #eee
padding: 15px 0
margin: 25px gutter-width * -1 0
@media mq-normal
margin: 50px auto 0
.intro-cmd-item
font-size: 16px
font-family: font-mono
line-height: 2
padding: 0 30px
&:before
content: "$"
color: color-link
padding-right: 15px
#intro-get-started-wrap
text-align: center
#intro-get-started-link
font-size: 18px
font-family: font-title
display: inline-block
color: color-link
text-decoration: none
margin: 40px 0
border: 3px solid
border-color: lighten(color-link, 20%)
padding: 12px 24px
position: relative
transition: 0.2s
&:hover
background: @border-color
color: #fff

File diff suppressed because it is too large Load Diff

View File

@ -1,139 +0,0 @@
toggle-width = 25px
toggle-height = toggle-width * 0.8
toggle-line = 2px
transition-duration = 0.4s
lang-select-height = 40px
.mobile-menu-container
display: none
#mobile-nav
position: fixed
top: 0
width: mobile-nav-width
left: @width * -1
height: 100%
background: color-navy
transition: transition-duration
font-family: font-title
.mobile-nav-on &
transform: translateX(100%)
#mobile-nav-inner
overflow-y: auto
padding: 10px 0
position: absolute
top: 0
bottom: lang-select-height
left: 0
right: 0
-webkit-overflow-scrolling: touch
#mobile-nav-toggle
position: absolute
top: 0
bottom: 0
left: gutter-width
width: toggle-width
height: toggle-height
margin: auto
opacity: 0.5
cursor: pointer
transition: 0.2s
&:active, .mobile-nav-on &
opacity: 1
@media mq-normal
display: none
.mobile-nav-toggle-bar
background: #fff
position: absolute
left: 0
width: 100%
height: toggle-line
transition: transition-duration
transform-origin: 0
border-radius: toggle-line
&:first-child
top: 0
.mobile-nav-on &
transform: rotate(45deg)
&:nth-child(2)
top: (toggle-height - toggle-line) * 0.5
.mobile-nav-on &
opacity: 0
&:last-child
top: toggle-height - toggle-line
.mobile-nav-on &
transform: rotate(-45deg)
.mobile-nav-link
color: #fff
text-decoration: none
display: block
padding: 10px 15px
line-height: 1
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
.mobile-nav-title
color: color-link
font-weight: bold
padding: 10px 15px
line-height: 1
display: block
border-top: 1px solid #444
margin-top: 10px
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
#mobile-lang-select-wrap
position: absolute
bottom: 0
left: 0
width: 100%
background: color-navy
border-top: 1px solid #444
#mobile-lang-select-label
line-height: lang-select-height
color: #fff
padding: 10px 15px
i
opacity: 0.7
span
padding-left: 8px
#mobile-lang-select
-webkit-appearance: menulist-button
opacity: 0
position: absolute
top: 0
left: 0
width: 100%
height: 100%
#container
transition: transition-duration
height: 100%
// overflow: auto
-webkit-overflow-scrolling: touch
.mobile-nav-on &
transform: translateX(mobile-nav-width)
overflow: hidden
#mobile-nav-dimmer
position: absolute
top: 0
left: 100%
height: 100%
background: #000
opacity: 0
transition: opacity transition-duration, transform 0s transition-duration
.mobile-nav-on &
width: 100%
opacity: 0.7
transform: translateX(-100%)
transition: opacity transition-duration

View File

@ -1,375 +0,0 @@
note-tip = hsl(40, 100%, 50%)
note-info = hsl(200, 100%, 50%)
note-warn = hsl(0, 100%, 50%)
#content
clearfix()
position: relative
#content-apply
clearfix()
position: relative
background: #fff
border-radius: 10px
padding: 64px
margin-top: 40px
h1
#content-inner
display: flex;
#content-inner-full
clearfix()
@media mq-normal
margin-left: 0
.article-container
@media mq-normal
float: right
width: 100%
.article-inner
clearfix()
.article
float: left
width: 100%
padding: 20px 0
@media print
padding: 0
#article-toc
display: none
float: right
width: sidebar-width
margin-right: sidebar-width * -1
opacity: 0.8
@media mq-normal
display: block
@media screen and (max-width: 1450px)
display: none
&.fixed
position: absolute
top: 0
bottom: 0
right: 0
#article-toc-inner
@extend .inner
overflow-x: hidden
overflow-y: auto
width: sidebar-width
.fixed &
position: fixed
top: 0
bottom: 0
.toc-link
@extend .sidebar-link
.toc-child
padding-left: 1em
font-size: 0.9em
#article-toc-top
margin-top: 2em
font-size: 0.9em
text-decoration: none
color: color-default
display: block
margin-bottom: 40px
font-family: font-title
&:hover
color: color-link-hover
.article-header
max-width: 1200px;
margin: 150px auto 20px;
display: flex;
justify-content: space-between;
@media mq-mobile
padding: 0 20px
.article-title
font-family: font-title
font-size: 26px
line-height: 32px
font-weight: 300
text-decoration: none
font-weight: bold;
font-size: 25px;
color: #000;
transition: 0.2s
.post &
float: none
.article-date
color: color-gray
text-decoration: none
display: inline-block
margin-top: 1em
&:hover
color: color-link-hover
.article-edit-link
font-style: normal;
font-weight: normal;
line-height: normal;
font-size: 15px;
color: incubate;
display: none;
align-items: flex-end;
text-decoration: none;
&:hover
opacity: 0.7;
@media mq-normal
display: flex
.article-anchor
margin-left: 10px
display: none
&:before
content: "#"
@media print
display: none !important
.article-heading:hover &
display: inline-block
.article-content-apply
max-width: 1200px !important
.article-content
line-height: line-height
color: color-default
max-width: 800px
@media print
font-size: 12pt
@media mq-mobile
padding: 0 20px
p, ol, ul, dl, table, blockquote, iframe, .highlight
margin: 12px 0
h1
font-size: 26px
h2
font-size: 20px
h3
font-size: 16px
h1, h2, h3, h4, h5, h6
font-weight: bold
margin: 32px 0
color: #000000
a
color: incubate;
text-decoration: none;
&:hover
color: color-link-hover
text-decoration: underline
@media print
color: color-default
text-decoration: underline
&:after
content: " (" attr(href) ")"
font-size: 80%
strong
font-weight: bold
em
font-style: italic
ul, ol, dl
margin-left: 20px
ul, ol, dl
margin-top: 0
margin-bottom: 0
ul
list-style: disc
ol
list-style: decimal
dl
list-style: square
li
p
margin: 0
table, blockquote, iframe, .highlight
margin: 1em 0
img, video
max-width: 100%
width: 70px
height: 70px
blockquote
padding: 0 20px
position: relative
border: 1px solid color-border
border-left: 5px solid #ddd
footer
margin: 1em 0
font-style: italic
cite
&:before
content: ""
padding: 0 0.3em
a
color: color-grey
.note
&.tip
border-left-color: note-tip
&.info
border-left-color: note-info
&.warn
border-left-color: note-warn
.note-title
margin: 1em 0
display: block
font-size: 1.3em
font-weight: bold
table
max-width: 100%
border: 1px solid color-border
th
font-weight: bold
th, td
padding: 5px 15px
tr
&:nth-child(2n)
background: #eee
.article-footer
clearfix()
margin: 1em 0
border-top: 1px solid color-border
text-align: center
color: color-gray
line-height: 1em
padding-top: 1em
position: relative
background: transparent
@media print
display: none
$article-footer-link
color: color-link
text-decoration: none
font-weight: bold
font-family: font-title
text-transform: uppercase
position: absolute
&:hover
color: color-link-hover
@media print
display: none
span
padding: 0 6px
.article-footer-prev
@extend $article-footer-link
left: 0
.article-footer-next
@extend $article-footer-link
right: 0
.article-footer-updated
font-size: 0.9em
#comments
@media print
display: none
#page-list-header
clearfix()
margin: 40px 0
#page-list-title
font-family: font-title
font-size: 36px
font-weight: 300
line-height: 1
float: left
.team-member
float: left
width: 33%
text-align: center
padding: 20px 0
@media mq-mobile
width: 50%
@media (max-width: 491px)
width: 100%
padding: 0
h4
font-size: 16px
p
color: #939BA1
font-size: 16px
.submission-list
list-style: circle !important
margin-bottom: 100px !important
li
padding: 10px 0
.projects-intro
margin-top: 32px
.project-wrap
display: table-row
.project
width: calc(50% - 30px)
margin-right: 30px
.project2
width: 50%
.project-apply
text-align: center
.project, .project2
float: left
padding: 32px
border: 1px solid rgba(0, 0, 0, 0.1)
box-sizing: border-box
border-radius: 10px
margin-bottom: 30px
margin-top: 30px
height: 370px
img
margin: 3px 0px 15px
h4, h3
font-weight: bold
font-size: 20px
color: #000000
margin: 12px 0
h3
margin: 100px 0 28px 0
p
line-height: 25px
font-size: 16px
color: #000000
a
background: rgba(0,139,173,0.1)
border-radius: 20px
color: rgb(0,139,173)
padding: 12px 24px
text-decoration: none
margin-top: 20px
&:hover
color: rgb(255,255,255)
background: rgb(0,139,173)
.project-cover-link
color: #fff !important
background: none !important
padding: 0 !important
margin-top: 0 !important
@media (max-width: 491px)
.project, .project2
width: 95%
margin: 20px 10px
height: 450px
h3
margin: 140px 0 28px 0
.projects-intro
padding-left: 20px

View File

@ -1,39 +0,0 @@
#sidebar
min-width: sidebar-width
padding: 40px 0
.inner
padding: 0;
&:before
display: none
strong
display: none
.sidebar-title
margin-top: 40px
padding: 10px 0
font-family: font-title
font-weight: bold
color: color-title
display: inline-block
border-top: 1px solid color-border
line-height: 1
.sidebar-link
border-radius: 23.5px;
font-size: 15px;
padding: 9px 24px;
display: block;
margin-bottom: 10px;
position: relative;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
cursor: pointer;
color: #000;
text-decoration: none;
line-height: normal;
&:hover
background: rgba(67,96,223,0.1);
color: #4360DF;

View File

@ -1,13 +0,0 @@
@import "nib"
@import "_variables"
@import "_partial/base"
@import "_partial/header"
@import "_partial/index"
@import "_partial/sidebar"
@import "_partial/page"
@import "_partial/archive"
@import "_partial/mobile_nav"
@import "_partial/footer"
@import "_partial/highlight"
@import "_partial/main"

View File

@ -0,0 +1,3 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.9511 1C7.14373 1 0 7.88399 0 16.3711C0 23.1608 4.59939 28.9132 10.8624 30.9878C11.6453 31.0821 11.9388 30.6106 11.9388 30.2334C11.9388 29.8562 11.9388 28.9132 11.9388 27.593C7.53517 28.536 6.55657 25.5183 6.55657 25.5183C5.87156 23.7266 4.79511 23.2551 4.79511 23.2551C3.32722 22.3121 4.89297 22.3121 4.89297 22.3121C6.45872 22.4064 7.33945 23.9152 7.33945 23.9152C8.80734 26.2727 11.0581 25.6126 11.9388 25.2354C12.0367 24.1981 12.526 23.538 12.9174 23.1608C9.39449 22.7836 5.67584 21.4634 5.67584 15.5224C5.67584 13.825 6.263 12.5048 7.33945 11.3731C7.24159 11.0902 6.65443 9.48711 7.53517 7.41249C7.53517 7.41249 8.9052 7.03528 11.9388 9.01561C13.211 8.6384 14.581 8.5441 15.9511 8.5441C17.3211 8.5441 18.6911 8.7327 19.9633 9.01561C22.9969 7.03528 24.367 7.41249 24.367 7.41249C25.2477 9.48711 24.6605 11.0902 24.5627 11.4674C25.5413 12.5048 26.2263 13.9193 26.2263 15.6167C26.2263 21.5577 22.5076 22.7836 18.9847 23.1608C19.5719 23.6323 20.0612 24.5753 20.0612 25.9898C20.0612 28.0645 20.0612 29.6676 20.0612 30.2334C20.0612 30.6106 20.3547 31.0821 21.1376 30.9878C27.4985 28.9132 32 23.1608 32 16.3711C31.9021 7.88399 24.7584 1 15.9511 1Z" fill="#4360DF"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,6 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24.3333 8C28.5675 8 32 11.377 32 15.5428V28.7428C32 29.2361 31.7068 29.6838 31.2504 29.8876C30.7937 30.0914 30.258 30.0138 29.8809 29.6889L26.2151 26.5332C25.5163 25.9316 24.6191 25.6 23.6907 25.6H15.3889C11.8603 25.6 9 22.7858 9 19.3143V14.2857C9 10.8141 11.8603 8 15.3889 8H24.3333Z" fill="#A8B6F0"/>
<path d="M7.66667 0C3.43247 0 0 3.37703 0 7.54285V20.7428C0 21.2361 0.29324 21.6838 0.749634 21.8876C1.20634 22.0914 1.74197 22.0138 2.11913 21.6889L5.78494 18.5332C6.48372 17.9316 7.38091 17.6 8.3093 17.6H16.6111C20.1397 17.6 23 14.7858 23 11.3143V6.28571C23 2.81414 20.1397 0 16.6111 0H7.66667Z" fill="#4360DF"/>
<circle cx="15" cy="9" r="2" fill="white"/>
<circle cx="8" cy="9" r="2" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 818 B

View File

@ -0,0 +1,5 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.0275 18H5.5C2.46243 18 0 20.4624 0 23.5C0 26.5376 2.46243 29 5.5 29H18.5C20.1919 29 21.7054 28.2361 22.7143 27.0343C21.6702 26.2102 21 24.9334 21 23.5V23H20.5C18.0147 23 16 20.9853 16 18.5C16 18.331 16.0093 18.1642 16.0275 18ZM19.0752 18.0297C19.0264 18.1776 19 18.3357 19 18.5C19 19.3284 19.6716 20 20.5 20H22.7428C21.8488 18.9174 20.5484 18.1828 19.0752 18.0297Z" fill="#4360DF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M24 23.5C24 24.3284 24.6716 25 25.5 25C26.3284 25 27 24.3284 27 23.5V20H30.5C31.3284 20 32 19.3284 32 18.5C32 17.6716 31.3284 17 30.5 17H27V13.5C27 12.6716 26.3284 12 25.5 12C24.6716 12 24 12.6716 24 13.5V17H20.5C19.6716 17 19 17.6716 19 18.5C19 19.3284 19.6716 20 20.5 20H24V23.5Z" fill="#A8B6F0"/>
<circle cx="13" cy="8" r="5" fill="#4360DF"/>
</svg>

After

Width:  |  Height:  |  Size: 934 B

View File

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
<title>icon-next-white</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-Copy-26" transform="translate(-455.000000, -1231.000000)" fill="#4360DF">
<g id="Group-27" transform="translate(128.000000, 803.000000)">
<g id="Group-4" transform="translate(0.000000, 123.000000)">
<g id="Group-18" transform="translate(112.000000, 134.000000)">
<g id="icon-next-white" transform="translate(215.000000, 171.000000)">
<path d="M15.3769439,12.8065088 L11.3093738,16.8740788 C10.9178837,17.265569 10.2866583,17.2690746 9.89341138,16.8758277 C9.50288709,16.4853034 9.50857626,15.8464492 9.89516027,15.4598652 L13.2718377,12.0831878 L9.89516027,8.70651029 C9.50367009,8.31502012 9.50016443,7.6837948 9.89341138,7.29054784 C10.2839357,6.90002355 10.9227898,6.90571272 11.3093738,7.29229673 L15.3769439,11.3598668 C15.6033641,11.5862869 15.7000057,11.8928971 15.6651725,12.1872806 C15.6448364,12.4141916 15.5483154,12.6351373 15.3769439,12.8065088 Z" id="Shape"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -1,3 +0,0 @@
(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
},{}]},{},[1]);

View File

@ -1,15 +0,0 @@
{
"version": 3,
"sources": [
"node_modules/browser-pack/_prelude.js",
"src/js/main.js"
],
"names": [],
"mappings": "AAAA;ACAA;AACA",
"file": "generated.js",
"sourceRoot": "",
"sourcesContent": [
"(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c=\"function\"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error(\"Cannot find module '\"+i+\"'\");throw a.code=\"MODULE_NOT_FOUND\",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u=\"function\"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()",
"\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsImZpbGUiOiJtYWluLmpzIiwic291cmNlc0NvbnRlbnQiOltdfQ=="
]
}

View File

@ -1,22 +0,0 @@
$(document).ready(function () {
let url = 'https://our-status.ghost.io/ghost/api/v0.1/posts/?limit=3&formats=plaintext&client_id=ghost-frontend&client_secret=1c5590b47eb4';
$.ajax({
type: "get",
url: url,
success: function (response) {
$.each(response.posts, function (index, val) {
$('.contribute.blog:nth-child('+ (index+1) +') h3').text(val.title);
if(val.custom_excerpt != null) {
$('.contribute.blog:nth-child('+ (index+1) +') p').text(val.custom_excerpt);
}else{
$('.contribute.blog:nth-child('+ (index+1) +') p').text(getWords(val.plaintext));
}
});
}
});
function getWords(str) {
return str.split(/\s+/).slice(0,25).join(" ");
}
});

File diff suppressed because one or more lines are too long

View File

@ -1,21 +0,0 @@
(function() {
'use strict';
function changeLang() {
var lang = this.value;
var canonical = this.dataset.canonical;
if (lang === 'en') lang = '';
if (lang) lang += '/';
location.href = '/' + lang + canonical;
}
var langSelect = document.getElementById('lang-select');
if (langSelect) {
langSelect.addEventListener('change', changeLang);
}
var langSelectMobile = document.getElementById('mobile-lang-select');
if (langSelectMobile) {
langSelectMobile.addEventListener('change', changeLang);
}
}());

View File

@ -0,0 +1,192 @@
// let ScrollOver = require("./lib/ScrollOver.js")
// let animateScroll = require("./lib/animatescroll.js")
// let d3 = require("d3")
$(document).ready(function () {
var months = {'01':'Jan', '02':'Feb', '03':'Mar', '04':'Apr', '05':'May', '06':'Jun', '07':'Jul', '08':'Aug', '09':'Sep', '10':'Oct', '11':'Nov', '12':'Dec'};
let url = 'https://our.status.im/ghost/api/v0.1/posts/?order=published_at%20desc&limit=2&formats=plaintext&client_id=ghost-frontend&client_secret=2b055fcd57ba';
var urlBase = [location.protocol, '//', location.host, location.pathname].join('');
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
$(window).on('resize', function(event) {
w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
setMenu(w);
});
function setMenu(w) {
if (w < 1199) {
console.log("mobile")
$('#general-menu nav ul').appendTo('#general-menu-mobile nav');
} else {
$('#general-menu-mobile nav ul').appendTo('#general-menu nav');
};
}
setMenu(w);
$.ajax({
type: "get",
url: url,
success: function (response) {
response.posts = response.posts.reverse();
$.each(response.posts, function (index, val) {
var excerpt = '';
if(val.custom_excerpt != null) {
excerpt = val.custom_excerpt;
}else{
excerpt = getWords(val.plaintext);
}
var newDate = new Date(val.published_at);
var minutes = newDate.getMinutes();
minutes = minutes + "";
if(minutes.length == 1){
minutes = '0' + minutes;
}
$('.latest-posts').prepend(' \
<div class="post"> \
<time>'+ newDate.getDate() + ' ' + months[(newDate.getMonth()+1)] + ' at ' + newDate.getHours() + ':' + minutes + '</time> \
<h4><a href="https://our.status.im/'+ val.slug +'">'+ val.title +'</a></h3> \
</div> \
');
});
}
});
function getWords(str) {
return str.split(/\s+/).slice(0,25).join(" ");
}
});
let heroImage = document.querySelectorAll(".hero-image")[0]
if(heroImage) {
setTimeout(function(){
addClassToElement(heroImage, "active")
}, 200)
}
/* Popups */
let community = document.querySelectorAll(".has-popup-community")[0]
let projects = document.querySelectorAll(".has-popup-projects")[0]
let mobileMenu = document.querySelectorAll(".mobile-menu-trigger")[0]
let popups = document.querySelectorAll('.popup-wrap')
let overlays = document.querySelectorAll(".popup-overlay")
let popupMenu = document.querySelectorAll("#general-menu-mobile")[0]
let closeButtons = document.querySelectorAll(".popup__button--close,#general-menu-mobile .close")
let activePopup = null;
let activeOverlay = null;
community.addEventListener('click', function(event){
showPopup(popups[0])
event.preventDefault()
})
projects.addEventListener('click', function(event){
showPopup(popups[1])
event.preventDefault()
})
mobileMenu.addEventListener('click', function(event) {
showPopup(popupMenu)
event.preventDefault()
})
closeButtons.forEach((button) => {
button.addEventListener('click', closeActivePopup)
})
overlays.forEach((overlay) => {
overlay.addEventListener('click', closeActivePopup)
})
function showPopup(whichPopup) {
activePopup = whichPopup
addClassToElement(whichPopup, "popup--shown");
}
function closeActivePopup() {
console.log("test")
removeClassFromElement(activePopup, "popup--shown");
activePopup = null;
}
function closeMenu() {
removeClassFromElement(activePopup, "")
}
/* Code highlighting */
function highlight() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
}
$(document).ready(function() {
try {
highlight();
} catch(err) {
console.log("retrying...")
setTimeout(function() {
highlight();
}, 2500)
}
var clipboard = new ClipboardJS(".btn");
clipboard.on('success', function(e) {
var id = $(e.trigger).attr("data-clipboard-target");
$(id).toggleClass("flash");
setTimeout(function() {
$(id).toggleClass("flash");
}, 200);
e.clearSelection();
})
})
/* Mobile Nav */
/*
let moreLink = document.querySelectorAll(".item--more")[0]
let nav = document.querySelectorAll(".mobile-nav-wrap")[0]
let navOverlay = document.querySelectorAll(".mobile-nav-overlay")[0]
let navCloseButton = document.querySelectorAll(".mobile-nav-close")[0]
moreLink.addEventListener('click', function(event){
showNav()
event.preventDefault()
})
navCloseButton.addEventListener('click', closeNav)
navOverlay.addEventListener('click', closeNav)
function showNav() {
addClassToElement(nav, "mobile-nav--shown");
}
function closeNav() {
removeClassFromElement(nav, "mobile-nav--shown");
}
*/
/*--- Utils ---*/
function addClassToElement(element, className) {
(element.classList) ? element.classList.add(className) : element.className += ' ' + className
return element
}
function removeClassFromElement(element, className) {
if(element.classList) {
element.classList.remove(className)
} else {
element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ')
}
return element
}

View File

@ -1,30 +0,0 @@
$(document).ready(function() {
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
$(window).on('resize', function(event) {
w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
setMenu(w);
});
function setMenu(w) {
if (w < 1199) {
$('#general-menu nav ul').appendTo('#general-menu-mobile nav');
} else {
$('#general-menu-mobile nav ul').appendTo('#general-menu nav');
};
}
setMenu(w);
$('.mobile-menu-trigger, #general-menu-backdrop, #general-menu-mobile .close').on('click', function(event) {
event.preventDefault();
$('body').toggleClass('general-menu-open');
});
$('.has-popup-community, #popup-community .close, .general-popup-backdrop').on('click', function(event) {
event.preventDefault();
$('body').toggleClass('general-popup-open');
});
});

View File

@ -1,66 +0,0 @@
(function() {
/* global lunr */
'use strict';
var elements = document.getElementsByClassName('plugin');
var $count = document.getElementById('plugin-list-count');
var $input = document.getElementById('plugin-search-input');
var elementLen = elements.length;
var index = lunr.Index.load(window.SEARCH_INDEX);
function updateCount(count) {
$count.innerHTML = count + (count === 1 ? ' item' : ' items');
}
function addClass(elem, className) {
var classList = elem.classList;
if (!classList.contains(className)) {
classList.add(className);
}
}
function removeClass(elem, className) {
var classList = elem.classList;
if (classList.contains(className)) {
classList.remove(className);
}
}
function search(value) {
var result = index.search('*' + value + '* ' + value);
var len = result.length;
var selected = {};
var i = 0;
for (i = 0; i < len; i++) {
selected[result[i].ref] = true;
}
for (i = 0; i < elementLen; i++) {
if (selected[i]) {
addClass(elements[i], 'on');
} else {
removeClass(elements[i], 'on');
}
}
updateCount(len);
}
function displayAll() {
for (var i = 0; i < elementLen; i++) {
addClass(elements[i], 'on');
}
updateCount(elements.length);
}
$input.addEventListener('input', function() {
var value = this.value;
if (!value) return displayAll();
search(value);
});
}());

View File

@ -1,16 +0,0 @@
(function() {
'use strict';
var searchWrap = document.getElementById('search-input-wrap');
var searchInput = document.getElementById('search-input');
var className = 'active';
searchWrap.onclick = function(e) {
searchWrap.classList.add(className);
searchInput.focus();
};
searchInput.onblur = function(e) {
searchWrap.classList.remove(className);
};
}());

View File

@ -1,170 +0,0 @@
/**
* highlight.js Solidity syntax highlighting definition
*
* @see https://github.com/isagalaev/highlight.js
*
* :TODO:
* - fixed point numbers
* - `_` inside modifiers
* - assembly block keywords
*
* @package: highlightjs-solidity
* @author: Sam Pospischil <sam@changegiving.com>
* @since: 2016-07-01
*/
var module = module ? module : {}; // shim for browser use
function hljsDefineSolidity(hljs) {
var SOL_KEYWORDS = {
keyword:
'var bool string ' +
'int uint int8 uint8 int16 uint16 int24 uint24 int32 uint32 ' +
'int40 uint40 int48 uint48 int56 uint56 int64 uint64 ' +
'int72 uint72 int80 uint80 int88 uint88 int96 uint96 ' +
'int104 uint104 int112 uint112 int120 uint120 int128 uint128 ' +
'int136 uint136 int144 uint144 int152 uint152 int160 uint160 ' +
'int168 uint168 int176 uint176 int184 uint184 int192 uint192 ' +
'int200 uint200 int208 uint208 int216 uint216 int224 uint224 ' +
'int232 uint232 int240 uint240 int248 uint248 int256 uint256 ' +
'byte bytes bytes1 bytes2 bytes3 bytes4 bytes5 bytes6 bytes7 bytes8 ' +
'bytes9 bytes10 bytes11 bytes12 bytes13 bytes14 bytes15 bytes16 ' +
'bytes17 bytes18 bytes19 bytes20 bytes21 bytes22 bytes23 bytes24 ' +
'bytes25 bytes26 bytes27 bytes28 bytes29 bytes30 bytes31 bytes32 ' +
'enum struct mapping address ' +
'new delete ' +
'if else for while continue break return throw assert require revert ' +
'function modifier event ' +
'constant anonymous indexed ' +
'storage memory ' +
'external public internal pure view private returns ' +
'import using ' +
'contract interface library ' +
'assembly',
literal:
'true false ' +
'wei szabo finney ether ' +
'second seconds minute minutes hour hours day days week weeks year years',
built_in:
'self ' + // :NOTE: not a real keyword, but a convention used in storage manipulation libraries
'this super selfdestruct ' +
'now ' +
'msg ' +
'block ' +
'tx ' +
'sha3 sha256 ripemd160 erecover addmod mulmod ' +
// :NOTE: not really toplevel, but advantageous to have highlighted as if reserved to
// avoid newcomers making mistakes due to accidental name collisions.
'send call callcode delegatecall',
};
var SOL_NUMBER = {
className: 'number',
variants: [
{ begin: '\\b(0[bB][01]+)' },
{ begin: '\\b(0[oO][0-7]+)' },
{ begin: hljs.C_NUMBER_RE },
],
relevance: 0,
};
var SOL_FUNC_PARAMS = {
className: 'params',
begin: /\(/, end: /\)/,
excludeBegin: true,
excludeEnd: true,
keywords: SOL_KEYWORDS,
contains: [
hljs.C_LINE_COMMENT_MODE,
hljs.C_BLOCK_COMMENT_MODE,
hljs.APOS_STRING_MODE,
hljs.QUOTE_STRING_MODE,
SOL_NUMBER,
],
};
var SOL_RESERVED_MEMBERS = {
begin: /\.\s*/, // match any property access up to start of prop
end: /[^A-Za-z0-9$_\.]/,
excludeBegin: true,
excludeEnd: true,
keywords: {
built_in: 'gas value send call callcode delegatecall balance length push',
},
relevance: 2,
};
function makeBuiltinProps(obj, props) {
return {
begin: obj + '\\.\\s*',
end: /[^A-Za-z0-9$_\.]/,
excludeBegin: false,
excludeEnd: true,
keywords: {
built_in: obj + ' ' + props,
},
contains: [
SOL_RESERVED_MEMBERS,
],
relevance: 10,
};
}
return {
aliases: ['sol'],
keywords: SOL_KEYWORDS,
contains: [
// basic literal definitions
hljs.APOS_STRING_MODE,
hljs.QUOTE_STRING_MODE,
hljs.C_LINE_COMMENT_MODE,
hljs.C_BLOCK_COMMENT_MODE,
SOL_NUMBER,
{ // functions
className: 'function',
beginKeywords: 'function modifier event', end: /[{;]/, excludeEnd: true,
contains: [
hljs.inherit(hljs.TITLE_MODE, {
begin: /[A-Za-z$_][0-9A-Za-z$_]*/,
keywords: SOL_KEYWORDS,
}),
SOL_FUNC_PARAMS,
],
illegal: /\[|%/,
},
// built-in members
makeBuiltinProps('msg', 'data sender sig'),
makeBuiltinProps('block', 'blockhash coinbase difficulty gaslimit number timestamp '),
makeBuiltinProps('tx', 'gasprice origin'),
SOL_RESERVED_MEMBERS,
{ // contracts & libraries & interfaces
className: 'class',
beginKeywords: 'contract interface library', end: /[{]/, excludeEnd: true,
illegal: /[:"\[\]]/,
contains: [
{ beginKeywords: 'is' },
hljs.UNDERSCORE_TITLE_MODE,
SOL_FUNC_PARAMS,
],
},
{ // imports
beginKeywords: 'import', end: '[;$]',
keywords: 'import * from as',
contains: [
hljs.APOS_STRING_MODE,
hljs.QUOTE_STRING_MODE,
],
},
],
illegal: /#/,
};
}
module.exports = function(hljs) {
hljs.registerLanguage('solidity', hljsDefineSolidity);
};
module.exports.definer = hljsDefineSolidity;

View File

@ -1,34 +0,0 @@
(function() {
'use strict';
var header = document.getElementById('header');
if (!header) {
return;
}
var toc = document.getElementById('article-toc');
var tocTop = document.getElementById('article-toc-top');
var headerHeight = header.clientHeight;
if (!toc) return;
function updateSidebarPosition() {
var scrollTop = document.scrollingElement.scrollTop;
if (scrollTop > headerHeight) {
toc.classList.add('fixed');
} else {
toc.classList.remove('fixed');
}
}
window.addEventListener('scroll', function() {
window.requestAnimationFrame(updateSidebarPosition);
});
updateSidebarPosition();
tocTop.addEventListener('click', function(e) {
e.preventDefault();
document.scrollingElement.scrollTop = 0;
});
}());

View File

@ -0,0 +1,194 @@
(function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
// let ScrollOver = require("./lib/ScrollOver.js")
// let animateScroll = require("./lib/animatescroll.js")
// let d3 = require("d3")
$(document).ready(function () {
var months = { '01': 'Jan', '02': 'Feb', '03': 'Mar', '04': 'Apr', '05': 'May', '06': 'Jun', '07': 'Jul', '08': 'Aug', '09': 'Sep', '10': 'Oct', '11': 'Nov', '12': 'Dec' };
let url = 'https://our.status.im/ghost/api/v0.1/posts/?order=published_at%20desc&limit=2&formats=plaintext&client_id=ghost-frontend&client_secret=2b055fcd57ba';
var urlBase = [location.protocol, '//', location.host, location.pathname].join('');
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
$(window).on('resize', function (event) {
w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
setMenu(w);
});
function setMenu(w) {
if (w < 1199) {
console.log("mobile");
$('#general-menu nav ul').appendTo('#general-menu-mobile nav');
} else {
$('#general-menu-mobile nav ul').appendTo('#general-menu nav');
};
}
setMenu(w);
$.ajax({
type: "get",
url: url,
success: function (response) {
response.posts = response.posts.reverse();
$.each(response.posts, function (index, val) {
var excerpt = '';
if (val.custom_excerpt != null) {
excerpt = val.custom_excerpt;
} else {
excerpt = getWords(val.plaintext);
}
var newDate = new Date(val.published_at);
var minutes = newDate.getMinutes();
minutes = minutes + "";
if (minutes.length == 1) {
minutes = '0' + minutes;
}
$('.latest-posts').prepend(' \
<div class="post"> \
<time>' + newDate.getDate() + ' ' + months[newDate.getMonth() + 1] + ' at ' + newDate.getHours() + ':' + minutes + '</time> \
<h4><a href="https://our.status.im/' + val.slug + '">' + val.title + '</a></h3> \
</div> \
');
});
}
});
function getWords(str) {
return str.split(/\s+/).slice(0, 25).join(" ");
}
});
let heroImage = document.querySelectorAll(".hero-image")[0];
if (heroImage) {
setTimeout(function () {
addClassToElement(heroImage, "active");
}, 200);
}
/* Popups */
let community = document.querySelectorAll(".has-popup-community")[0];
let projects = document.querySelectorAll(".has-popup-projects")[0];
let mobileMenu = document.querySelectorAll(".mobile-menu-trigger")[0];
let popups = document.querySelectorAll('.popup-wrap');
let overlays = document.querySelectorAll(".popup-overlay");
let popupMenu = document.querySelectorAll("#general-menu-mobile")[0];
let closeButtons = document.querySelectorAll(".popup__button--close,#general-menu-mobile .close");
let activePopup = null;
let activeOverlay = null;
community.addEventListener('click', function (event) {
showPopup(popups[0]);
event.preventDefault();
});
projects.addEventListener('click', function (event) {
showPopup(popups[1]);
event.preventDefault();
});
mobileMenu.addEventListener('click', function (event) {
showPopup(popupMenu);
event.preventDefault();
});
closeButtons.forEach(button => {
button.addEventListener('click', closeActivePopup);
});
overlays.forEach(overlay => {
overlay.addEventListener('click', closeActivePopup);
});
function showPopup(whichPopup) {
activePopup = whichPopup;
addClassToElement(whichPopup, "popup--shown");
}
function closeActivePopup() {
console.log("test");
removeClassFromElement(activePopup, "popup--shown");
activePopup = null;
}
function closeMenu() {
removeClassFromElement(activePopup, "");
}
/* Code highlighting */
function highlight() {
$('pre code').each(function (i, block) {
hljs.highlightBlock(block);
});
}
$(document).ready(function () {
try {
highlight();
} catch (err) {
console.log("retrying...");
setTimeout(function () {
highlight();
}, 2500);
}
var clipboard = new ClipboardJS(".btn");
clipboard.on('success', function (e) {
var id = $(e.trigger).attr("data-clipboard-target");
$(id).toggleClass("flash");
setTimeout(function () {
$(id).toggleClass("flash");
}, 200);
e.clearSelection();
});
});
/* Mobile Nav */
/*
let moreLink = document.querySelectorAll(".item--more")[0]
let nav = document.querySelectorAll(".mobile-nav-wrap")[0]
let navOverlay = document.querySelectorAll(".mobile-nav-overlay")[0]
let navCloseButton = document.querySelectorAll(".mobile-nav-close")[0]
moreLink.addEventListener('click', function(event){
showNav()
event.preventDefault()
})
navCloseButton.addEventListener('click', closeNav)
navOverlay.addEventListener('click', closeNav)
function showNav() {
addClassToElement(nav, "mobile-nav--shown");
}
function closeNav() {
removeClassFromElement(nav, "mobile-nav--shown");
}
*/
/*--- Utils ---*/
function addClassToElement(element, className) {
element.classList ? element.classList.add(className) : element.className += ' ' + className;
return element;
}
function removeClassFromElement(element, className) {
if (element.classList) {
element.classList.remove(className);
} else {
element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
return element;
}
},{}]},{},[1])
//# sourceMappingURL=vendor.js.map

File diff suppressed because one or more lines are too long

View File

@ -1,3 +1,4 @@
@import url('https://rsms.me/inter/inter-ui.css');
@font-face {
font-family: 'Inter UI';
font-style: normal;
@ -53,42 +54,22 @@
}
// Config
support-for-ie = false
vendor-prefixes = webkit moz ms official
// Colors
color-default = #40444b
color-title = #000
color-gray = #777F86
color-border = #e3e3e3
color-navy = #363763
color-background = #ECF1F2
color-background-light = #fff
color-main-link = #fff
color-link = #4360df
color-link-hover = lighten(color-link, 10%)
// Typography
font-sans = "Inter UI", "Helvetica Neue", Helvetica, Arial, sans-serif
font-mono = "Inter UI", Monaco, Menlo, Consolas, monospace
font-title = "Inter UI", font-sans
font-size = 16px
line-height = 24px
$support-for-ie: false;
$vendor-prefixes: webkit moz ms official;
// Layout
max-width = 1200px
gutter-width = 20px
sidebar-width = 30%
mobile-nav-width = 260px
$max-width: 1200px;
$gutter-width: 20px;
$sidebar-width: 30%;
$mobile-nav-width: 260px;
// Media queries
mq-mobile = "screen and (max-width: 819px)"
mq-normal = "screen and (min-width: 820px)"
mq-tablet = "screen and (min-width: 480px)"
$mq-mobile: "screen and (max-width: 819px)";
$mq-normal: "screen and (min-width: 820px)";
$mq-tablet: "screen and (min-width: 480px)";
break-sm = 575px
break-md = 767px
break-lg = 991px
break-xl = 1199px
status = #4360df
incubate = #008BAD
$break-sm: 575;
$break-md: 767px;
$break-lg: 991px;
$break-xl: 1199px;
$status: #4360df;

View File

@ -0,0 +1,39 @@
.archive-post {
padding: 1em 0;
border-top: 1px solid $colorBorder;
&:last-child {
padding-bottom: 40px;
}
}
.archive-post-link {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
display: block;
color: $colorDefault;
text-decoration: none;
line-height: line-height;
&:hover {
color: $colorLinkHover;
}
}
.archive-post-title {
font-family: $FontTitle;
float: left;
font-weight: bold;
}
.archive-post-date {
color: $colorGray;
float: right;
font-size: 0.9em;
}

View File

@ -0,0 +1,83 @@
// skip global-reset()
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
button
input[type="reset"]
input[type="button"]
input[type="submit"] {
&::-moz-focus-inner {
padding: 0;
margin: 0;
border: 0;
}
}
input, button, select {
margin: 0;
padding: 0;
border: 0;
}
html, body {
@media screen {
height: 100%;
}
}
body {
background: $colorNavy;
font-size: font-size;
font-family: $FontSans;
color: $colorDefault;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
}
.wrapper {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
@media screen {
max-width: 1200px;
margin: 0 auto;
}
}
.inner {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
}
#content-wrap {
background: $colorWhite;
}
#content-wrap-apply {
background: $colorBg;
}

View File

@ -0,0 +1,23 @@
$colorBg: rgba(236, 241, 242, 1);
$colorWhite: rgba(255, 255, 255, 1);
$colorBlack: rgba(0, 0, 0, 1);
$colorBlue: rgba(67, 96, 223, 1);
$colorGray: rgba(119, 127, 134, 1);
$colorNavy: rgba(54, 55, 99, 1);
$colorDarkBlue: rgba(38, 42, 57, 1);
$colorBorder: rgba(227, 227, 227, 1);
$colorDefault: rgba(64, 68, 75, 1);
$colorLink: rgba(67, 96, 223, 1);
$colorLinkHover: lighten($colorLink, 10%);
$colorIncubate: rgba(0, 139, 173, 1);
$colorStatus: rgba(67, 96, 223, 1);
$colorIncubate: rgba(0,139,173,1);
$colorEmbark: rgba(54, 55, 99, 1);
$colorStudio: rgba(94, 193, 47, 1);
$colorNimbus: rgba(255, 156, 0, 1);
$colorHardwallet: rgba(127, 68, 223, 1);

View File

@ -0,0 +1,5 @@
@import url('https://rsms.me/inter/inter-ui.css');
$InterUI: "Inter UI", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
$FontTitle: "Inter UI", "Inter UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
$FontMono: "Inter UI", Monaco, Menlo, Consolas, monospace;
$FontSans: "Inter UI", "Helvetica Neue", Helvetica, Arial, sans-serif;

View File

@ -0,0 +1,286 @@
.footer {
width: 100%;
display: flex;
justify-content: center;
background-color: #262A39;
position: relative;
z-index: 998;
margin: 0 0 0 0;
}
.footer-inner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: 1200px;
padding: 32px 0;
}
.cards--community {
&.cards--community--dark {
margin: 0;
.card-inner {
background-color: transparent;
}
a {
h4 {
color: $colorWhite;
}
p {
color: $colorGray;
opacity: .7;
}
&:hover {
h4 {
opacity: 0.8;
}
}
}
}
}
.cards--community--dark {
.community-icon--join {
background-image: url(../img/icon-join-dark.svg);
}
.community-icon--discussion {
background-image: url(../img/icon-discussion-dark.svg);
}
.community-icon--contribute {
background-image: url(../img/icon-contribute-dark.svg);
}
}
.footer-nav {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
margin: 32px 0 0 0;
padding: 32px 0;
border-top: 1px solid rgba(255, 255, 255, .1);
li {
a {
padding: 0 12px;
color: $colorWhite;
&:hover {
opacity: .8;
}
}
}
}
.footer-logo-wrap {
width: 317px;
display: flex;
text-align: center;
}
.footer-logo-wrap__inner {
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
padding: 16px 0 16px 0;
}
a {
&.footer-logo {
display: block;
width: 52px;
height: 52px;
background-size: 52px;
background-image: url(../img/footer-logo.svg);
&:hover {
opacity: .8;
}
}
}
.footer-address {
padding: 20px 0 0 0;
color: #939ba1;
}
.footer-table {
display: flex;
}
.footer-table__column {
box-sizing: border-box;
padding: 32px 74px 64px
}
.footer-header {
color: white;
opacity: .5;
margin: 0 0 40px 0;
}
.footer-link {
height: 32px;
line-height: 32px;
margin: 0 0 15px 0;
a {
display: flex;
align-items: center;
color: white;
text-decoration: none;
&:hover {
opacity: .8;
}
}
}
.footer-icon {
display: inline-block;
width: 32px;
height: 32px;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 50%;
margin: 0 15px 0 0;
background-repeat: no-repeat;
background-size: 24px;
background-position: center;
}
.footer-link--fb .footer-icon {
background-image: url(../img/icon_fb.svg);
}
.footer-link--tw .footer-icon {
background-image: url(../img/icon_tw.svg);
}
.footer-link--ri .footer-icon {
background-image: url(../img/icon_ri.svg);
}
.footer-link--gh .footer-icon {
background-image: url(../img/icon_gh.svg);
}
.footer-link--rd .footer-icon {
background-image: url(../img/icon_rd.svg);
}
.footer-link--yt .footer-icon {
background-image: url(../img/icon_yt.svg);
}
.language-switcher {
color: white;
-webkit-appearance: none;
font-size: 16px;
line-height: 32px;
padding: 0 24px 0 0;
background-image: url(../img/new-site/icon_dropdown-white.svg);
background-size: 24px;
background-repeat: no-repeat;
background-position: right center;
&:focus {
outline: none;
}
}
@media (max-width: 1248px) {
.footer-inner {
width: 100%;
padding: 32px 24px;
}
.footer-logo-wrap {
//width: 200px;
}
}
@media (max-width: 960px) {
.cards--community
&.cards--community--dark
.card-inner {
height: auto;
min-height: 180px;
}
.footer-inner {
width: 820px;
justify-content: space-around;
}
}
@media (max-width: 800px) {
.cards--community
&.cards--community--dark {
margin: 0 auto;
max-width: 375px;
}
.card-inner {
padding: 0 12px;
}
}
@media (max-width: 767px) {
.footer {
border-top: 0px;
}
.footer-inner {
padding: 40px 0 0 0;
flex-direction: column;
}
.footer-header {
margin: 0 0 16px 0;
}
.footer-table {
flex-direction: column;
align-items: center;
justify-content: center;
}
.footer-table__column {
text-align: center;
padding: 16px 16px;
}
.footer-nav {
margin: 0 0 0 0;
}
.footer-link {
text-align: center;
height: 24px;
line-height: 24px;
margin: 0 0 16px 0;
a {
justify-content: center;
text-align: center;
}
}
.footer-icon {
display: none;
}
.footer-logo-wrap {
width: auto;
order: 2
}
.footer-logo-wrap__inner {
width: 100%;
padding: 32px 0 40px 0;
align-items: center;
text-align: center;
}
}

View File

@ -0,0 +1,153 @@
/* ----------------------------------------------------------------------------------------------------
Super Form Reset
A couple of things to watch out for:
- IE8: If a text input doesn't have padding on all sides or none the text won't be centered.
- The default border sizes on text inputs in all UAs seem to be slightly different. You're better off using custom borders.
- You NEED to set the font-size and family on all form elements
- Search inputs need to have their appearance reset and the box-sizing set to content-box to match other UAs
- You can style the upload button in webkit using ::-webkit-file-upload-button
- ::-webkit-file-upload-button selectors can't be used in the same selector as normal ones. FF and IE freak out.
- IE: You don't need to fake inline-block with labels and form controls in IE. They function as inline-block.
- By turning off ::-webkit-search-decoration, it removes the extra whitespace on the left on search inputs
----------------------------------------------------------------------------------------------------*/
input,
label,
select,
button,
textarea
{
margin:0;
border:0;
padding:0;
display:inline-block;
vertical-align:middle;
white-space:normal;
background:none;
line-height:1;
/* Browsers have different default form fonts */
font-size:13px;
font-family:Arial;
}
/* Remove the stupid outer glow in Webkit */
input:focus
{
outline:0;
}
/* Box Sizing Reset
-----------------------------------------------*/
/* All of our custom controls should be what we expect them to be */
input,
textarea
{
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}
/* These elements are usually rendered a certain way by the browser */
button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select
{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
/* Text Inputs
-----------------------------------------------*/
/* Button Controls
-----------------------------------------------*/
input[type=checkbox],
input[type=radio]
{
width:13px;
height:13px;
}
/* File Uploads
-----------------------------------------------*/
/* Search Input
-----------------------------------------------*/
/* Make webkit render the search input like a normal text field */
input[type=search]
{
-webkit-appearance:textfield;
-webkit-box-sizing:content-box;
}
/* Turn off the recent search for webkit. It adds about 15px padding on the left */
::-webkit-search-decoration
{
display:none;
}
/* Buttons
-----------------------------------------------*/
button,
input[type="reset"],
input[type="button"],
input[type="submit"]
{
/* Fix IE7 display bug */
overflow:visible;
width:auto;
}
.home-wrap, .pre-footer
.button, .community a.button
{
width: auto;
}
/* IE8 and FF freak out if this rule is within another selector */
::-webkit-file-upload-button
{
padding:0;
border:0;
background:none;
}
/* Textarea
-----------------------------------------------*/
textarea
{
/* Move the label to the top */
vertical-align:top;
/* Turn off scroll bars in IE unless needed */
overflow:auto;
}
/* Selects
-----------------------------------------------*/
select
{
}
select[multiple]
{
/* Move the label to the top */
vertical-align:top;
}

View File

@ -0,0 +1,265 @@
$header-padding-normal:10px;
$header-padding-max:30px;
$logo-size:50px;
#header {
position: relative;
padding: $header-padding-normal 0;
@media print {
display: none;
}
}
#header-inner {
display: flex;
flex-flow: row nowrap;
align-items: center;
width: 1190px;
margin-left: -120px;
@media mq-mobile {
justify-content: center;
}
}
.button--header {
margin-top: 7px;
}
#logo-wrap-page {
flex: 0;
-webkit-flex: none;
margin-top: 8px;
width: 200px;
}
#logo {
//hide-text()
text-indent: 101%;
white-space: nowrap;
overflow: hidden;
// end hide-text()
display: block;
width: 56px;
height: 56px;
background-image: url(../img/logo_white.svg);
text-decoration: none;
margin: -20px 0 0 30px;
background-color: #5EC12F;
border-radius: 50%;
background-size: 22px;
background-position: center;
background-repeat: no-repeat;
}
.dropdown {
display: flex;
align-items: center;
margin-left: 32px;
nav {
ul {
li {
float: left;
margin: 8px;
position: relative;
a {
color: #FFFFFF;
text-decoration: none;
font-weight: bold;
&:hover {
opacity: .7;
}
&:focus {
color: rgba(255, 255,255,1);
}
a {
color: rgba(255,255,255,0.7);
}
}
&:hover {
& > ul {
display: block;
z-index: 1;
}
}
ul {
background: #ffffff;
border-radius: 5px;
left: 0;
padding: 10px 5px 5px 5px;
position: absolute;
top: 100%;
li {
float: none;
width: 8.125em;
a {
&:hover {
color: #000;
}
}
}
}
}
}
}
}
.dropdown:before,
.dropdown:after {
clear: both;
content: "";
display: table;
}
.dropdown nav ul li ul li a:link,
.dropdown nav ul li ul li a:visited {
color: #8d99a4;
}
#search-input-wrap {
display: none;
height: 40px;
width: 180px;
background-color: #ff9c00;
border-radius: 22px;
padding: 0 12px;
align-items: center;
transition: 0.2s;
&.on {
display: flex;
@media mq-mobile {
width: 40px;
cursor: pointer;
&.standalone {
position: absolute;
right: 20px;
}
}
}
&.active {
width: 180px;
background-color: $colorWhite;
}
}
#search-input-icon {
color: rgba(255, 255, 255, 1);
height: 24px;
width: 24px;
margin: 0 2px 0 0;
display: inline-block;
opacity: 1;
@media mq-mobile {
height: auto;
}
}
#search-input-wrap.active #search-input-icon {
color: $colorNavy;
}
#search-input-wrap.active #search-input {
color: $colorNavy;
}
#search-input {
background: none;
width: 126px;
height: 24px;
font-size: 15px;
color: $colorWhite;
outline: none;
-webkit-appearance: none;
@media mq-mobile {
display: none;
}
}
#search-input-wrap.active #search-input {
display: inline;
}
#search-input::-webkit-input-placeholder {
color:rgba(255, 255, 255, .4);
}
#search-input::-moz-placeholder {
color:rgba(255, 255, 255, .4);
}
#search-input:-ms-input-placeholder {
color:rgba(255, 255, 255, .4);
}
#search-input:-moz-placeholder {
color:rgba(255, 255, 255, .4);
}
#search-input-wrap .algolia-autocomplete .ds-dropdown-menu {
@media (max-width: 560px) {
min-width: 400px;
}
@media (max-width: 470px) {
min-width: 300px;
}
}
#lang-select-wrap {
display: none;
position: relative;
@media mq-normal {
display: block;
}
}
#lang-select-label {
color: $colorWhite;
opacity: 0.7;
font-family: $FontTitle;
line-height: $logo-size;
span {
padding-left: 8px;
}
i {
opacity: 0.7;
}
}
#lang-select {
opacity: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-appearance: menulist-button;
font-size: inherit;
}
.site-specific-menu {
max-width: 1200px;
width: 100%;
padding: 11px 0 0 20px;
border-top: 1px solid rgba(0,0,0,0.08);
margin: 0 auto;
span {
padding-right: 24px;
}
}
.site-name {
font-weight: bold;
font-size: 18px;
color: #000;
text-decoration: none;
padding-right: 24px;
}
.specific-nav-link {
color: rgba(0,0,0,0.7);
font-size: 14px;
text-decoration: none;
}
.active {
color: $colorIncubate;
}

View File

@ -0,0 +1,134 @@
//highlight-background = #fff
$highlight-current-line: rgba(239, 239, 239, 1);
$highlight-selection: rgba(214, 214, 214, 1);
$highlight-foreground: rgba(77, 77, 76, 1);
$highlight-comment: rgba(142, 144, 140, 1);
$highlight-red: rgba(200, 40, 41, 1);
$highlight-orange: rgba(245, 135, 31, 1);
$highlight-yellow: rgba(234, 183, 0, 1);
$highlight-green: rgba(113, 140, 0, 1);
$highlight-aqua: rgba(62, 153, 159, 1);
$highlight-blue: rgba(66, 113, 174, 1);
$highlight-purple: rgba(137, 89, 168, 1);
pre, code {
font-family: $FontMono;
color: $highlight-foreground;
background: #eee;
font-size: 0.95em;
}
code {
padding: 0 5px;
}
pre {
padding: 10px 15px;
line-height: 22px;
code {
border: none;
display: block;
padding: 0;
}
}
.highlight {
background: #eee;
padding: 10px 15px;
color: $highlight-foreground;
overflow: auto;
margin: 0;
table {
margin: 0 !important;
border: 0;
th, td {
padding: 0;
}
}
figcaption {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
margin: -5px 0 5px;
font-size: 0.9em;
color: $colorGray;
a {
float: right;
}
}
pre {
padding: 0;
border: none;
background: none;
}
.line {
height: 22px;
}
}
pre {
.comment
.title {
color: $highlight-comment;
}
.variable
.attribute
.tag
.regexp
.ruby .constant
.xml .tag .title
.xml .pi
.xml .doctype
.html .doctype
.css .id
.css .class
.css .pseudo {
color: $highlight-red;
}
.number
.preprocessor
.built_in
.literal
.params
.constant {
color: $highlight-orange;
}
.class
.ruby .class .title
.css .rules .attribute {
color: $highlight-green;
}
.string
.value
.inheritance
.header
.ruby .symbol
.xml .cdata {
color: $highlight-green;
}
.css .hexcolor {
color: $highlight-aqua;
}
.function
.python .decorator
.python .title
.ruby .function .title
.ruby .title .keyword
.perl .sub
.javascript .title
.coffeescript .title {
color: $highlight-blue;
}
.keyword
.javascript .function {
color: $highlight-purple;
}
}

View File

@ -0,0 +1,152 @@
#banner {
color: rgba(255, 255, 255, 1.0);
text-align: center;
}
#banner-title {
padding-top: 20px;
font-size: 40px;
line-height: 1.15;
font-weight: 300;
font-family: $FontTitle;
@media mq-normal {
padding-top: 100px;
font-size: 50px;
}
}
#banner-start {
text-align: center;
padding: 40px 0;
@media mq-normal {
padding: 60px 0;
font-size: 18px;
}
}
#banner-start-command {
background: lighten($colorNavy, 10%);
font-family: $FontMono;
display: inline-block;
padding: 15px 20px;
&:before {
content: "$";
opacity: 0.5;
padding-right: 10px;
}
}
#banner-start-link {
color: #fff;
background: $colorLink;
display: inline-block;
padding: 15px;
text-decoration: none;
transition: 0.2s;
&:hover {
background: $colorLinkHover;
}
}
#banner-share {
display: none;
padding-bottom: 60px;
@media mq-normal {
display: block;
}
}
#intro-feature-list {
padding-top: 20px;
display: flex;
flex-flow: column;
@media mq-normal {
flex-flow: row wrap;
}
}
.intro-feature-wrap {
padding-top: 20px;
@media mq-normal {
flex: 0 0 50%;
padding-top: 50px;
}
}
.intro-feature {
position: relative;
text-align: center;
@media mq-normal {
text-align: left;
padding-left: 70px;
}
}
.intro-feature-icon {
color: $colorLink;
font-size: 36px;
padding-bottom: 26px;
text-align: center;
@media mq-normal {
position: absolute;
top: 0;
left: 20px;
font-size: 24px;
width: 36px;
}
}
.intro-feature-title {
color: $colorLink;
font-family: $FontTitle;
font-size: 24px;
}
.intro-feature-desc {
margin: line-height 0;
line-height: line-height;
}
#intro-cmd-wrap {
max-width: 700px;
background: #eee;
padding: 15px 0;
margin: 25px -40px 0;
@media mq-normal {
margin: 50px auto 0;
}
}
.intro-cmd-item {
font-size: 16px;
font-family: $FontMono;
line-height: 2;
padding: 0 30px;
&:before {
content: "$";
color: $colorLink;
padding-right: 15px;
}
}
#intro-get-started-wrap {
text-align: center;
}
#intro-get-started-link {
font-size: 18px;
font-family: $FontTitle;
display: inline-block;
color: $colorLink;
text-decoration: none;
margin: 40px 0;
border: 3px solid;
border-color: lighten($colorLink, 20%);
padding: 12px 24px;
position: relative;
transition: 0.2s;
&:hover {
background: border-color;
color: #fff;
}
}

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,164 @@
$toggle-width: 25px;
$toggle-height: $toggle-width * 0.8;
$toggle-line: 2px;
$transition-duration: 0.4s;
$lang-select-height: 40px;
.mobile-menu-container {
display: none;
}
#mobile-nav {
position: fixed;
top: 0;
width: $mobile-nav-width;
left: $mobile-nav-width * -1;
height: 100%;
background: $colorNavy;
transition: transition-duration;
font-family: $FontTitle;
.mobile-nav-on & {
transform: translateX(100%);
}
}
#mobile-nav-inner {
overflow-y: auto;
padding: 10px 0;
position: absolute;
top: 0;
bottom: $lang-select-height;
left: 0;
right: 0;
-webkit-overflow-scrolling: touch;
}
#mobile-nav-toggle {
position: absolute;
top: 0;
bottom: 0;
left: $gutter-width;
width: $toggle-width;
height: $toggle-height;
margin: auto;
opacity: 0.5;
cursor: pointer;
transition: 0.2s;
&:active, .mobile-nav-on & {
opacity: 1;
}
@media mq-normal {
display: none;
}
}
.mobile-nav-toggle-bar {
background: #fff;
position: absolute;
left: 0;
width: 100%;
height: $toggle-line;
transition: transition-duration;
transform-origin: 0;
border-radius: $toggle-line;
&:first-child {
top: 0;
.mobile-nav-on & {
transform: rotate(45deg);
}
}
&:nth-child(2) {
top: ($toggle-height - $toggle-line) * 0.5;
.mobile-nav-on & {
opacity: 0;
}
}
&:last-child {
top: $toggle-height - $toggle-line;
.mobile-nav-on & {
transform: rotate(-45deg);
}
}
}
.mobile-nav-link {
color: #fff;
text-decoration: none;
display: block;
padding: 10px 15px;
line-height: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mobile-nav-title {
color: $colorLink;
font-weight: bold;
padding: 10px 15px;
line-height: 1;
display: block;
border-top: 1px solid #444;
margin-top: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#mobile-lang-select-wrap {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: $colorNavy;
border-top: 1px solid #444;
}
#mobile-lang-select-label {
line-height: $lang-select-height;
color: #fff;
padding: 10px 15px;
i {
opacity: 0.7;
}
span {
padding-left: 8px;
}
}
#mobile-lang-select {
-webkit-appearance: menulist-button;
opacity: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#container {
transition: transition-duration;
height: 100%;
// overflow: auto
-webkit-overflow-scrolling: touch;
.mobile-nav-on & {
transform: translateX(mobile-nav-width);
overflow: hidden;
}
}
#mobile-nav-dimmer {
position: absolute;
top: 0;
left: 100%;
height: 100%;
background: #000;
opacity: 0;
transition: opacity transition-duration, transform 0s transition-duration;
.mobile-nav-on & {
width: 100%;
opacity: 0.7;
transform: translateX(-100%);
transition: opacity transition-duration;
}
}

View File

@ -0,0 +1,555 @@
$note-tip: hsl(40, 100%, 50%);
$note-info: hsl(200, 100%, 50%);
$note-warn: hsl(0, 100%, 50%);
$sidebar-width:30%;
#content {
//clearfix()
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
position: relative;
}
#content-apply {
// start clearfix()
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
position: relative;
background: #fff;
border-radius: 10px;
padding: 64px;
margin-top: 40px;
}
#content-inner {
display: flex;
}
#content-inner-full {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
@media mq-normal {
margin-left: 0;
}
}
.article-container {
@media mq-normal {
float: right;
width: 100%;
}
}
.article-inner {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
}
.article {
float: left;
width: 100%;
padding: 20px 0;
@media print {
padding: 0;
}
}
#article-toc {
display: none;
float: right;
width: $sidebar-width;
margin-right: $sidebar-width * -1;
opacity: 0.8;
@media mq-normal {
display: block;
}
@media screen and (max-width: 1450px) {
display: none;
}
&.fixed {
position: absolute;
top: 0;
bottom: 0;
right: 0;
}
}
#article-toc-inner {
@extend .inner;
overflow-x: hidden;
overflow-y: auto;
width: $sidebar-width;
&.fixed {
position: absolute;
top: 0;
bottom: 0;
right: 0;
}
}
.toc-link {
@extend .sidebar-link;
}
.toc-child {
padding-left: 1em;
font-size: 0.9em;
}
#article-toc-top {
margin-top: 2em;
font-size: 0.9em;
text-decoration: none;
color: $colorDefault;
display: block;
margin-bottom: 40px;
font-family: $FontTitle;
&:hover {
color: $colorLinkHover;
}
}
.article-header {
max-width: 1200px;
margin: 150px auto 20px;
display: flex;
justify-content: space-between;
@media mq-mobile {
padding: 0 20px;
}
}
.article-title {
font-family: $FontTitle;
font-size: 26px;
line-height: 32px;
font-weight: 300;
text-decoration: none;
font-weight: bold;
font-size: 25px;
color: #000;
transition: 0.2s;
.post & {
float: none;
}
}
.article-date {
color: $colorGray;
text-decoration: none;
display: inline-block;
margin-top: 1em;
&:hover {
color: $colorLinkHover;
}
}
.article-edit-link {
font-style: normal;
font-weight: normal;
line-height: normal;
font-size: 15px;
color: $colorIncubate;
display: none;
align-items: flex-end;
text-decoration: none;
@media mq-normal {
display: flex;
}
&:hover {
opacity: 0.7;
}
}
@media screen and (min-width: 820px) {
.article-edit-link {
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: box;
display: flex;
}
}
.article-anchor {
margin-left: 10px;
display: none;
@media print {
display: none !important;
}
&:before {
content: "#";
}
.article-heading:hover & {
display: inline-block;
}
}
.article-content-apply {
max-width: 1200px !important;
}
.article-content {
line-height: line-height;
color: $colorDefault;
max-width: 800px;
@media print {
font-size: 12pt;
}
@media mq-mobile {
padding: 0 20px;
}
p, ol, ul, dl, table, blockquote, iframe, .highlight {
margin: 12px 0;
}
h1 {
font-size: 26px;
}
h2 {
font-size: 20px;
}
h3 {
font-size: 16px;
}
h1, h2, h3, h4, h5, h6 {
font-weight: bold;
margin: 32px 0;
color: #000000;
}
a {
color: $colorIncubate;
text-decoration: none;
&:hover {
color: $colorLinkHover;
text-decoration: underline;
}
@media print {
color: $colorDefault;
text-decoration: underline;
&:after {
content: " (" attr(href) ")";
font-size: 80%;
}
}
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
ul, ol, dl {
margin-left: 20px;
ul, ol, dl {
margin-top: 0;
margin-bottom: 0;
}
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
dl {
list-style: square;
}
li {
p {
margin: 0;
}
table, blockquote, iframe, .highlight {
margin: 1em 0;
}
}
img, video {
max-width: 100%;
width: 70px;
height: 70px;
}
blockquote {
padding: 0 20px;
position: relative;
border: 1px solid $colorBorder;
border-left: 5px solid #ddd;
footer {
margin: 1em 0;
font-style: italic;
cite {
&:before {
content: "";
padding: 0 0.3em;
}
a {
color: $colorGray;
}
}
}
}
.note {
&.tip {
border-left-color: $note-tip;
}
&.info {
border-left-color: $note-info;
}
&.warn {
border-left-color: $note-warn;
}
}
.note-title {
margin: 1em 0;
display: block;
font-size: 1.3em;
font-weight: bold;
}
table {
max-width: 100%;
border: 1px solid $colorBorder;
th {
font-weight: bold;
}
th, td {
padding: 5px 15px;
}
tr {
&:nth-child(2n) {
background: #eee;
}
}
}
}
.article-footer {
//clearfix()
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearix()
margin: 1em 0;
border-top: 1px solid $colorBorder;
text-align: center;
color: color-gray;
line-height: 1em;
padding-top: 1em;
position: relative;
background: transparent;
@media print {
display: none;
}
}
.article-footer-link {
color: $colorLink;
text-decoration: none;
font-weight: bold;
font-family: $FontTitle;
text-transform: uppercase;
position: absolute;
@media print {
display: none;
}
&:hover {
color: $colorLinkHover;
}
span {
padding: 0 6px;
}
}
.article-footer-prev {
@extend .article-footer-link;
left: 0;
}
.article-footer-next {
@extend .article-footer-link;
right: 0;
}
.article-footer-updated {
font-size: 0.9em;
}
#comments {
@media print {
display: none;
}
}
#page-list-header {
//clearfix();
&:before
&:after {
content: "";
display: table;
}
&:after {
clear: both;
}
// end clearfix()
margin: 40px 0;
}
#page-list-title {
font-family: $FontTitle;
font-size: 36px;
font-weight: 300;
line-height: 1;
float: left;
}
.team-member {
float: left;
width: 33%;
text-align: center;
padding: 20px 0;
@media mq-mobile {
width: 50%;
}
@media (max-width: 491px) {
width: 100%;
padding: 0;
}
h4 {
font-size: 16px;
}
p {
color: #939BA1;
font-size: 16px;
}
}
.submission-list {
list-style: circle !important;
margin-bottom: 100px !important;
li {
padding: 10px 0;
}
}
.projects-intro {
margin-top: 32px;
}
.project-wrap {
display: table-row;
}
.project {
width: calc(50% - 30px);
margin-right: 30px;
}
.project2 {
width: 50%;
}
.project-apply {
text-align: center;
}
.project, .project2 {
float: left;
padding: 32px;
border: 1px solid rgba(0, 0, 0, 0.1);
box-sizing: border-box;
border-radius: 10px;
margin-bottom: 30px;
margin-top: 30px;
height: 370px;
img {
margin: 3px 0px 15px;
}
h4, h3 {
font-weight: bold;
font-size: 20px;
color: #000000;
margin: 12px 0;
}
h3 {
margin: 100px 0 28px 0;
}
p {
line-height: 25px;
font-size: 16px;
color: #000000;
}
a {
background: rgba(0,139,173,0.1);
border-radius: 20px;
color: rgb(0,139,173);
padding: 12px 24px;
text-decoration: none;
margin-top: 20px;
&:hover {
color: rgb(255,255,255);
background: rgb(0,139,173);
}
}
}
.project-cover-link {
color: #fff !important;
background: none !important;
padding: 0 !important;
margin-top: 0 !important;
}
@media (max-width: 491px) {
.project, .project2 {
width: 95%;
margin: 20px 10px;
height: 450px;
h3 {
margin: 140px 0 28px 0;
}
}
.projects-intro {
padding-left: 20px;
}
}

View File

@ -0,0 +1,279 @@
.popup-wrap {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: auto;
box-sizing: border-box;
z-index: 700;
visibility: hidden;
pointer-events: none;
}
.popup-wrap.popup--shown {
visibility: visible;
pointer-events: all;
}
.popup-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(120, 135, 148, .25);
z-index: 800;
opacity: 0;
transform: translate3d(0, 0 ,0) scale(1);
visibility: hidden;
transition: visibility .5s linear 0s, opacity .2s ease;
}
.popup--shown .popup-overlay {
transition-delay: 0s;
visibility: visible;
opacity: 1;
transform: translate3d(0, 0 ,0) scale(1);
}
.popup {
box-sizing: border-box;
width: 960px;
margin: 132px auto 40px;
background-color: rgba(255, 255, 255, 1);
border-radius: 10px;
padding: 0px;
position: relative;
box-shadow: 0 3px 7px 0 rgba(175,192,202,0.41);
z-index: 900;
opacity: 0;
transform: translate3d(0, 15px ,0) scale(.96);
visibility: hidden;
transition-delay: .2s;
transition: visibility .5s linear 0s, opacity .2s ease, transform .4s cubic-bezier(0.175, 0.885, 0.135, 1.425);
}
.popup--shown .popup {
transition-delay: 0s;
visibility: visible;
opacity: 1;
transform: translate3d(0, 0 ,0) scale(1);
}
.popup__title {
padding: 32px 0 12px 32px;
}
.popup__inner {
padding: 0 32px 32px 32px;
}
.popup__text {
font-size: 18px;
line-height: 26px;
padding: 0 32px 24px 32px;
color: #70808D;
}
.popup__button {
position: absolute;
top: -69px;
width: 42px;
height: 42px;
background-color: #ffffff;
border-radius: 50%;
opacity: .7;
cursor: pointer;
transition: opacity .2s ease;
}
.popup__button:hover {
opacity: 1
}
.popup__button::after {
content: "";
display: block;
position: absolute;
top: 13px;
left: 13px;
width: 16px;
height: 16px;
background-size: 16px;
background-repeat: no-repeat;
}
.popup__button.popup__button--close {
right: 0;
}
.popup__button.popup__button--close::after {
background-image: url(../img/icon-close.svg);
}
.cards--community {
margin: 0 0 52px 0;
}
.cards--community .card-inner {
height: auto;
min-height: 170px;
display: flex;
align-items: center;
flex-direction: column;
text-align: center;
padding: 24px;
background-color: rgba(67, 96, 223, .1);
border-radius: 16px;
margin: 12px;
text-decoration: none;
}
.cards--community .card-inner:hover {
background-color: rgba(67, 96, 223, .14);
}
.popup .card h4 {
padding: 0 0 4px 0;
}
.cards--community a h4 {
color: $colorBlack;
padding: 0 0 8px 0;
}
.cards--community a p {
color: rgba(67, 96, 223, .6);
}
.separator {
border-bottom: 1px solid #e8ebec;
width: 100%;
height: 1px;
background-color: transparent;
}
.popup--projects .separator {
margin: 32px 0;
}
.community-icon {
width: 32px;
height: 32px;
background-size: 32px;
background-repeat: no-repeat;
margin: 0 0 24px 0;
}
.community-icon--join {
background-image: url(../img/icon-join-blue.svg);
}
.community-icon--discussion {
background-image: url(../img/icon-discussion-blue.svg);
}
.community-icon--contrubute {
background-image: url(../img/icon-contribute-blue.svg);
}
.popup--community h5,
.popup--projects h5 {
padding: 0 0 24px 0;
}
.cards-community-more .card-content {
height: auto;
min-height: 112px;
overflow: hidden;
}
.popup--projects .cards-community-more .card-content {
height: auto;
min-height: 142px;
overflow: hidden;
}
@media (max-width: 1008px) {
.popup-wrap {
padding: 0 24px;
}
.popup {
width: 100%;
}
.card-community-more__link {
margin: 8px 0 0 0;
}
}
@media (max-width: 800px) {
.cards--community {
margin: 0 0 40px 0
}
.popup--community h5 {
padding-bottom: 16px;
}
.cards--community.cards--community--light .card-inner {
height: auto;
min-height: 0
}
.cards-community-more .card-content {
height: auto;
min-height: 0;
padding: 0 0 8px 0;
}
.popup--projects .cards-community-more .card-content {
height: auto;
min-height: 0;
padding: 0 0 8px 0;
}
.cards-community-more .card-content h4 {
padding: 8px 0 4px 0;
}
.popup__inner {
padding: 0 24px 24px 24px;
}
.popup__title {
font-size: 18px;
padding: 24px 0 12px 24px;
}
}
@media (max-width: 600px) {
.popup-wrap {
padding: 0 16px;
}
.popup {
margin: 96px auto 64px;
}
.popup__text {
font-size: 16px;
line-height: 24px;
padding: 0 16px 16px 16px;
}
}

View File

@ -0,0 +1,47 @@
$sidebar-width:30%;
#sidebar {
min-width: $sidebar-width;
padding: 40px 0;
.inner {
padding: 0;
&:before {
display: none;
}
strong {
display: none;
}
}
}
.sidebar-title {
margin-top: 40px;
padding: 10px 0;
font-family: $InterUI;
font-weight: bold;
color: $colorBlack;
display: inline-block;
border-top: 1px solid #e3e3e3;
line-height: 1;
}
.sidebar-link {
border-radius: 23.5px;
font-size: 15px;
padding: 9px 24px;
display: block;
margin-bottom: 10px;
position: relative;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
cursor: pointer;
color: #000;
text-decoration: none;
line-height: normal;
&:hover {
background: rgba(67,96,223,0.1);
color: #4360DF;
}
}