Switch to SCSS

This commit is contained in:
Calinou 2015-09-25 16:12:27 +02:00
parent 8141c0890d
commit c2402b91d9
18 changed files with 246 additions and 246 deletions

View File

@ -1,23 +0,0 @@
module.exports = function(grunt) {
grunt.initConfig({
watch: {
files: ["assets/css/stylus/*.styl"],
tasks: ["stylus"]
},
stylus: {
"assets/css/main.min.css": ["assets/css/stylus/*.styl"],
options: {
globals: {
compress: true
}
}
},
});
grunt.loadNpmTasks("grunt-contrib-stylus");
grunt.loadNpmTasks("grunt-contrib-watch");
grunt.registerTask("default", ["stylus"]);
};

View File

@ -1,6 +1,6 @@
# minetest.github.io # www.minetest.net
The official Minetest website, living at [minetest.net](http://minetest.net). The official Minetest website, living at [www.minetest.net](http://www.minetest.net).
# Features # Features
@ -13,15 +13,12 @@ The official Minetest website, living at [minetest.net](http://minetest.net).
# Workflow # Workflow
This site uses the [Jekyll](http://jekyllrb.com) static site generator as well This site uses the [Jekyll](http://jekyllrb.com) static site generator.
as the [Stylus](http://learnboost.github.io/stylus/) CSS preprocessor. Use `jekyll serve` to automatically build the Jekyll site and serve it locally.
* Use `jekyll serve` to automatically build the Jekyll site and serve it locally.
* Use `grunt watch` to compile Stylus files automatically. The Stylus files are
located in `css/stylus`.
# License # License
Copyright (c) 2015 Calinou and contributors Copyright © 2015 Calinou and contributors
Code is under the MIT license, media and content under [CC BY-SA 3.0 Unported](https://creativecommons.org/licenses/by-sa/3.0/). Code is under the MIT license, media and content under [CC BY-SA 3.0 Unported](https://creativecommons.org/licenses/by-sa/3.0/).

View File

@ -1,9 +1,9 @@
permalink: pretty permalink: pretty
gems: gems:
- jekyll-redirect-from - jekyll-redirect-from
sass:
style: compressed
exclude: exclude:
- Gruntfile.js
- CNAME - CNAME
- README.md - README.md
- LICENSE.md - LICENSE.md
- package.json

View File

@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ page.title }} - Minetest</title> <title>{{ page.title }} - Minetest</title>
<link rel="stylesheet" href="/lib/css/bootstrap.min.css"> <link rel="stylesheet" href="/lib/css/bootstrap.min.css">
<<<<<<< HEAD
<script> <script>
Origami.fastclick(document.body); // FastClick Origami.fastclick(document.body); // FastClick
$(document).ready(function() { $(document).ready(function() {
@ -13,6 +14,9 @@
$.goup(); // jQuery GoUp $.goup(); // jQuery GoUp
}); });
</script> </script>
=======
<link rel="stylesheet" href="/assets/css/main.css">
>>>>>>> 49032e690f88e53d7524c41ca39396a9aced953c
<link rel="apple-touch-icon" sizes="57x57" href="/media/favicon/57x57.png"> <link rel="apple-touch-icon" sizes="57x57" href="/media/favicon/57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/media/favicon/60x60.png"> <link rel="apple-touch-icon" sizes="60x60" href="/media/favicon/60x60.png">

32
_sass/_content.scss Normal file
View File

@ -0,0 +1,32 @@
// Content margins and link styling
.content {
margin: 0 20%;
a {
color: hsl(100, 40%, 40%);
text-decoration: none;
transition: .15s;
&:hover,
&:focus {
color: hsl(100, 30%, 30%);
text-decoration: underline;
}
&:active {
color: hsl(0, 0, 0);
}
}
}
@media (max-width 992px) {
.content { margin: 0 10%; }
}
@media (max-width 768px) {
.content { margin: 0 5%; }
}
@media (max-width 480px) {
.content { margin: 0 2%; }
}

31
_sass/_fonts.scss Normal file
View File

@ -0,0 +1,31 @@
// Fonts
@font-face {
font-family: "Titillium Web Regular";
font-weight: 500;
src: local("Titillium Web Regular"),
url("../fonts/titilliumweb/TitilliumWeb-Regular.ttf");
}
@font-face {
font-family: "Titillium Web Italic";
font-style: "italic";
font-weight: 500;
src: local("Titillium Web Italic"),
url("../fonts/titilliumweb/TitilliumWeb-Italic.ttf");
}
@font-face {
font-family: "Titillium Web Bold";
font-weight: 700;
src: local("Titillium Web Bold"),
url("../fonts/titilliumweb/TitilliumWeb-Bold.ttf");
}
@font-face {
font-family: "Titillium Web Bold Italic";
font-style: "italic";
font-weight: 700;
src: local("Titillium Web Bold Italic"),
url("../fonts/titilliumweb/TitilliumWeb-BoldItalic.ttf");
}

26
_sass/_footer.scss Normal file
View File

@ -0,0 +1,26 @@
// Footer
footer {
background-color: hsl(0, 0, 18%);
color: hsl(0, 0, 60%);
text-align: center;
padding: 3rem 0;
margin-top: 3rem;
a {
color: hsl(0, 0, 90%);
text-decoration: none;
transition: .15s;
&:hover,
&:focus {
color: hsl(0, 0, 80%);
text-decoration: underline;
}
&:active {
color: hsl(0, 0, 50%);
text-decoration: underline;
}
}
}

49
_sass/_jumbotron.scss Normal file
View File

@ -0,0 +1,49 @@
// jumbotron.styl: Jumbotron
.jumbotron {
background-image: url("../../media/background-home.jpg");
background-size: cover;
border-radius: 0 !important;
color: #fff;
padding-top: 25vh;
margin: 0 -15px !important;
height: 100vh;
min-height: 60rem;
text-shadow: 0 0 .5rem #000;
.btn {
margin: 4rem 4rem 0 4rem;
font-size: 2rem;
transition: .15s;
}
&.reduced {
padding-top: 5rem;
height: 25vh;
min-height: 30rem;
}
&.downloads {
background-image: url("../../media/background-downloads.jpg");
}
&.community {
background-image: url("../../media/gallery/1.jpg");
}
&.credits {
background-image: url("../../media/gallery/2.jpg");
}
&.customize {
background-image: url("../../media/gallery/3.jpg");
}
&.irc {
background-image: url("../../media/gallery/4.jpg");
}
&.development {
background-image: url("../../media/gallery/5.jpg");
}
}

14
_sass/_navbar.scss Normal file
View File

@ -0,0 +1,14 @@
// Navigation bar
.navbar {
box-shadow: 0 0 1rem #000;
}
.navbar-brand {
font-weight: 700;
color: hsl(100, 35%, 45%) !important;
img {
margin-top: -1.7rem;
}
}

View File

@ -1,6 +0,0 @@
.content{margin:0 20%;}.content a{color:#588f3d;text-decoration:none;transition:.15s;}.content a:hover,.content a:focus{color:#456336;text-decoration:underline}.content a:active{color:#000}@media (max-width:992px){.content{margin:0 10%}}@media (max-width:768px){.content{margin:0 5%}}@media (max-width:480px){.content{margin:0 2%}}
@font-face{font-family:"Titillium Web Regular";font-weight:500;src:local("Titillium Web Regular"),url("../fonts/titilliumweb/TitilliumWeb-Regular.ttf")}@font-face{font-family:"Titillium Web Italic";font-style:"italic";font-weight:500;src:local("Titillium Web Italic"),url("../fonts/titilliumweb/TitilliumWeb-Italic.ttf")}@font-face{font-family:"Titillium Web Bold";font-weight:700;src:local("Titillium Web Bold"),url("../fonts/titilliumweb/TitilliumWeb-Bold.ttf")}@font-face{font-family:"Titillium Web Bold Italic";font-style:"italic";font-weight:700;src:local("Titillium Web Bold Italic"),url("../fonts/titilliumweb/TitilliumWeb-BoldItalic.ttf")}
footer{background-color:#2e2e2e;color:#999;text-align:center;padding:3rem 0;margin-top:3rem;}footer a{color:#e6e6e6;text-decoration:none;transition:.15s;}footer a:hover,footer a:focus{color:#ccc;text-decoration:underline}footer a:active{color:#808080;text-decoration:underline}
.jumbotron{background-image:url("../../media/background-home.jpg");background-size:cover;border-radius:0 !important;color:#fff;padding-top:25vh;margin:0 -15px !important;height:100vh;min-height:60rem;text-shadow:0 0 .5rem #000;}.jumbotron .btn{margin:4rem 4rem 0 4rem;font-size:2rem;transition:.15s}.jumbotron.reduced{padding-top:5rem;height:25vh;min-height:30rem}.jumbotron.downloads{background-image:url("../../media/background-downloads.jpg")}.jumbotron.community{background-image:url("../../media/gallery/1.jpg")}.jumbotron.credits{background-image:url("../../media/gallery/2.jpg")}.jumbotron.customize{background-image:url("../../media/gallery/3.jpg")}.jumbotron.irc{background-image:url("../../media/gallery/4.jpg")}.jumbotron.development{background-image:url("../../media/gallery/5.jpg")}
@font-face{font-family:"Titillium Web Regular";font-weight:500;src:local("Titillium Web Regular"),url("../fonts/titilliumweb/TitilliumWeb-Regular.ttf")}@font-face{font-family:"Titillium Web Italic";font-style:"italic";font-weight:500;src:local("Titillium Web Italic"),url("../fonts/titilliumweb/TitilliumWeb-Italic.ttf")}@font-face{font-family:"Titillium Web Bold";font-weight:700;src:local("Titillium Web Bold"),url("../fonts/titilliumweb/TitilliumWeb-Bold.ttf")}@font-face{font-family:"Titillium Web Bold Italic";font-style:"italic";font-weight:700;src:local("Titillium Web Bold Italic"),url("../fonts/titilliumweb/TitilliumWeb-BoldItalic.ttf")}.navbar{box-shadow:0 0 1rem #000}.navbar-brand{font-weight:700;color:#659b4b !important;}.navbar-brand img{margin-top:-1.7rem}.content{margin:0 20%;}.content a{color:#588f3d;text-decoration:none;transition:.15s;}.content a:hover,.content a:focus{color:#456336;text-decoration:underline}.content a:active{color:#000}@media (max-width:992px){.content{margin:0 10%}}@media (max-width:768px){.content{margin:0 5%}}@media (max-width:480px){.content{margin:0 2%}}.jumbotron{background-image:url("../../media/background-home.jpg");background-size:cover;border-radius:0 !important;color:#fff;padding-top:25vh;margin:0 -15px !important;height:100vh;min-height:60rem;text-shadow:0 0 .5rem #000;}.jumbotron .btn{margin:4rem 4rem 0 4rem;font-size:2rem;transition:.15s}.jumbotron.reduced{padding-top:5rem;height:25vh;min-height:30rem}.jumbotron.downloads{background-image:url("../../media/background-downloads.jpg")}.jumbotron.community{background-image:url("../../media/gallery/1.jpg")}.jumbotron.credits{background-image:url("../../media/gallery/2.jpg")}.jumbotron.customize{background-image:url("../../media/gallery/3.jpg")}.jumbotron.irc{background-image:url("../../media/gallery/4.jpg")}.jumbotron.development{background-image:url("../../media/gallery/5.jpg")}footer{background-color:#2e2e2e;color:#999;text-align:center;padding:3rem 0;margin-top:3rem;}footer a{color:#e6e6e6;text-decoration:none;transition:.15s;}footer a:hover,footer a:focus{color:#ccc;text-decoration:underline}footer a:active{color:#808080;text-decoration:underline}::-moz-selection{background-color:#659b4b;color:#fff}::selection{background-color:#659b4b;color:#fff}body{background-color:#f2f2f2;color:#333;cursor:default;font-family:"Titillium Web Regular",sans-serif}p,li{font-size:1.7rem}h1{font-weight:bold;font-size:5rem;margin:9rem 0 4.5rem 0;text-align:center}h2{font-weight:bold;font-size:3rem;margin:6rem 0 3rem 0}h3{font-size:2.6rem;margin:5rem 0 2.5rem 0}h4{margin:3rem 0 1.5rem 0;font-size:2.2rem}pre,code{background-color:#e2e2e2;border:1px solid #ccc;color:#333}.intro{margin-top:5rem;font-size:1.8rem;text-align:center}.center{text-align:center}.line{background-color:#bbb;height:1px;margin:4rem 0;width:100%}.inline{display:inline}
.navbar{box-shadow:0 0 1rem #000}.navbar-brand{font-weight:700;color:#659b4b !important;}.navbar-brand img{margin-top:-1.7rem}

82
assets/css/main.scss Normal file
View File

@ -0,0 +1,82 @@
---
# This ensures thet Jekyll reads this file
---
// Global stytes
@import "fonts"; // Fonts (currently Titillium Web)
@import "navbar"; // Navigation bar
@import "content"; // Content margins
@import "jumbotron"; // Jumbotron
@import "footer"; // Footer (copyright information, link to GitHub)
::-moz-selection {
background-color: hsl(100, 35%, 45%);
color: hsl(0, 0%, 100%);
}
::selection {
background-color: hsl(100, 35%, 45%);
color: hsl(0, 0%, 100%);
}
body {
background-color: #f2f2f2;
color: #333;
cursor: default;
font-family: "Titillium Web Regular", sans-serif;
}
p, li {
font-size: 1.7rem;
}
h1 {
font-weight: bold;
font-size: 5rem;
margin: 9rem 0 4.5rem 0;
text-align: center;
}
h2 {
font-weight: bold;
font-size: 3rem;
margin: 6rem 0 3rem 0;
}
h3 {
font-size: 2.6rem;
margin: 5rem 0 2.5rem 0;
}
h4 {
margin: 3rem 0 1.5rem 0;
font-size: 2.2rem;
}
pre,
code {
background-color: #e2e2e2;
border: 1px solid #ccc;
color: #333;
}
.intro {
margin-top: 5rem;
font-size: 1.8rem;
text-align: center;
}
.center {
text-align: center;
}
.line {
background-color: #bbb;
height: 1px;
margin: 4rem 0;
width: 100%;
}
.inline {
display: inline;
}

View File

@ -1,29 +0,0 @@
// content.styl: Content margins and link styling
.content
margin 0 20%
a
color hsl(100, 40%, 40%)
text-decoration none
transition .15s
&:hover,
&:focus
color hsl(100, 30%, 30%)
text-decoration underline
&:active
color hsl(0, 0, 0)
@media (max-width 992px)
.content
margin 0 10%
@media (max-width 768px)
.content
margin 0 5%
@media (max-width 480px)
.content
margin 0 2%

View File

@ -1,27 +0,0 @@
// fonts.styl: Fonts
@font-face
font-family "Titillium Web Regular"
font-weight 500
src local("Titillium Web Regular"),
url("../fonts/titilliumweb/TitilliumWeb-Regular.ttf")
@font-face
font-family "Titillium Web Italic"
font-style "italic"
font-weight 500
src local("Titillium Web Italic"),
url("../fonts/titilliumweb/TitilliumWeb-Italic.ttf")
@font-face
font-family "Titillium Web Bold"
font-weight 700
src local("Titillium Web Bold"),
url("../fonts/titilliumweb/TitilliumWeb-Bold.ttf")
@font-face
font-family "Titillium Web Bold Italic"
font-style "italic"
font-weight 700
src local("Titillium Web Bold Italic"),
url("../fonts/titilliumweb/TitilliumWeb-BoldItalic.ttf")

View File

@ -1,22 +0,0 @@
// footer.styl: Footer
footer
background-color hsl(0, 0, 18%)
color hsl(0, 0, 60%)
text-align center
padding 3rem 0
margin-top 3rem
a
color hsl(0, 0, 90%)
text-decoration none
transition .15s
&:hover,
&:focus
color hsl(0, 0, 80%)
text-decoration underline
&:active
color hsl(0, 0, 50%)
text-decoration underline

View File

@ -1,40 +0,0 @@
// jumbotron.styl: Jumbotron
.jumbotron
background-image url("../../media/background-home.jpg")
background-size cover
border-radius 0 !important
color #fff
padding-top 25vh
margin 0 -15px !important
height 100vh
min-height 60rem
text-shadow 0 0 .5rem #000
.btn
margin 4rem 4rem 0 4rem
font-size 2rem
transition .15s
&.reduced
padding-top 5rem
height 25vh
min-height 30rem
&.downloads
background-image url("../../media/background-downloads.jpg")
&.community
background-image url("../../media/gallery/1.jpg")
&.credits
background-image url("../../media/gallery/2.jpg")
&.customize
background-image url("../../media/gallery/3.jpg")
&.irc
background-image url("../../media/gallery/4.jpg")
&.development
background-image url("../../media/gallery/5.jpg")

View File

@ -1,66 +0,0 @@
// main.styl: Global styles
@import "fonts" // Fonts (currently Titillium Web)
@import "navbar" // Navigation bar
@import "content" // Content margins
@import "jumbotron" // Jumbotron
@import "footer" // Footer (copyright information, link to GitHub)
::-moz-selection
background-color hsl(100, 35%, 45%)
color hsl(0, 0%, 100%)
::selection
background-color hsl(100, 35%, 45%)
color hsl(0, 0%, 100%)
body
background-color #f2f2f2
color #333
cursor default
font-family "Titillium Web Regular", sans-serif
p, li
font-size 1.7rem
h1
font-weight bold
font-size 5rem
margin 9rem 0 4.5rem 0
text-align center
h2
font-weight bold
font-size 3rem
margin 6rem 0 3rem 0
h3
font-size 2.6rem
margin 5rem 0 2.5rem 0
h4
margin 3rem 0 1.5rem 0
font-size 2.2rem
pre,
code
background-color #e2e2e2
border 1px solid #ccc
color #333
.intro
margin-top 5rem
font-size 1.8rem
text-align center
.center
text-align center
.line
background-color #bbb
height 1px
margin 4rem 0
width 100%
.inline
display inline

View File

@ -1,11 +0,0 @@
// navbar.styl: Navigation bar
.navbar
box-shadow 0 0 1rem #000
.navbar-brand
font-weight 700
color hsl(100, 35%, 45%) !important
img
margin-top -1.7rem

View File

@ -1,11 +0,0 @@
{
"name": "Minetest",
"version": "0.2.0",
"author": "Calinou",
"license": "MIT",
"devDependencies": {
"grunt": "*",
"grunt-contrib-stylus": "*",
"grunt-contrib-watch": "*"
}
}