This is an automated email from the git hooks/post-receive script. k n o m e p u s h e d a c o m m i t t o b r a n c h m a s t e r in repository www/www.xfce.org.
commit bb42e3ca1548c3dc30ca0222eba6bd03eeb2c536 Author: Pasi Lallinaho <p...@shimmerproject.org> Date: Thu May 18 23:00:34 2017 +0300 - Clean up CSS; remove news.css and increase legibility for others - Update some HTTP links to HTTPS - Fix 4.12 changelog title --- pages/about/news.php | 1 - pages/download/changelogs/4.12.php | 2 +- pages/frontpage.php | 4 +- style/base.css | 121 ++++++++++++++++-- style/css.php | 2 +- style/frontpage.css | 254 ++++++++++++++++++------------------- style/img/menu-button.png | Bin 0 -> 188 bytes style/img/menu-icon.png | Bin 186 -> 0 bytes style/img/orig/slider-bg.png | Bin 201048 -> 0 bytes style/img/src/menu-button.svg | 86 +++++++++++++ style/mobile.css | 100 ++++++++------- style/news.css | 79 ------------ 12 files changed, 381 insertions(+), 268 deletions(-) diff --git a/pages/about/news.php b/pages/about/news.php index 54bf290..0caccd0 100644 --- a/pages/about/news.php +++ b/pages/about/news.php @@ -4,7 +4,6 @@ include ('pages/news-array.php'); $head['title'] = R_('News'); -$head['stylesheet'] = array ('/style/news.css'); $head['feed'] = 'http://www.xfce.org/feed?lang='.$lang; echo '<h1>'.$head['title'].'</h1>'; diff --git a/pages/download/changelogs/4.12.php b/pages/download/changelogs/4.12.php index a03d1c2..b11a976 100644 --- a/pages/download/changelogs/4.12.php +++ b/pages/download/changelogs/4.12.php @@ -1,4 +1,4 @@ -<?php $head['title'] = 'Xfce 4.14 Changelog'; ?> +<?php $head['title'] = 'Xfce 4.12 Changelog'; ?> <h1>Xfce 4.12 Changelog</h1> diff --git a/pages/frontpage.php b/pages/frontpage.php index c827ca2..3372b2d 100644 --- a/pages/frontpage.php +++ b/pages/frontpage.php @@ -68,8 +68,8 @@ $head['css'] = '@media screen and (max-width:830px) { </div> <div class="column"> - <span class="rss"><a href="http://www.xfce.org/feed?lang=<?php echo $lang ?>"><?php E_('Subscribe to RSS feed') ?></a></span> <h2><?php E_('Latest News') ?></h2> + <span class="rss"><a href="https://www.xfce.org/feed?lang=<?php echo $lang ?>"><?php E_('Subscribe to RSS feed') ?></a></span> <?php $count = 2; foreach ($news as $item) @@ -104,8 +104,8 @@ $head['css'] = '@media screen and (max-width:830px) { </div> <div class="column"> - <span class="rss"><a href="http://blog.xfce.org/feed"><?php E_('Subscribe to RSS feed') ?></a></span> <h2><?php E_('On the Xfce Blog') ?></h2> + <span class="rss"><a href="https://blog.xfce.org/feed"><?php E_('Subscribe to RSS feed') ?></a></span> <?php require_once('lib/simplepie/autoloader.php'); $feed = new SimplePie(); diff --git a/style/base.css b/style/base.css index a4037c4..ff7c88a 100644 --- a/style/base.css +++ b/style/base.css @@ -1,4 +1,7 @@ -/* Elements */ +/* + * Elements + * + */ body { font-family: "Bitstream Vera Sans", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif; @@ -59,7 +62,10 @@ dl dd { margin: 0 0 1em 3em; } -/* Main layout */ +/* + * Main layout + * + */ #main { width: 95%; @@ -102,18 +108,22 @@ dl dd { #mainnav-icon { display: none; height: 32px; - background: #333 url('img/menu-icon.png') no-repeat 6px 50%; + background: #1b68bf url('img/menu-button.png') no-repeat 9px 50%; - padding: 0 6px 0 32px; + padding: 0 9px 0 39px; line-height: 32px; color: #fff; font-weight: bold; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; } + #mainnav-icon:hover, #mainnav-icon:active, #mainnav-icon:focus { + background-color: #2284f2; + text-decoration: none; + } /* Content */ #content { @@ -133,7 +143,6 @@ dl dd { padding: 2em; border-right: 1px solid #ccc; line-height: 1.7em; -/* text-align: justify; */ } #article ul, #article ol { list-style-position: outside; @@ -167,7 +176,93 @@ dl dd { text-align: center; } -/* Templates */ +/* + * Templates + * + */ + +/* News */ + +.newsitem { + clear: both; + display: flex; + flex-wrap: wrap; + padding-bottom: 1em; +} + .newsitem .post-date { + flex: 1; + min-width: 50px; + max-width: 50px; + order: 2; + } + .post-month { + text-transform: uppercase; + color: #fff; + text-align: center; + display:block; + padding: 0.15em; + background: #2284f2; + } + .post-day { + text-transform: uppercase; + color: #3d3d3d; + text-align: center; + display: block; + background: #fff; + border: 1px solid rgba( 0, 0, 0, 0.2 ); + border-top: 0; + padding: 2px; + line-height: 13px; + } + .post-day .day { + font-size: 115%; + line-height: 1.3em; + font-weight: 500; + } + .post-day .year { + font-size: 85%; + color: #6d6d6d; + } + + .newsitem .post-wrap { + flex: 80; + order: 3; + padding-left: 1.2em; + } + .newsitem h2, + .newsitem h3 { + flex: 100; + order: 1; + min-width: 100%; + margin: 0 0 0.3em 0; + } + .newsitem h2 { + margin-bottom: 1em; + } + .newsitem .post-wrap p:first-child { + margin-top: 0; + } + +/* RSS icons */ + +.rss { + padding: 2px 20px 0 0; + background: url('img/feed.gif') no-repeat right center; + float: right; + font-size: 85%; +} + .rss a:link, .rss a:visited { + color: rgba(0,0,0,0.8); + } + .rss a:hover, .rss a:active, .rss a:focus { + color: #fa6e08; + } + +h1 + .rss { + margin-top: -3.5em; +} + +/* Grid for projects */ div.grid { display: flex; @@ -191,6 +286,8 @@ div.grid { min-height: 48px; } +/* Figures */ + div.figure { width: 75%; margin: auto; @@ -217,7 +314,11 @@ div.figure { margin-top: 1em; } -/* Common classes */ +/* + * Common classes + * + */ + .group:after { content: "."; display: block; diff --git a/style/css.php b/style/css.php index e657094..00d2b74 100644 --- a/style/css.php +++ b/style/css.php @@ -54,7 +54,7 @@ $buf = ''; $mtime = 0; /* load contents */ -$files = array ('header.css', 'base.css', 'frontpage.css', 'news.css', 'mobile.css'); +$files = array ('header.css', 'base.css', 'frontpage.css', 'mobile.css'); foreach ($files as $file) { $buf .= file_get_contents ($file); diff --git a/style/frontpage.css b/style/frontpage.css index b60e45e..698b4cd 100644 --- a/style/frontpage.css +++ b/style/frontpage.css @@ -1,3 +1,8 @@ +/* + * Some frontpage-specific tweaks + * + */ + #article.file_frontpage { margin-right: 0; padding: 0; @@ -14,6 +19,11 @@ margin-bottom: 0; } +/* + * Columns + * + */ + .frontpage_cols { display: flex; flex-wrap: wrap; @@ -25,6 +35,16 @@ flex: 50; } + .frontpage_cols .column h2 { + margin-top: 0; + display: inline-block; + } + +/* + * Slider + * + */ + #slidewrap { margin: auto; border-bottom: 1px solid #bcbcbc; @@ -34,146 +54,126 @@ border-top-right-radius: 4px; } -#slide { - position: relative; - overflow: hidden; - width: 100%; - height: 400px; - cursor: default; - margin: auto; -} - #slide div { - position: absolute; - top: 0; - left: 0; - + #slide { + position: relative; + overflow: hidden; width: 100%; height: 400px; - text-align: center; - - transform: translateX(100%); - - background-size: contain; - background-repeat: no-repeat; - background-position: 50% 50%; - background-size: auto 400px; + cursor: default; + margin: auto; } - #slide div:first-child { - transform: translateX(0%); - z-index: 1000; - } - #slide .current { - animation: slide-in 1s forwards; - } - #slide .prev { - animation: slide-out 1s forwards; - } - -@keyframes slide-in { - 0% { transform: translateX(100%); } - 100% { transform: translateX(0%); } -} -@keyframes slide-out { - 0% { transform: translateX(0%); } - 100% { transform: translateX(-100%); } -} - -#slide ul { - position: absolute; - list-style: none; - top: 0; - left: 0; - margin: 0; - padding: 0; -} - -#slide li { - float: left; - width: 800px; - height: 400px; -} + #slide div { + position: absolute; + top: 0; + left: 0; -#slidenavwrap { - background: #fff; -} - -#slidenav { - margin: 0 auto; - padding: 0; - line-height: 0; - background-color: #fff; - text-align: center; -} + width: 100%; + height: 400px; + text-align: center; -#slidenav a { - display: inline-block; - border: 1px solid #bcbcbc; - width: 12px; - height: 12px; - cursor: pointer; - margin: 12px 6px; - background: #dcdcdc; - - border-radius: 7px; - -moz-border-radius: 7px; - -webkit-border-radius: 7px; - - transition: background 0.2s linear; - -moz-transition: background 0.2s linear; - -webkit-transition: background 0.2s linear; - -o-transition: background 0.2s linear; -} - -#slidenav a:hover { - background: #bababa; -} + transform: translateX(100%); -#slidenav a.current { - background: #acacac; - border-color: #5f5f5f; -} - -/* Image overlays for slider */ -#slide div span { - display: block; - position: absolute; - z-index: 1; - top: 0; - left: 0; - height: 100%; - width: 100%; - - background-color: transparent; - background-position: 0 0; - background-repeat: no-repeat; -} - - /* Desktop slide */ + background-size: contain; + background-repeat: no-repeat; + background-position: 50% 50%; + background-size: auto 400px; + } + #slide div:first-child { + transform: translateX(0%); + z-index: 1000; + } + #slide .current { + animation: slide-in 1s forwards; + } + #slide .prev { + animation: slide-out 1s forwards; + } + + /* Slide animations */ + @keyframes slide-in { + 0% { transform: translateX(100%); } + 100% { transform: translateX(0%); } + } + @keyframes slide-out { + 0% { transform: translateX(0%); } + 100% { transform: translateX(-100%); } + } - #slide div span#slide-desktop-panel, - #slide div span#slide-desktop-panel-left, - #slide div span#slide-desktop-panel-right { - border-top-left-radius: 4px; - border-top-right-radius: 4px; + /* Slide navigation */ + #slidenav { + margin: 0 auto; + padding: 0; + line-height: 0; + background-color: #fff; + text-align: center; } - #slide div span#slide-desktop-panel { background-repeat: repeat-x; } - #slide div span#slide-desktop-panel-left { z-index: 2; } + #slidenav a { + display: inline-block; + border: 1px solid #bcbcbc; + width: 12px; + height: 12px; + cursor: pointer; + margin: 12px 6px; + background: #dcdcdc; + + border-radius: 7px; + -moz-border-radius: 7px; + -webkit-border-radius: 7px; + + transition: background 0.2s linear; + -moz-transition: background 0.2s linear; + -webkit-transition: background 0.2s linear; + -o-transition: background 0.2s linear; + } + #slidenav a:hover { + background: #bababa; + } + #slidenav a.current { + background: #acacac; + border-color: #5f5f5f; + } + + /* Image overlays */ + #slide div span { + display: block; + position: absolute; + z-index: 1; + top: 0; + left: 0; + height: 100%; + width: 100%; - #slide div span#slide-desktop-icons { - background-position: 24px 96px; + background-color: transparent; + background-position: 0 0; + background-repeat: no-repeat; } - /* Panel slide */ + /* Desktop slide */ - #slide div span#slide-panel-deskbar, - #slide div span#slide-panel-vertical { - border-top-left-radius: 4px; - border-top-right-radius: 4px; - } - #slide div span#slide-panel-deskbar { background-position: 100% 0; } - #slide div span#slide-panel-vertical { background-position: 0 100%; } + #slide div span#slide-desktop-panel, + #slide div span#slide-desktop-panel-left, + #slide div span#slide-desktop-panel-right { + border-top-left-radius: 4px; + border-top-right-radius: 4px; + } + #slide div span#slide-desktop-panel { background-repeat: repeat-x; } + #slide div span#slide-desktop-panel-left { z-index: 2; } + #slide div span#slide-desktop-icons { background-position: 24px 96px; } + + /* Panel slide */ + + #slide div span#slide-panel-deskbar, + #slide div span#slide-panel-vertical { + border-top-left-radius: 4px; + border-top-right-radius: 4px; + } + #slide div span#slide-panel-deskbar { background-position: 100% 0; } + #slide div span#slide-panel-vertical { background-position: 0 100%; } -/* Feeds */ +/* + * Feeds + * + */ ul.feeds { margin-left: 0 !important; diff --git a/style/img/menu-button.png b/style/img/menu-button.png new file mode 100644 index 0000000..553de88 Binary files /dev/null and b/style/img/menu-button.png differ diff --git a/style/img/menu-icon.png b/style/img/menu-icon.png deleted file mode 100644 index 3304bcf..0000000 Binary files a/style/img/menu-icon.png and /dev/null differ diff --git a/style/img/orig/slider-bg.png b/style/img/orig/slider-bg.png deleted file mode 100644 index 9669cc2..0000000 Binary files a/style/img/orig/slider-bg.png and /dev/null differ diff --git a/style/img/src/menu-button.svg b/style/img/src/menu-button.svg new file mode 100644 index 0000000..ae59430 --- /dev/null +++ b/style/img/src/menu-button.svg @@ -0,0 +1,86 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<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" + width="20.000004" + height="15" + viewBox="0 0 20.000003 15" + id="svg2" + version="1.1" + inkscape:version="0.91 r13725" + sodipodi:docname="menu-button.svg"> + <defs + id="defs4" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="16" + inkscape:cx="26.710327" + inkscape:cy="-4.2195996" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="false" + fit-margin-top="0" + fit-margin-left="0" + fit-margin-right="0" + fit-margin-bottom="0" + units="px" + inkscape:window-width="1920" + inkscape:window-height="1152" + inkscape:window-x="1920" + inkscape:window-y="0" + inkscape:window-maximized="1" /> + <metadata + id="metadata7"> + <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> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(-177.08517,-502.36233)"> + <path + style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999988;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 178.09941,504.36223 15.09816,0" + id="path8265" + inkscape:connector-curvature="0" + inkscape:export-filename="/home/knome/menu-button.png" + inkscape:export-xdpi="90" + inkscape:export-ydpi="90" /> + <path + inkscape:connector-curvature="0" + id="path8267" + d="m 178.09941,510.36223 17.75235,0" + style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999952;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + inkscape:export-filename="/home/knome/menu-button.png" + inkscape:export-xdpi="90" + inkscape:export-ydpi="90" /> + <path + style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:1.99999952;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 178.09941,516.36223 12.7933,0" + id="path8269" + inkscape:connector-curvature="0" + inkscape:export-filename="/home/knome/menu-button.png" + inkscape:export-xdpi="90" + inkscape:export-ydpi="90" /> + </g> +</svg> diff --git a/style/mobile.css b/style/mobile.css index 33c7c25..351bee6 100644 --- a/style/mobile.css +++ b/style/mobile.css @@ -6,6 +6,12 @@ margin-bottom: 0.5em; } } +@media screen and (max-width: 1200px) and (min-width: 851px) { + .frontpage_cols .column:nth-child(3) .rss { + float: none; + margin-left: 2em; + } +} @media screen and (max-width: 850px) { /* Elements */ @@ -54,9 +60,48 @@ padding: 0.3em 0.6em; display: block; } - #related-jump.file_frontpage { - display: none; - } + + /* Navigation */ + #mainnav-icon { + display: block; + float: left; + } + #mainnav div ul { + display: none; + background: #fff; + position: absolute; + margin-top: 32px; + width: 200px; + float: left; + z-index: 2000; + border: 1px solid rgba(0,0,0,0.2); + box-shadow: 0 0 2px rgba(0,0,0,0.2); + } + #mainnav div:hover ul { + display: block; + } + #mainnav div:hover #mainnav-icon { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + #mainnav ul li { + float: none; + border-left: 0; + border-top: 1px solid #fff; + padding: 0; + } + + #mainnav ul li a { + display: block; + padding: 0.4em 1em; + border-top: 1px solid rgba(0,0,0,0.1); + } + #mainnav ul li:first-child a { border-top: none; } + + #mainnav ul li a:hover { + background-color: #eee; + text-decoration: none; + } /* Templates */ div.grid { @@ -67,7 +112,7 @@ width: 90%; } - /* Frontpage: Slider */ + /* Front page: Slider */ #slidewrap { background-size: auto 185px; } @@ -90,59 +135,20 @@ #slide div span#slide-panel-vertical { display: none; } #slide div span#slide-panel-deskbar { background-position: 0 0; } - /* Frontpage: Columns */ + /* Front page: Columns */ .post-wrap { padding-bottom: 0; } .frontpage_cols { display: block; - padding: 1em; + padding: 1em 0 2em 0; } .frontpage_cols .column { margin-bottom: 2em; } + + /* Screenshots page */ #article.file_screenshots img { max-width: 48%; } - - /* Navigation */ - - #mainnav-icon { - display: block; - float: left; - } - #mainnav div ul { - display: none; - background: #333; - position: absolute; - margin-top: 32px; - color: #fff !important; - width: 200px; - float: left; - z-index: 99; - - } - #mainnav div:hover ul { - display: block; - } - #mainnav div:hover #mainnav-icon { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; - } - #mainnav ul li { - float: none; - border-left: 0; - border-top: 1px solid #fff; - padding: 0; - } - #mainnav ul li a { - display: block; - color: #fff; - padding: 6px 20px; - font-weight: bold; - } - #mainnav ul li a:hover { - background-color: #666; - text-decoration: none; - } } \ No newline at end of file diff --git a/style/news.css b/style/news.css deleted file mode 100644 index 296de0f..0000000 --- a/style/news.css +++ /dev/null @@ -1,79 +0,0 @@ -.newsitem { - clear: both; - display: flex; - flex-wrap: wrap; - padding-bottom: 1em; -} - .newsitem .post-date { - flex: 1; - min-width: 50px; - max-width: 50px; - order: 2; - } - .newsitem .post-wrap { - flex: 80; - order: 3; - padding-left: 1.2em; - } - .newsitem h2, - .newsitem h3 { - flex: 100; - order: 1; - min-width: 100%; - margin: 0 0 0.3em 0; - } - .newsitem h2 { - margin-bottom: 1em; - } - .newsitem .post-wrap p:first-child { - margin-top: 0; - } - - - -.post-month { - text-transform: uppercase; - color: #fff; - text-align: center; - display:block; - padding: 0.15em; - background: #2284f2; -} -.post-day { - text-transform: uppercase; - color: #3d3d3d; - text-align: center; - display: block; - background: #fff; - border: 1px solid rgba( 0, 0, 0, 0.2 ); - border-top: 0; - padding: 2px; - line-height: 13px; -} - .post-day .day { - font-size: 115%; - line-height: 1.3em; - font-weight: 500; - } - .post-day .year { - font-size: 85%; - color: #6d6d6d; - } - -.rss { - padding: 2px 20px 0 0; - background: url('img/feed.gif') no-repeat right center; - float: right; - font-size: 85%; -} - .rss a:link, .rss a:visited { - color: rgba(0,0,0,0.8); - } - .rss a:hover, .rss a:active, .rss a:focus { - color: #fa6e08; - } - -h1 + .rss { - margin-top: -3.5em; -} - \ No newline at end of file -- To stop receiving notification emails like this one, please contact the administrator of this repository. _______________________________________________ Xfce4-commits mailing list Xfce4-commits@xfce.org https://mail.xfce.org/mailman/listinfo/xfce4-commits