Isarra has uploaded a new change for review.
https://gerrit.wikimedia.org/r/250640
Change subject: Turn this into more of a skin. Formatting, horror, more horror.
......................................................................
Turn this into more of a skin. Formatting, horror, more horror.
Thanks to Skizzers for the catlist db query.
Thanks to HORROR for the tool parsing.
Lots of css and stuff.
Change-Id: I9b6b4c2e3a206d909972929ae32777c933d0be46
---
M TimelessTemplate.php
M i18n/en.json
M i18n/qqq.json
M notes
M resources/forms.less
A resources/images/arrow-down-white.png
A resources/images/arrow-down-white.svg
A resources/images/star-filled.png
A resources/images/star-filled.svg
A resources/images/star.png
A resources/images/star.svg
A resources/images/user.png
A resources/images/user.svg
M resources/screen-common.less
M resources/screen-desktop.less
M resources/variables.less
16 files changed, 708 insertions(+), 88 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/skins/Timeless
refs/changes/40/250640/1
diff --git a/TimelessTemplate.php b/TimelessTemplate.php
index 7202f5f..55c5571 100644
--- a/TimelessTemplate.php
+++ b/TimelessTemplate.php
@@ -9,6 +9,8 @@
* Outputs the entire contents of the page
*/
public function execute() {
+ $pileOfTools = $this->getPageTools();
+
$this->html( 'headelement' );
?>
<div id="mw-wrapper">
@@ -30,14 +32,46 @@
<h2><?php echo $this->getMsg(
'navigation-heading' )->parse() ?></h2>
<?php
$this->outputLogo( 'p-logo', 'image' );
- echo '<div id="page-tools">';
- $this->outputPageLinks();
- echo '</div><div id="site-navigation">';
+ echo '<div id="site-navigation"
class="sidebar-chunk">';
$this->outputSiteNavigation();
echo '</div>';
+ $this->outputPortlet( array(
+ 'id' => 'p-sitetools',
+ 'headerMessage' =>
'timeless-sitetools',
+ 'content' =>
$pileOfTools['general'],
+ 'class' => 'sidebar-chunk'
+ ) );
?>
</div>
<div id="mw-related-navigation">
+ <div id="page-tools"
class="sidebar-chunk">
+ <?php
+ if ( count(
$pileOfTools['page-secondary'] ) > 0 ) {
+ $this->outputPortlet(
array(
+ 'id' =>
'p-pageactions',
+ 'headerMessage'
=> 'timeless-pageactions',
+ 'content' =>
$pileOfTools['page-secondary'],
+ ) );
+ }
+ if ( count(
$pileOfTools['user'] ) > 0 ) {
+ $this->outputPortlet(
array(
+ 'id' =>
'p-userpagetools',
+ 'headerMessage'
=> 'timeless-userpagetools',
+ 'content' =>
$pileOfTools['user'],
+ ) );
+ }
+ $this->outputPortlet( array(
+ 'id' => 'p-pagemisc',
+ 'headerMessage' =>
'timeless-pagemisc',
+ 'content' =>
$pileOfTools['page-tertiary'],
+ ) );
+ ?>
+ </div>
+ <?php
+
+ $this->outputInterlanguageLinks();
+ $this->outputCategories();
+ ?>
</div>
<div id="mw-content">
<div class="mw-body" role="main">
@@ -57,7 +91,23 @@
<h1 class="firstHeading">
<?php $this->html( 'title' ) ?>
</h1>
- <div id="siteSub"><?php echo
$this->getMsg( 'tagline' )->parse() ?></div>
+ <div id="page-header-links">
+ <?php
+ $this->outputPortlet( array(
+ 'id' => 'p-namespaces',
+ 'headerMessage' =>
'timeless-namespaces',
+ 'content' =>
$pileOfTools['namespaces'],
+ ) );
+ ?>
+ <?php
+ $this->outputPortlet( array(
+ 'id' => 'p-pagetools',
+ 'headerMessage' =>
'timeless-pagetools',
+ 'content' =>
$pileOfTools['page-primary'],
+ ) );
+ ?>
+ </div>
+ <div class="visual-clear"></div>
<div class="mw-body-content">
<div id="contentSub">
<?php
@@ -79,7 +129,6 @@
?>
<div class="visual-clear"></div>
<?php
- $this->html( 'catlinks' );
$this->html( 'dataAfterContent'
);
?>
</div>
@@ -91,23 +140,7 @@
<div id="mw-footer-container" class="ts-container">
<div id="mw-footer" class="ts-inner">
- <?php
- foreach ( $this->getFooterLinks() as $category
=> $links ) {
- ?>
- <ul role="contentinfo">
- <?php
- foreach ( $links as $key ) {
- ?>
- <li><?php $this->html(
$key ) ?></li>
- <?php
- }
- ?>
- </ul>
- <?php
- }
- ?>
-
- <ul role="contentinfo">
+ <ul role="contentinfo" id="footer-icons">
<?php
foreach ( $this->getFooterIcons(
'icononly' ) as $blockName => $footerIcons ) {
?>
@@ -122,6 +155,21 @@
}
?>
</ul>
+ <?php
+ foreach ( $this->getFooterLinks() as $category
=> $links ) {
+ ?>
+ <ul role="contentinfo" id="footer-<?php
echo Sanitizer::escapeId( $category ) ?>">
+ <?php
+ foreach ( $links as $key ) {
+ ?>
+ <li><?php $this->html(
$key ) ?></li>
+ <?php
+ }
+ ?>
+ </ul>
+ <?php
+ }
+ ?>
</div>
</div>
</div>
@@ -139,11 +187,16 @@
if ( !$box['content'] ) {
return;
}
+ if ( !isset( $box['class'] ) ) {
+ $box['class'] = 'mw-portlet';
+ } else {
+ $box['class'] .= ' mw-portlet';
+ }
?>
<div
role="navigation"
- class="mw-portlet"
+ class="<?php echo $box['class'] ?>"
id="<?php echo Sanitizer::escapeId( $box['id'] ) ?>"
<?php echo Linker::tooltip( $box['id'] ) ?>
>
@@ -238,14 +291,13 @@
/**
* Outputs the sidebar
- * Set the elements to true to allow them to be part of the sidebar
*/
private function outputSiteNavigation() {
$sidebar = $this->getSidebar();
- $sidebar['SEARCH'] = false;
- $sidebar['TOOLBOX'] = true;
- $sidebar['LANGUAGES'] = true;
+ $sidebar['SEARCH'] = false; // Already hardcoded into header
+ $sidebar['TOOLBOX'] = false; // Parsed as part of pageTools
+ $sidebar['LANGUAGES'] = false; // PUT THIS ON THE OTHER SIDE
foreach ( $sidebar as $boxName => $box ) {
if ( $boxName === false ) {
@@ -254,33 +306,214 @@
$this->outputPortlet( $box, true );
}
}
- private function outputPageLinks() {
- $this->outputPortlet( array(
- 'id' => 'p-namespaces',
- 'headerMessage' => 'namespaces',
- 'content' =>
$this->data['content_navigation']['namespaces'],
- ) );
- $this->outputPortlet( array(
- 'id' => 'p-variants',
- 'headerMessage' => 'variants',
- 'content' =>
$this->data['content_navigation']['variants'],
- ) );
- $this->outputPortlet( array(
- 'id' => 'p-views',
- 'headerMessage' => 'views',
- 'content' => $this->data['content_navigation']['views'],
- ) );
- $this->outputPortlet( array(
- 'id' => 'p-actions',
- 'headerMessage' => 'actions',
- 'content' =>
$this->data['content_navigation']['actions'],
- ) );
- }
+
private function outputUserLinks() {
- $this->outputPortlet( array(
- 'id' => 'p-personal',
- 'headerMessage' => 'personaltools',
- 'content' => $this->getPersonalTools(),
- ) );
+ $user = $this->getSkin()->getUser();
+ ?>
+ <div class="mw-portlet" id="p-personal" role="navigation">
+ <h3>
+ <span>
+ <?php
+ // Display status, and make a dropdown if logged in
+ if ( $user->isLoggedIn() ) {
+ $userName = $user->getName();
+ // Make sure it fit firsts
+ if ( strlen( $userName ) < 15 ) {
+ echo htmlspecialchars( $userName,
ENT_QUOTES );
+ } else {
+ echo wfMessage( 'timeless-loggedin'
)->escaped();
+ }
+ } else {
+ echo wfMessage( 'timeless-anonymous'
)->escaped();
+ }
+ ?>
+ </span>
+ </h3>
+ <div class="p-body dropdown">
+ <ul<?php $this->html( 'userlangattributes' ) ?>>
+ <?php
+ foreach ( $this->getPersonalTools() as $key =>
$item ) {
+ if ( $key == 'userpage' ) {
+ $item['links'][0]['text'] =
wfMessage( 'timeless-userpage' )->text();
+ }
+ if ( $key == 'mytalk' ) {
+ $item['links'][0]['text'] =
wfMessage( 'timeless-talkpage' )->text();
+ }
+ echo $this->makeListItem( $key, $item );
+ }
+ ?>
+ </ul>
+ </div>
+ </div>
+ <?php
+ }
+
+ /*
+ * Generates pile of all the tools
+ * Returns array of arrays of each kind
+ */
+ private function getPageTools() {
+ $title = $this->getSkin()->getTitle();
+ $namespace = $title->getNamespace();
+
+ $sortedPileOfTools = array(
+ 'namespaces' => array(),
+ 'page-primary' => array(),
+ 'page-secondary' => array(),
+ 'user' => array(),
+ 'page-tertiary' => array(),
+ 'general' => array()
+ );
+
+ $pileOfTools = array();
+ foreach ( $this->data['content_navigation'] as $navKey =>
$navBlock ) {
+ /* Just use namespaces items as they are */
+ if ( $navKey == 'namespaces' ) {
+ if ( $namespace < 0 ) {
+ // Put special page ns_pages in the
more pile so they're not so lonely
+ $sortedPileOfTools['page-tertiary'] =
$navBlock;
+ } else {
+ $sortedPileOfTools['namespaces'] =
$navBlock;
+ }
+ } else {
+ $pileOfTools = array_merge( $pileOfTools,
$navBlock );
+ }
+ }
+ $pileOfTools = array_merge( $pileOfTools, $this->getToolbox() );
+ if ( $namespace >= 0 ) {
+ $pileOfTools['pagelog'] = array(
+ 'text' => $this->getMsg( 'timeless-pagelog'
)->escaped(),
+ 'href' => SpecialPage::getTitleFor( 'Log',
$title->getPrefixedText() )->getLocalURL(),
+ 'id' => 't-pagelog'
+ );
+ }
+
+ /* This is really dumb, but there is no sane way to do this. */
+ foreach ( $pileOfTools as $navKey => $navBlock ) {
+ $currentSet = null;
+
+ if ( in_array( $navKey, array( 'watch', 'unwatch' ) ) )
{
+ $currentSet = 'namespaces';
+ } elseif ( in_array( $navKey, array( 'edit', 'view',
'history', 'contributions', 'addsection' ) ) ) {
+ $currentSet = 'page-primary';
+ } elseif ( in_array( $navKey, array( 'delete',
'rename', 'protect', 'unprotect', 'viewsource', 'move' ) ) ) {
+ $currentSet = 'page-secondary';
+ } elseif (in_array( $navKey, array( 'blockip',
'userrights', 'log' ) ) ) {
+ $currentSet = 'user';
+ } elseif (in_array( $navKey, array( 'whatlinkshere',
'print', 'info', 'pagelog', 'recentchangeslinked', 'permalink' ) ) ) {
+ $currentSet = 'page-tertiary';
+ } else {
+ $currentSet = 'general';
+ }
+ $sortedPileOfTools[$currentSet][$navKey] = $navBlock;
+ }
+
+ return $sortedPileOfTools;
+ }
+
+ /*
+ * Assemble and output array of categories, regardless of view mode
+ * Just using Skin or OutputPage functions doesn't respect view modes
(preview, history, whatever)
+ */
+ private function outputCategories() {
+ global $wgContLang;
+
+ $skin = $this->getSkin();
+ $title = $skin->getTitle();
+ $catList = false;
+
+ /* Get list from outputpage if in preview; otherwise get list
from title */
+ if ( in_array( $skin->getRequest()->getVal( 'action' ), array(
'submit', 'edit' ) ) ) {
+ $allCats = array();
+ /* Can't just use getCategoryLinks because there's no
equivalent for Title */
+ $allCats2 = $skin->getOutput()->getCategories();
+ foreach ( $allCats2 as $displayName ) {
+ $catTitle = Title::makeTitleSafe( NS_CATEGORY,
$displayName );
+ $allCats[] = $catTitle->getDBkey();
+ }
+ } else {
+ /* This is probably to trim out some excessive stuff.
Unless I was just high on cough syrup. */
+ $allCats = array_keys( $title->getParentCategories() );
+
+ $len = strlen( $wgContLang->getNsText( NS_CATEGORY ) .
':' );
+ foreach ( $allCats as $i => $catName ) {
+ $allCats[$i] = substr( $catName, $len );
+ }
+ }
+ if ( count( $allCats ) > 0 ) {
+ $dbr = wfGetDB( DB_SLAVE );
+ $res = $dbr->select(
+ array( 'page', 'page_props' ),
+ array( 'page_id', 'page_title' ),
+ array(
+ 'page_title' => $allCats,
+ 'page_namespace' => NS_CATEGORY,
+ 'pp_propname' => 'hiddencat'
+ ),
+ __METHOD__,
+ array(),
+ array( 'page_props' => array( 'JOIN', 'pp_page
= page_id' ) )
+ );
+ $hiddenCats = array();
+ foreach ( $res as $row ) {
+ $hiddenCats[] = $row->page_title;
+ }
+ $normalCats = array_diff( $allCats, $hiddenCats );
+
+ $normalCount = count( $normalCats );
+ $hiddenCount = count( $hiddenCats );
+ $count = $normalCount;
+
+ /* Mostly consistent with how Skin does it. Doesn't
have the classes. Either way can't be good for caching. */
+ if ( $skin->getUser()->getBoolOption( 'showhiddencats'
) || $title->getNamespace() == NS_CATEGORY ) {
+ $count += $hiddenCount;
+ } else {
+ /* We don't care if there are hidden ones. */
+ $hiddenCount = 0;
+ }
+
+ /* Assemble the html because why not... */
+ if ( $count ) {
+ $catList = '<div role="navigation"
class="mw-portlet sidebar-chunk" id="p-catlist">';
+ if ( $normalCount ) {
+ $catList .= $this->assembleCatList(
$normalCats, 'catlist-normal', 'categories' );
+ }
+ if ( $hiddenCount ) {
+ $catList .= $this->assembleCatList(
$hiddenCats, 'catlist-hidden', 'hidden-categories' );
+ }
+ $catList .= '</div>';
+ }
+ }
+ if ( $catList ) {
+ echo $catList;
+ }
+ }
+ private function assembleCatList( $list, $id, $message ) {
+ $catList = '<h3>' . $this->getMsg( $message )->escaped() .
'</h3>';
+ $catList .= '<ul id="' . $id . '">';
+ foreach ( $list as $category) {
+ $title = Title::makeTitleSafe( NS_CATEGORY, $category );
+ if ( !$title ) {
+ continue;
+ }
+ $category = Linker::link( $title, $title->getText() );
+ $catList .= '<li>' . $category . '</li>';
+ }
+ $catList .= '</ul>';
+
+ return $catList;
+ }
+
+ private function outputInterlanguageLinks() {
+ if ( $this->data['language_urls'] ) {
+ $msgObj = $this->getMsg( 'otherlanguages' );
+ $this->outputPortlet( array(
+ 'id' => 'p-lang',
+ 'header' => $msgObj->exists() ? $msgObj->text()
: 'otherlanguages',
+ 'generated' => false,
+ 'content' => $this->data['language_urls'],
+ 'class' => 'sidebar-chunk'
+ ) );
+ }
}
}
diff --git a/i18n/en.json b/i18n/en.json
index a08744c..c324d6d 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -4,5 +4,17 @@
},
"skinname-timeless": "Timeless",
"timeless-desc": "A timeless skin designed after the Winter prototype
by Brandon Harris.",
- "timeless-search-placeholder": "Search approximately {{NUMBEROFPAGES}}
pages"
+ "timeless-search-placeholder": "Search approximately {{NUMBEROFPAGES}}
pages",
+ "timeless-loggedin": "Your account",
+ "timeless-anonymous": "Anonymous user",
+ "timeless-userpage": "User page",
+ "timeless-talkpage": "User talk",
+ "timeless-pagelog": "Page logs",
+ "timeless-sitetools": "Wiki tools",
+ "timeless-pageactions": "Page tools",
+ "timeless-userpagetools": "User tools",
+ "timeless-pagemisc": "More",
+ "timeless-namespaces": "Namespaces",
+ "timeless-pagetools": "Page actions"
}
+
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 250a8ad..b8c91f7 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -1,8 +1,19 @@
{
"@metadata": {
- "authors": [ "..." ]
+ "authors": [ "Isarra" ]
},
"skinname-timeless": "{{optional}}",
"timeless-desc":
"{{desc|what=skin|name=Timeless|url=https://www.mediawiki.org/wiki/Skin:Timeless}}";,
- "timeless-search-placeholder": "Main search input placeholder text"
+ "timeless-search-placeholder": "Main search input placeholder text",
+ "timeless-loggedin": "Label for logged in users' user menu (if their
username is too long to fit)",
+ "timeless-anonymous": "Label for anonymous (not logged in) user menu",
+ "timeless-userpage": "User page/profile link label in the personal
menu\n{{Identical|User page}}",
+ "timeless-talkpage": "Talk page link label in the personal menu",
+ "timeless-pagelog": "Label for special:log link for the page",
+ "timeless-sitetools": "Label for general site tools menu in sidebar",
+ "timeless-pageactions": "Label for some page actions",
+ "timeless-userpagetools": "Label for actions associated with a
userpage",
+ "timeless-pagemisc": "Label for more tools",
+ "timeless-namespaces": "Label for page namespaces and watch tool",
+ "timeless-pagetools": "Label for some other page tools"
}
diff --git a/notes b/notes
index eb1ae45..34fc164 100644
--- a/notes
+++ b/notes
@@ -1 +1,29 @@
-...
+
+logo
+site navigation
+> wiki tools
+
+> listen
+table of contents
+
+
+
+search
+firstheading
+page actions - edit etc
+content
+> references
+related content
+
+
+
+personal tools
+notifications
+
+page tools - protect etc
+user tools
+> all page tools - related, info etc
+
+> languages
+> sister projects
+categories
diff --git a/resources/forms.less b/resources/forms.less
index 8548f00..3c558e8 100644
--- a/resources/forms.less
+++ b/resources/forms.less
@@ -127,7 +127,7 @@
padding: .25em .35em;
border: solid 1px @grey;
margin: .5em 0;
- box-shadow: inset 0px 2px 1px 1px rgba(0, 0, 0, 0.05);
+ box-shadow: inset 0 2px 1px 1px rgba(0, 0, 0, 0.05);
font-size: 1em;
min-height: 30px;
}
@@ -166,6 +166,7 @@
background: @background;
color: @text;
min-height: 30px;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
&:active {
background: @grey-bright;
diff --git a/resources/images/arrow-down-white.png
b/resources/images/arrow-down-white.png
new file mode 100644
index 0000000..5953d0e
--- /dev/null
+++ b/resources/images/arrow-down-white.png
Binary files differ
diff --git a/resources/images/arrow-down-white.svg
b/resources/images/arrow-down-white.svg
new file mode 100644
index 0000000..39a3daf
--- /dev/null
+++ b/resources/images/arrow-down-white.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
xmlns="http://www.w3.org/2000/svg"; height="16" width="22" version="1.1"
xmlns:cc="http://creativecommons.org/ns#";
xmlns:dc="http://purl.org/dc/elements/1.1/";>
+<path style="fill:#555" d="m15.5 5-5 5-5-5z"/>
+<path style="fill:#fff" d="m15.5 6l-5 5-5-5z" fill="#797979"/>
+</svg>
diff --git a/resources/images/star-filled.png b/resources/images/star-filled.png
new file mode 100644
index 0000000..b1b2318
--- /dev/null
+++ b/resources/images/star-filled.png
Binary files differ
diff --git a/resources/images/star-filled.svg b/resources/images/star-filled.svg
new file mode 100644
index 0000000..26f7923
--- /dev/null
+++ b/resources/images/star-filled.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
xmlns="http://www.w3.org/2000/svg"; height="5.64mm" width="5.64mm" version="1.1"
xmlns:cc="http://creativecommons.org/ns#";
xmlns:dc="http://purl.org/dc/elements/1.1/"; viewBox="0 0 20 20">
+<g transform="translate(-77 -51.8)">
+<path
style="color-rendering:auto;text-decoration-color:#000000;color:#000000;shape-rendering:auto;solid-color:#000000;text-decoration-line:none;fill:#aaa;fill-rule:evenodd;mix-blend-mode:normal;block-progression:tb;text-indent:0;image-rendering:auto;white-space:normal;text-decoration-style:solid;isolation:auto;text-transform:none"
d="m87 53.6-2.63 5.12-5.65 0.954 4.03 4.1-0.846 5.7 5.12-2.59 5.13
2.57-0.289-1.91-0.574-3.79 4.02-4.11-5.65-0.935z"/>
+</g>
+</svg>
diff --git a/resources/images/star.png b/resources/images/star.png
new file mode 100644
index 0000000..d27efa9
--- /dev/null
+++ b/resources/images/star.png
Binary files differ
diff --git a/resources/images/star.svg b/resources/images/star.svg
new file mode 100644
index 0000000..c8f519e
--- /dev/null
+++ b/resources/images/star.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
xmlns="http://www.w3.org/2000/svg"; height="5.64mm" width="5.64mm" version="1.1"
xmlns:cc="http://creativecommons.org/ns#";
xmlns:dc="http://purl.org/dc/elements/1.1/"; viewBox="0 0 20 20">
+<g transform="translate(-77 -51.8)">
+<path style="stroke:#aaa;stroke-linecap:round;stroke-width:2.55;fill:none"
transform="matrix(.781 .0353 -.0351 .786 21.1 10)" d="m92.5 69.3-5.04-2.23-4.81
2.69 0.568-5.48-4.04-3.74 5.39-1.15 2.31-5 2.76 4.77 5.47 0.649-3.68 4.1z"/>
+</g>
+</svg>
diff --git a/resources/images/user.png b/resources/images/user.png
new file mode 100644
index 0000000..ff9858a
--- /dev/null
+++ b/resources/images/user.png
Binary files differ
diff --git a/resources/images/user.svg b/resources/images/user.svg
new file mode 100644
index 0000000..5df4d20
--- /dev/null
+++ b/resources/images/user.svg
@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/";
+ xmlns:cc="http://creativecommons.org/ns#";
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+ xmlns:svg="http://www.w3.org/2000/svg";
+ xmlns="http://www.w3.org/2000/svg";
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+ height="5.64mm"
+ width="5.64mm"
+ version="1.1"
+ viewBox="0 0 20 20"
+ id="svg4136"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="user.svg"
+
inkscape:export-filename="/media/shintaiden/home/rahah/mediawiki/skins/Timeless/resources/images/user.png"
+ inkscape:export-xdpi="90"
+ inkscape:export-ydpi="90">
+ <metadata
+ id="metadata4148">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage"; />
+ <dc:title></dc:title>
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs4146" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="3840"
+ inkscape:window-height="2124"
+ id="namedview4144"
+ showgrid="true"
+ inkscape:zoom="67.475764"
+ inkscape:cx="7.1743599"
+ inkscape:cy="10.812713"
+ inkscape:window-x="2880"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg4136"
+ inkscape:snap-bbox="true"
+ inkscape:object-paths="true"
+ inkscape:snap-intersection-paths="true"
+ inkscape:object-nodes="true"
+ inkscape:snap-smooth-nodes="true"
+ inkscape:snap-midpoints="true"
+ inkscape:snap-others="false">
+ <inkscape:grid
+ type="xygrid"
+ id="grid4150" />
+ </sodipodi:namedview>
+ <path
+ inkscape:connector-curvature="0"
+ style="fill:#555555;fill-opacity:1"
+ d="m 3.6434932,8.4526943 c -1.7584726,2.3893907 -1.9573009,4.9984967
-1.227529,6.7279547 0.488999,1.18 1.179848,1.870866 1.989848,2.290867
0.792,0.428 1.749703,0.517941 2.599703,0.519941 l 6.3292038,0 c 0.921,0
1.850524,-0.20736 2.650524,-0.674359 0.8,-0.467 1.460246,-1.198913
1.800246,-2.288912 0.490001,-1.55 0.26532,-4.030165 -1.47968,-6.4601667
-0.0076,0.01164 -0.02113,0.0182 -0.02932,0.02932 A 7.5059113,7.5059113 0 0 1
10.00788,11.986728 7.5059113,7.5059113 0 0 1 3.6434932,8.4526943 Z"
+ id="path4140-5" />
+ <path
+ sodipodi:nodetypes="sssss"
+ inkscape:connector-curvature="0"
+ id="path4142-2"
+ d="m 10.007881,-0.01576092 c -2.4852818,0 -4.5000018,2.01471912
-4.5000018,4.50000012 0,2.485281 2.01472,4.5000001 4.5000018,4.5000001
2.48528,0 4.5,-2.0147191 4.5,-4.5000001 0,-2.485281 -2.01472,-4.50000012
-4.5,-4.50000012 z"
+ style="fill:#555555;fill-opacity:1;fill-rule:evenodd" />
+ <path
+ style="fill:#ffffff"
+ d="M 3.640625 9.453125 C 1.8835375 11.840633 1.6848657 14.447685
2.4140625 16.175781 C 2.9026774 17.354852 3.5929816 18.045174 4.4023438
18.464844 C 5.1937201 18.892507 6.1506693 18.982377 7 18.984375 L 13.324219
18.984375 C 14.244494 18.984375 15.173286 18.777179 15.972656 18.310547 C
16.772026 17.843915 17.431752 17.112579 17.771484 16.023438 C 18.261099
14.474658 18.036595 11.996446 16.292969 9.5683594 C 16.285395 9.5799893
16.271857 9.5865465 16.263672 9.5976562 A 7.5000009 7.5000009 0 0 1 10
12.984375 A 7.5000009 7.5000009 0 0 1 3.640625 9.453125 z "
+ transform="scale(1.0007881,1.0007881)"
+ id="path4140" />
+ <path
+ sodipodi:nodetypes="sssss"
+ inkscape:connector-curvature="0"
+ id="path4142"
+ d="m 10.007881,0.99211966 c -2.4852804,0 -4.5000004,2.01471904
-4.5000004,4.50000004 0,2.485281 2.01472,4.5 4.5000004,4.5 2.48528,0
4.5,-2.014719 4.5,-4.5 0,-2.485281 -2.01472,-4.50000004 -4.5,-4.50000004 z"
+ style="fill:#ffffff;fill-rule:evenodd" />
+</svg>
diff --git a/resources/screen-common.less b/resources/screen-common.less
index 2868709..5c94b37 100644
--- a/resources/screen-common.less
+++ b/resources/screen-common.less
@@ -10,7 +10,7 @@
color: @text;
background: @background-dark;
font-size: 1em;
- line-height: 1.3;
+ line-height: 1.4;
}
#mw-content {
background: @background;
@@ -21,7 +21,11 @@
#mw-footer-container {
border-top: solid 1px @background-dark2;
box-shadow: inset 0 7px 2px -4px rgba(0, 0, 0, .1);
+ color: @text-inverse;
+ a {
+ color: @text-inverse;
+ }
ul {
margin: 0;
}
@@ -29,13 +33,13 @@
#p-logo {
text-align: center;
- width: 10em;
+ width: 11em;
a.mw-wiki-logo {
display: block;
content: '';
- width: 10em;
- height: 10em;
+ width: 11em;
+ height: 11em;
background-repeat: no-repeat;
background-position: 50% 50%;
}
@@ -50,26 +54,100 @@
&:visited {
color: @blue-dark;
}
- &.new {
- color: @red;
+}
+a.new,
+.new a {
+ color: @red;
- &:visited {
- color: @red-dark;
- }
+ &:visited {
+ color: @red-dark;
}
}
+.mw-editsection {
+ font-family: @fonts;
+}
.mw-editsection-bracket {
display: none;
}
.visual-clear {
clear: both;
}
+#mw-content {
+ h1, h2, h3, h4, h5, h6, dt {
+ font-weight: normal;
+ font-family: @fonts-secondary;
+ line-height: 1.25;
+ margin: 1.5em 0 .5em;
+ }
+
+ h1, h2 {
+ border-bottom: solid 2px @blue-bright;
+
+ }
+
+ h1.firstHeading {
+ margin: .25em 0 .5em;
+ border-bottom: solid 4px @red;
+ }
+
+ h1 {
+ font-size: 2em;
+ }
+ h2 {
+ font-size: 1.7em;
+ }
+ h3 {
+ font-size: 1.5em;
+ }
+ h4 {
+ font-size: 1.35em;
+ }
+ h5 {
+ font-size: 1.25em;
+ }
+ h6 {
+ font-size: 1.2em;
+ }
+ dt {
+ margin-top: 1em;
+ }
+ dd {
+ margin-bottom: 1em;
+ }
+ .mw-changeslist-legend dd {
+ margin-bottom: 0;
+ }
+}
+
+/* Thumbnails */
+.tright {
+ margin: 0 0 .5em .5em;
+ padding: 0 0 1em 1.5em;
+ background: #fff;
+}
+.tleft {
+ margin: 0 .5em .5em 0;
+ padding: 0 1.5em 1em 0;
+ background: #fff;
+
+}
+.thumbinner {
+ padding: .75em;
+}
+.thumbcaption {
+ font-size: 95%;
+ padding: .5em 1em;
+}
+.thumbinner img{
+ border: solid 1px @grey-bright;
+}
/* Hidden stuff */
+#p-namespaces h3,
+#p-pagetools h3,
#mw-site-navigation h2,
-#p-search h3,
-#p-personal h3 {
+#p-search h3 {
.hidden;
}
diff --git a/resources/screen-desktop.less b/resources/screen-desktop.less
index 58cdada..913be43 100644
--- a/resources/screen-desktop.less
+++ b/resources/screen-desktop.less
@@ -1,7 +1,7 @@
@import "variables.less";
.ts-inner {
- max-width: 1300px;
+ max-width: 100em;
padding: 0 3em;
margin: auto;
}
@@ -13,13 +13,15 @@
#p-search,
#mw-content {
margin-left: 12em;
- margin-right: 12em;
+ margin-right: 18em;
}
#mw-related-navigation,
-#p-personal {
- width: 12em;
+#user-tools {
+ width: 18em;
float: right;
}
+
+/* Header */
#mw-header-container {
position: fixed;
@@ -31,12 +33,37 @@
border-bottom: solid 1px @background-dark2;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}
+.dropdown {
+ display: none;
+}
+#p-personal {
+ padding-left: 1.5em;
+}
+#p-personal h3 {
+ margin: 0;
+ padding: .55em 0 .45em 1.5em;
+ font-family: @fonts-secondary;
+ font-weight: normal;
+ font-size: 1.1em;
+ text-shadow: 0 -1px 0 @background-dark2;
+ .background-image-svg('images/user.svg', 'images/user.png');
+ background-position: 0% 10px;
+ background-repeat: no-repeat;
-/* BANNER */
+ span {
+ .background-image-svg('images/arrow-down-white.svg',
'images/arrow-down-white.png');
+ background-position: 100% 2px;
+ background-repeat: no-repeat;
+ padding-right: 1.35em;
+ }
+ &:hover {
+ cursor: pointer;
+ }
+}
#p-logo-text {
- width: 10em;
+ width: 11em;
text-align: center;
text-shadow: 0 -1px 0 @background-dark2;
@@ -50,7 +77,7 @@
}
-/* SEARCH */
+/* Search */
#simpleSearch {
box-shadow: inset 0 2px 2px 1px rgba(0, 0, 0, 0.1);
@@ -63,7 +90,7 @@
border: none;
margin: 0;
height: 2.1em;
- padding: .65em 4.5em .45em 2em;
+ padding: .4em 4.5em .3em 2em;
box-shadow: none;
background: transparent;
width: 100%;
@@ -75,28 +102,141 @@
right: 1.5em;
width: 2.5em;
height: 2.5em;
- border: none;
- background: transparent;
- text-indent: -99999px;
+ .icon;
.background-image-svg('images/search-ltr.svg', 'images/search-ltr.png');
background-position: 50% 40%;
- background-repeat: no-repeat;
+ box-shadow: none;
}
-/* CONTENT */
+/* Content */
#mw-content-container {
margin-top: 3em;
- padding-bottom: 1em;
+ padding-bottom: .5em;
}
#mw-content {
background: @background;
- padding-top: 1em;
+ padding: 1em 2em 3em;
border: 1px @grey-bright;
border-style: none solid solid;
box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.02);
overflow: hidden;
- padding-right: 2em;
- padding-left: 2em;
+}
+#page-header-links {
+ div,
+ ul,
+ li {
+ list-style: none;
+ display: inline-block;
+ margin: 0;
+ padding: 0;
+ }
+ li {
+ margin: .25em 0 1.5em;
+
+ &:hover {
+ border-bottom: solid 3px @grey;
+ }
+ &.selected {
+ border-bottom: solid 3px @blue;
+
+ a {
+ color: @text;
+ }
+ }
+ }
+ #p-namespaces {
+ float: left;
+
+ li {
+ margin-right: 1em;
+ }
+ }
+ #p-pagetools {
+ float: right;
+
+ li {
+ margin-left: 1em;
+ }
+ }
+}
+#ca-watch a,
+#ca-unwatch a {
+ .icon;
+ display: inline-block;
+ width: 1.4em;
+ height: 1.4em;
+ box-sizing: border-box;
+}
+#ca-watch a {
+ .background-image-svg('images/star.svg', 'images/star.png');
+}
+#ca-unwatch a {
+ .background-image-svg('images/star-filled.svg',
'images/star-filled.png');
+}
+
+/* Sidebars */
+
+#mw-site-navigation .sidebar-chunk,
+#mw-related-navigation .sidebar-chunk {
+ background: @background3;
+ border: solid @grey-bright;
+ box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.02);
+ border-width: 1px 1px @border;
+ padding: 1.5em 1.5em 0;
+ margin: 1em;
+ line-height: 1.1;
+
+ ul,
+ li {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ }
+ h3 {
+ font-weight: normal;
+ font-size: 1em;
+ margin: 0 0 .75em 0;
+ padding-bottom: .15em;
+ border-bottom: solid 2px @grey;
+ }
+ ul {
+ margin-bottom: 2em;
+ }
+ li {
+ margin: 0 0 .35em;
+ }
+}
+
+#mw-site-navigation .sidebar-chunk {
+ margin-left: 0;
+}
+#mw-related-navigation .sidebar-chunk {
+ margin-right: 0;
+}
+
+/* Footer */
+
+#mw-footer {
+ padding: .5em 0 1em;
+
+ ul,
+ li {
+ margin: 1em 0;
+ list-style: none;
+ padding: 0;
+ }
+}
+#footer-places li {
+ display: inline;
+ padding-right: 1em;
+}
+#footer-icons {
+ float: right;
+ margin: 0 0 0 1em;
+
+ li {
+ margin: 0 0 1em 0;
+ }
}
diff --git a/resources/variables.less b/resources/variables.less
index 7923666..f5f4b41 100644
--- a/resources/variables.less
+++ b/resources/variables.less
@@ -3,6 +3,7 @@
@text: #013;
@background: #fff;
@background2: #f3f3f3;
+@background3: #fcfcfc;
@background-dark: #777;
@background-dark2: #555;
@@ -11,7 +12,7 @@
@link: @blue;
@link-red: @red;
-@grey: #ccc;
+@grey: #ddd;
@grey-bright: #eee;
@grey-dark: #aaa;
@@ -46,3 +47,15 @@
position: absolute;
top: -9999px;
}
+
+/* Icons - hides labels, but keep them accessible for screen-readers */
+.icon() {
+ text-indent: -99999px;
+ border: none;
+ background: transparent;
+ background-repeat: no-repeat;
+}
+
+.box {
+ // ...
+}
--
To view, visit https://gerrit.wikimedia.org/r/250640
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I9b6b4c2e3a206d909972929ae32777c933d0be46
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/skins/Timeless
Gerrit-Branch: master
Gerrit-Owner: Isarra <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
