xingcheng
/
FreshRSS
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix theme Origine2

Browse Source 
It should be equivalent to Origine (modulo some improvements)

See https://github.com/marienfressinaud/FreshRSS/issues/320
pull/517/head
Marien Fressinaud 10 years ago
parent 5f5bf67d84
commit 4bdabbd39f
5 changed files with 274 additions and 70 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      app/layout/layout.phtml
  2. 2
      app/views/javascript/actualize.phtml
  3. 188
      p/themes/Origine2/origine.css
  4. 76
      p/themes/Origine2/template.css
  5. 76
      p/themes/template/template.css

2
app/layout/layout.phtml
Unescape View File

@ -53,7 +53,7 @@
invalidateHttpCache();
}
?>
<div id="notification" class="<?php echo $status; ?>">
<div id="notification" class="notification <?php echo $status; ?>">
<span class="msg"><?php echo $msg; ?></span>
<a class="close" href=""><?php echo FreshRSS_Themes::icon('close'); ?></a>
</div>

2
app/views/javascript/actualize.phtml
Unescape View File

@ -9,7 +9,7 @@ var feeds = [<?php
function initProgressBar(init) {
if (init) {
$("body").after("\<div id=\"actualizeProgress\" class=\"actualizeProgress\">\
$("body").after("\<div id=\"actualizeProgress\" class=\"notification good\">\
<?php echo Minz_Translate::t ('refresh'); ?> <span class=\"progress\">0 / " + feed_count + "</span><br />\
<progress id=\"actualizeProgressBar\" value=\"0\" max=\"" + feed_count + "\"></progress>\
</div>");

188
p/themes/Origine2/origine.css
Unescape View File

@ -41,7 +41,7 @@ input, select, textarea {
border: 1px solid #bbb;
border-radius: 3px;
color: #666;
vertical-align: top;
vertical-align: middle;
box-shadow: 0 2px 2px #eee inset;
}
option {
@ -59,8 +59,7 @@ input:invalid, select:invalid {
input:disabled, select:disabled {
background: #eee;
}
input:focus.extend {
width: 300px;
input.extend {
transition: width 200ms linear;
-moz-transition: width 200ms linear;
-webkit-transition: width 200ms linear;
@ -68,6 +67,18 @@ input:focus.extend {
-ms-transition: width 200ms linear;
}
/*=== Tables */
table {
border-collapse: collapse;
text-align: center;
}
tr, th, td {
padding: 0.5em;
border: 1px solid #ddd;
font-weight: normal;
}
/*=== COMPONENTS */
/*===============*/
/*=== Forms */
@ -87,6 +98,9 @@ input:focus.extend {
min-height: 25px;
padding: 5px 0;
}
.form-group table {
margin: 10px 0 0 220px;
}
/*=== Buttons */
.stick {
@ -249,13 +263,6 @@ a.btn {
.nav-list a:hover {
text-decoration: none;
}
.nav-list .item.error a {
color: #BD362F;
}
.nav-list .item.active.error a {
color: #fff;
background: #BD362F;
}
.nav-list .item.empty a {
color: #f39c12;
}
@ -263,6 +270,13 @@ a.btn {
color: #fff;
background: #f39c12;
}
.nav-list .item.error a {
color: #BD362F;
}
.nav-list .item.active.error a {
color: #fff;
background: #BD362F;
}
.nav-list .nav-header {
padding: 0 10px;
@ -515,6 +529,7 @@ a.btn {
line-height: 3em;
font-size: 0.8em;
text-align: left;
text-decoration: none;
}
.categories .feeds .feed:not([data-unread="0"]) {
font-weight: bold;
@ -635,21 +650,38 @@ a.btn {
background: #fff;
}
.flux_header {
border-top: 1px solid #ddd;
font-size: 0.8rem;
cursor: pointer;
}
.flux .website .favicon {
padding: 5px;
}
.flux .date {
color: #666;
font-size: 0.7rem;
}
.flux:not(.current):hover .item.title {
top: 1px;
}
.flux .bottom {
font-size: 0.8rem;
text-align: center;
}
/*=== Content of feed articles */
.content {
padding: 20px 10px;
}
.content > h1.title > a {
color: #000;
}
/*=== Notification and actualize notification */
#notification {
.notification {
padding: 0 0 0 5px;
text-align: center;
border: 1px solid #eeb;
@ -659,27 +691,33 @@ a.btn {
font-size: 0.9em;
line-height: 3em;
z-index: 10;
vertical-align: middle;
}
#notification.good {
.notification.good {
background: #ffe;
border: 1px solid #eeb;
color: #c95;
}
#notification.bad {
.notification.bad {
background: #fdd;
border: 1px solid #ecc;
color: #844;
}
#notification a.close {
.notification a.close {
padding: 0 15px;
line-height: 3em;
}
#notification.good a.close:hover {
.notification.good a.close:hover {
background: #eeb;
}
#notification.bad a.close:hover {
.notification.bad a.close:hover {
background: #ecc;
}
.notification#actualizeProgress {
line-height: 2em;
}
/*=== "Load more" part */
#bigMarkAsRead {
text-align: center;
@ -701,6 +739,66 @@ a.btn {
table-layout: fixed;
}
/*=== READER VIEW */
/*================*/
#stream.reader .flux {
padding: 0 0 50px;
border: none;
background: #f0f0f0;
color: #333;
}
#stream.reader .flux .author {
margin: 0 0 10px;
font-size: 90%;
color: #666;
}
/*=== GLOBAL VIEW */
/*================*/
#stream.global .box-category {
background: #fff;
border-radius: 5px;
text-align: left;
box-shadow: 0 0 3px #bbb;
}
#stream.global .category {
margin: 0;
}
#stream.global .btn {
width: auto;
height: 2em;
margin: 0;
padding: 0 10px;
background: #f6f6f6;
border: none;
border-bottom: 1px solid #ddd;
border-radius: 5px 5px 0 0;
line-height: 2em;
font-size: 1.2rem;
}
#stream.global .btn:not([data-unread="0"]) {
background: #0084CC;
color: #fff;
font-weight: bold;
text-shadow: none;
}
#stream.global .btn:first-child:not([data-unread="0"]):after {
top: 0; right: 5px;
border: 0;
background: none;
color: #fff;
font-weight: bold;
box-shadow: none;
text-shadow: none;
}
#stream.global .box-category .feeds {
max-height: 250px;
}
#stream.global .box-category .feeds .item {
padding: 2px 10px;
font-size: 0.9rem;
}
/*=== DIVERS */
/*===========*/
@ -714,3 +812,61 @@ a.btn {
.aside.aside_feed .nav-form .dropdown .dropdown-menu:after {
right: 33px;
}
/*=== MOBILE */
/*===========*/
@media(max-width: 840px) {
.aside {
box-shadow: 3px 0 3px #aaa;
transition: width 200ms linear;
-moz-transition: width 200ms linear;
-webkit-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
}
.aside .toggle_aside,
#panel .close {
position: absolute;
display: block;
top: 0; right: 0;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
background: #f6f6f6;
border-left: 1px solid #ddd;
border-bottom: 1px solid #ddd;
border-radius: 0 0 0 5px;
}
.nav_menu .btn {
margin: 5px 10px;
}
.nav_menu .stick {
margin: 0 10px;
}
.nav_menu .stick .btn {
margin: 5px 0;
}
.nav_menu .search {
display: inline-block;
max-width: 97%;
}
.nav_menu .search input {
max-width: 97%;
width: 90px;
}
.nav_menu .search input:focus {
width: 400px;
}
.day .name {
font-size: 1.1rem;
text-shadow: none;
}
.flux_header .item.website .favicon {
padding: 12px;
}
}

76
p/themes/Origine2/template.css
Unescape View File

@ -169,8 +169,7 @@ a.btn {
position: absolute;
right: 0;
background: #fff;
border: 1px solid #aaa;
overflow: auto;
border: 1px solid #aaa;
}
.dropdown-header {
display: block;
@ -294,6 +293,10 @@ a.btn {
}
/*=== Aside main page (categories) */
.categories {
list-style: none;
margin: 0;
}
.category {
display: block;
overflow: hidden;
@ -359,10 +362,10 @@ a.btn {
position: relative;
}
.flux .item {
font-size: 0.9em;
line-height: 40px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.flux .item.manage,
.flux .item.link {
@ -391,14 +394,16 @@ a.btn {
}
.flux .item.date {
width: 145px;
font-size: 0.7em;
text-align: right;
}
.flux .item:not(.title) > a {
.flux .item > a {
display: block;
}
.flux .flux_header .item,
.flux .bottom .item.date {
.flux .item:not(.title) > a {
display: block;
text-decoration: none;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.flux .item.share > a {
@ -417,6 +422,15 @@ a.btn {
line-height: 1.7em;
word-wrap: break-word;
}
.content.large {
max-width: 1000px;
}
.content.medium {
max-width: 800px;
}
.content.thin {
max-width: 550px;
}
.content ul,
.content ol,
.content dd {
@ -428,7 +442,7 @@ a.btn {
}
/*=== Notification and actualize notification */
#notification {
.notification {
position: absolute;
top: 1em;
left: 25%; right: 25%;
@ -436,24 +450,21 @@ a.btn {
background: #fff;
border: 1px solid #aaa;
}
#notification.closed {
.notification.closed {
display: none;
}
#notification a.close {
.notification a.close {
position: absolute;
right: 0;
display: inline-block;
}
.actualizeProgress {
position: fixed;
top: 1em;
left: 25%; right: 25%;
background: #fff;
border: 1px solid #aaa;
}
.actualizeProgress progress {
#actualizeProgress progress {
max-width: 100%;
vertical-align: middle;
}
#actualizeProgress .progress {
vertical-align: middle;
}
/*=== Navigation menu (for articles) */
@ -501,9 +512,10 @@ a.btn {
/*=== Category boxes */
#stream.global .box-category {
display: inline-block;
width: 20em;
width: 19em;
max-width: 95%;
border: 1px solid #aaa;
margin: 20px 10px;
border: 1px solid #ccc;
vertical-align: top;
}
#stream.global .category {
@ -516,6 +528,10 @@ a.btn {
display: block;
overflow: auto;
}
#stream.global .box-category .feed {
width: 19em;
max-width: 90%;
}
/*=== Panel */
#overlay {
@ -571,27 +587,31 @@ a.btn {
.item.date, .day .date {
display: none;
}
.nav-login,
#panel .close img {
.nav-login {
display: block;
}
.nav_menu .toggle_aside,
.aside .toggle_aside,
.nav_menu .search {
.nav_menu .search,
#panel .close img {
display: inline-block;
}
.aside {
position: fixed;
top: 0; left: 0;
top: 0; bottom: 0;
left: 0;
width: 0;
overflow: hidden;
z-index: 10;
z-index: 100;
}
.aside:target {
width: 80%;
width: 90%;
overflow: auto;
}
.aside .categories {
margin: 10px 0 75px;
}
.flux_header .item.website {
width: 40px;
@ -614,6 +634,10 @@ a.btn {
width: 100%;
}
#stream.global .box-category {
margin: 10px 0;
}
#panel {
top: 0; bottom: 0;
left: 0; right: 0;

76
p/themes/template/template.css
Unescape View File

@ -169,8 +169,7 @@ a.btn {
position: absolute;
right: 0;
background: #fff;
border: 1px solid #aaa;
overflow: auto;
border: 1px solid #aaa;
}
.dropdown-header {
display: block;
@ -294,6 +293,10 @@ a.btn {
}
/*=== Aside main page (categories) */
.categories {
list-style: none;
margin: 0;
}
.category {
display: block;
overflow: hidden;
@ -359,10 +362,10 @@ a.btn {
position: relative;
}
.flux .item {
font-size: 0.9em;
line-height: 40px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.flux .item.manage,
.flux .item.link {
@ -391,14 +394,16 @@ a.btn {
}
.flux .item.date {
width: 145px;
font-size: 0.7em;
text-align: right;
}
.flux .item:not(.title) > a {
.flux .item > a {
display: block;
}
.flux .flux_header .item,
.flux .bottom .item.date {
.flux .item:not(.title) > a {
display: block;
text-decoration: none;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.flux .item.share > a {
@ -417,6 +422,15 @@ a.btn {
line-height: 1.7em;
word-wrap: break-word;
}
.content.large {
max-width: 1000px;
}
.content.medium {
max-width: 800px;
}
.content.thin {
max-width: 550px;
}
.content ul,
.content ol,
.content dd {
@ -428,7 +442,7 @@ a.btn {
}
/*=== Notification and actualize notification */
#notification {
.notification {
position: absolute;
top: 1em;
left: 25%; right: 25%;
@ -436,24 +450,21 @@ a.btn {
background: #fff;
border: 1px solid #aaa;
}
#notification.closed {
.notification.closed {
display: none;
}
#notification a.close {
.notification a.close {
position: absolute;
right: 0;
display: inline-block;
}
.actualizeProgress {
position: fixed;
top: 1em;
left: 25%; right: 25%;
background: #fff;
border: 1px solid #aaa;
}
.actualizeProgress progress {
#actualizeProgress progress {
max-width: 100%;
vertical-align: middle;
}
#actualizeProgress .progress {
vertical-align: middle;
}
/*=== Navigation menu (for articles) */
@ -501,9 +512,10 @@ a.btn {
/*=== Category boxes */
#stream.global .box-category {
display: inline-block;
width: 20em;
width: 19em;
max-width: 95%;
border: 1px solid #aaa;
margin: 20px 10px;
border: 1px solid #ccc;
vertical-align: top;
}
#stream.global .category {
@ -516,6 +528,10 @@ a.btn {
display: block;
overflow: auto;
}
#stream.global .box-category .feed {
width: 19em;
max-width: 90%;
}
/*=== Panel */
#overlay {
@ -571,27 +587,31 @@ a.btn {
.item.date, .day .date {
display: none;
}
.nav-login,
#panel .close img {
.nav-login {
display: block;
}
.nav_menu .toggle_aside,
.aside .toggle_aside,
.nav_menu .search {
.nav_menu .search,
#panel .close img {
display: inline-block;
}
.aside {
position: fixed;
top: 0; left: 0;
top: 0; bottom: 0;
left: 0;
width: 0;
overflow: hidden;
z-index: 10;
z-index: 100;
}
.aside:target {
width: 80%;
width: 90%;
overflow: auto;
}
.aside .categories {
margin: 10px 0 75px;
}
.flux_header .item.website {
width: 40px;
@ -614,6 +634,10 @@ a.btn {
width: 100%;
}
#stream.global .box-category {
margin: 10px 0;
}
#panel {
top: 0; bottom: 0;
left: 0; right: 0;

Write Preview
Loading…
Cancel
Save