# HG changeset patch # User Ludovic Chabant # Date 1390925859 28800 # Node ID bf2c79779800b423606d5c310816c58a74167b8e # Parent 27492ea6565723df56daa87ab26fd00ec6a640e5 Working on a better Wikked theme. diff -r 27492ea65657 -r bf2c79779800 wikked/assets/css/custom-variables.less --- a/wikked/assets/css/custom-variables.less Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/css/custom-variables.less Tue Jan 28 08:17:39 2014 -0800 @@ -8,6 +8,17 @@ @body-bg: #fff; @text-color: @gray-dark; -@font-size-base: 18px; -//@line-height-base: (@font-size-base * 1.5); +@font-size-base: 20px; +@line-height-base: 1.5; +@line-height-computed: floor(@font-size-base * @line-height-base); +@font-family-serif: Georgia,Cambria,"Times New Roman",Times,serif; +@font-family-sans-serif: "Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Verdana,sans-serif; +@font-family-base: @font-family-serif; + +@headings-font-family: @font-family-sans-serif; +@headings-font-weight: 700; +@headings-line-height: 1.5; + +@icon-font-path: "../bootstrap/fonts/"; + diff -r 27492ea65657 -r bf2c79779800 wikked/assets/css/wikked/alerts.less --- a/wikked/assets/css/wikked/alerts.less Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/css/wikked/alerts.less Tue Jan 28 08:17:39 2014 -0800 @@ -39,11 +39,11 @@ text-shadow: 0 0 0.5em rgba(1, 1, 1, 0.2); } .ribbon { - .makeRibbon(lighten(@colorOrange, 10%)); + .makeRibbon(lighten(@color-orange, 10%)); float: right; .ribbon-inner { - .makeRibbonContent(@colorOrange, @colorPage); + .makeRibbonContent(@color-orange, #fff); a { color: #fff; text-decoration: none; } } } diff -r 27492ea65657 -r bf2c79779800 wikked/assets/css/wikked/base.less --- a/wikked/assets/css/wikked/base.less Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/css/wikked/base.less Tue Jan 28 08:17:39 2014 -0800 @@ -1,13 +1,13 @@ // Constants -@colorBlue: #0F1FFF; -@colorBlueDark: #1D3982; -@colorOrange: #B03500; -@colorGreen: #B6CC95; -@colorGreenDark: #496B15; -@colorPage: #FFFFFF; -@colorFooter: #E5E7FF; -@colorCode: #523C37; +@color-blue: #0F1FFF; +@color-blue-dark: #1D3982; +@color-orange: #B03500; +@color-green: #B6CC95; +@color-green-dark: #496B15; +@color-footer: rgb(220, 220, 220); +@color-footer-dark: rgb(170, 170, 170); +@color-code: #523C37; // Macros diff -r 27492ea65657 -r bf2c79779800 wikked/assets/css/wikked/main.less --- a/wikked/assets/css/wikked/main.less Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/css/wikked/main.less Tue Jan 28 08:17:39 2014 -0800 @@ -1,25 +1,35 @@ // Main tags body { - background: url('../img/gray_jean.png'); - //background-image: url(http://basehold.it/i/27); + //background: url('../img/gray_jean.png'); + color: rgb(50, 50, 50); } // Global classes a { text-decoration: none; - color: @colorBlue; - &:link { color: @colorBlue; } - &:visited { color: @colorBlue; } - &:hover { color: @colorBlue; text-decoration: underline; } - &:active { color: @colorBlue; } + color: @color-blue; + &:link { color: @color-blue; } + &:visited { color: @color-blue; } + &:hover { color: @color-blue; text-decoration: underline; } + &:active { color: @color-blue; } } a.wiki-link.missing, a.wiki-meta-link.missing { - color: @colorOrange; - &:hover { color: @colorOrange; text-decoration: underline; } + color: @color-orange; + &:hover { color: @color-orange; text-decoration: underline; } } em.hlt1 , em.hlt2, em.hlt3, em.hlt4, em.hlt5, em.hlt6 { - background: @colorGreen; + background: @color-green; } + +h1, h2, h3, h4, h5, h6 { + letter-spacing: -0.02em; + color: rgb(65, 65, 65); +} + +p { + margin: 0 0 @line-height-computed; +} + diff -r 27492ea65657 -r bf2c79779800 wikked/assets/css/wikked/page.less --- a/wikked/assets/css/wikked/page.less Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/css/wikked/page.less Tue Jan 28 08:17:39 2014 -0800 @@ -1,9 +1,16 @@ + +// Article +article { + //background-image: url(http://basehold.it/i/30); + margin: 0 auto; + padding: 0 @line-height-computed; +} // Navigation & footer -.nav-wrapper>nav, -.footer-wrapper>footer { +.navbar { color: @gray-light; font-size: @font-size-small; + font-family: @font-family-sans-serif; a { text-decoration: none; @@ -14,18 +21,76 @@ &:active { color: @gray-light; } } } +// Fix Boostrap stuff we don't want. .navbar { - // Fix margin introduced by Bootstrap. - margin-bottom: 0; + //margin-bottom: 0; +} +.navbar li a { + line-height: floor(@font-size-small * @line-height-base); } .navbar-brand { // Make the first navigation link ("brand") the same size // as the rest. font-size: @font-size-small; + line-height: floor(@font-size-small * @line-height-base); +} + +.footer-wrapper { + margin: 0 auto; + padding: 0 @line-height-computed; +} +footer { + color: @color-footer-dark; + border-top: 1px solid @color-footer; + padding: @line-height-computed 0; + font-weight: 300; + font-size: @font-size-small; + font-family: @font-family-sans-serif; + letter-spacing: -0.03em; + + a { + text-decoration: none; + color: @color-footer-dark; + &:link { color: @color-footer-dark; } + &:visited { color: @color-footer-dark; } + &:hover { color: @color-green-dark; text-decoration: none; } + &:active { color: @color-footer-dark; } + } + ul { + list-type: none; + } + li { + display: inline-block; + margin: 0; + padding: 0 0.5em; + } + /*li:before { + content: '•'; + font-weight: 700; + margin: 0 0.5em; + } + li:first-child:before { + content: none; + }*/ +} + +// Page info +section.info { + margin: @line-height-computed 0 0 0; + padding: @line-height-computed 0; + border-top: 1px solid @color-footer; + + .info-categories { + color: @color-footer-dark; + font-weight: 300; + font-size: @font-size-small; + font-family: @font-family-sans-serif; + text-transform: uppercase; + } } // Main page classes -.wrapper>article { +/*.wrapper>article { .box-shadow(0 0 10px, rgb(210, 210, 210)); background: @colorPage; overflow: hidden; @@ -68,7 +133,7 @@ .rev_id { font-family: @font-family-monospace; } -} +}*/ // Search ul#search-preview { @@ -98,7 +163,7 @@ } // Page editing -#page-edit { +/*#page-edit { textarea { height: 10em; font-size: @font-size-base; @@ -122,20 +187,20 @@ width: 32px; height: 20px; } -/*#wmd-preview-wrapper { - border: 1px dashed @colorBlueDark; - - h3 { - margin: 0.5em 1em 0.5em 1em; - } - #wmd-preview { - margin: 1em; - background: none; - } -} -#wmd-button-bar li { - margin-left: 0; -}*/ +//#wmd-preview-wrapper { +// border: 1px dashed @colorBlueDark; +// +// h3 { +// margin: 0.5em 1em 0.5em 1em; +// } +// #wmd-preview { +// margin: 1em; +// background: none; +// } +//} +//#wmd-button-bar li { +// margin-left: 0; +//} .preview-wiki-meta { .meta-name { background: @colorBlueDark; @@ -155,5 +220,20 @@ .commit-meta { margin-top: 1em; margin-bottom: 1em; +}*/ + +/* Small devices (tablets, 768px and up) */ +@media (min-width: @screen-sm-min) { + article, .footer-wrapper { + width: 700px; + } } +/* Medium devices (desktops, 992px and up) */ +@media (min-width: @screen-md-min) { +} + +/* Large devices (large desktops, 1200px and up) */ +@media (min-width: @screen-lg-min) { +} + diff -r 27492ea65657 -r bf2c79779800 wikked/assets/js/wikked.js --- a/wikked/assets/js/wikked.js Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/js/wikked.js Tue Jan 28 08:17:39 2014 -0800 @@ -4,7 +4,7 @@ * We need to alias/shim some of the libraries. */ require.config({ - //urlArgs: "bust=" + (new Date()).getTime(), + urlArgs: "bust=" + (new Date()).getTime(), paths: { jquery: 'js/jquery-1.8.3.min', underscore: 'js/underscore-min', diff -r 27492ea65657 -r bf2c79779800 wikked/assets/js/wikked/models.js --- a/wikked/assets/js/wikked/models.js Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/js/wikked/models.js Tue Jan 28 08:17:39 2014 -0800 @@ -96,18 +96,19 @@ defaults: function() { return { url_extras: [ - { name: 'Special Pages', url: '/#/special' } + { name: 'Special Pages', url: '/#/special', icon: 'dashboard' } ] }; }, clearExtraUrls: function() { this.get('url_extras').length = 0; }, - addExtraUrl: function(name, url, index) { - if (index === undefined) { - this.get('url_extras').push({ name: name, url: url }); + addExtraUrl: function(name, url, index, icon) { + extra = { name: name, url: url, icon: icon }; + if (index === undefined || index < 0) { + this.get('url_extras').push(extra); } else { - this.get('url_extras').splice(index, 0, { name: name, url: url }); + this.get('url_extras').splice(index, 0, extra); } } }); @@ -237,8 +238,16 @@ // Add extra links to the footer. var model = this; - this.footer.addExtraUrl('Pages Linking Here', function() { return '/#/inlinks/' + model.id; }, 1); - this.footer.addExtraUrl('JSON', function() { return '/api/read/' + model.id; }); + this.footer.addExtraUrl( + 'Pages Linking Here', + function() { return '/#/inlinks/' + model.id; }, + 1, + 'link'); + this.footer.addExtraUrl( + 'JSON', + function() { return '/api/read/' + model.id; }, + -1, + 'cog'); }, checkStatePath: function() { return this.get('path'); @@ -301,7 +310,11 @@ initialize: function() { PageHistoryModel.__super__.initialize.apply(this, arguments); var model = this; - this.footer.addExtraUrl('JSON', function() { return '/api/history/' + model.id; }); + this.footer.addExtraUrl( + 'JSON', + function() { return '/api/history/' + model.id; }, + -1, + 'road'); }, doDiff: function(form) { var rev1 = $('input[name=rev1]:checked', form).val(); diff -r 27492ea65657 -r bf2c79779800 wikked/assets/tpl/footer.html --- a/wikked/assets/tpl/footer.html Tue Jan 28 08:16:35 2014 -0800 +++ b/wikked/assets/tpl/footer.html Tue Jan 28 08:17:39 2014 -0800 @@ -1,7 +1,7 @@ -