css/less updates

This commit is contained in:
Andrew Dolgov 2017-12-03 12:49:40 +03:00
parent 4dc3f7e779
commit 5e68e24679
13 changed files with 1607 additions and 1597 deletions

View File

@ -635,11 +635,10 @@ class Article extends Handler_Protected {
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/> <meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/>
<title>".$line["title"]."</title>". <title>".$line["title"]."</title>".
stylesheet_tag("css/default.css")." stylesheet_tag("css/default.css")."
<link rel=\"shortcut icon\" type=\"image/png\" href=\"images/favicon.png\"> <link rel=\"shortcut icon\" type=\"image/png\" href=\"images/favicon.png\">
<link rel=\"icon\" type=\"image/png\" sizes=\"72x72\" href=\"images/favicon-72px.png\"> <link rel=\"icon\" type=\"image/png\" sizes=\"72x72\" href=\"images/favicon-72px.png\">
</head><body id=\"ttrssZoom\">"; </head><body class=\"claro ttrss_zoom\">";
} }
$rv['content'] .= "<div class=\"postReply\" id=\"POST-$id\">"; $rv['content'] .= "<div class=\"postReply\" id=\"POST-$id\">";

View File

@ -538,14 +538,16 @@ class Handler_Public extends Handler {
header('Content-Type: text/html; charset=utf-8'); header('Content-Type: text/html; charset=utf-8');
print "<html> print "<html>
<head> <head>
<title>Tiny Tiny RSS</title> <title>Tiny Tiny RSS</title>";
<link rel=\"stylesheet\" type=\"text/css\" href=\"css/utility.css\"> print stylesheet_tag("css/utility.css");
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/> print stylesheet_tag("css/default.css");
print "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/>
<link rel=\"shortcut icon\" type=\"image/png\" href=\"images/favicon.png\"> <link rel=\"shortcut icon\" type=\"image/png\" href=\"images/favicon.png\">
<link rel=\"icon\" type=\"image/png\" sizes=\"72x72\" href=\"images/favicon-72px.png\"> <link rel=\"icon\" type=\"image/png\" sizes=\"72x72\" href=\"images/favicon-72px.png\">
</head> </head>
<body> <body class='claro'>
<img class=\"floatingLogo\" src=\"images/logo_small.png\" <img class=\"floatingLogo\" src=\"images/logo_small.png\"
alt=\"Tiny Tiny RSS\"/> alt=\"Tiny Tiny RSS\"/>
<h1>".__("Subscribe to feed...")."</h1><div class='content'>"; <h1>".__("Subscribe to feed...")."</h1><div class='content'>";

File diff suppressed because one or more lines are too long

View File

@ -9,3 +9,5 @@
@import "cdm.less"; @import "cdm.less";
@import "prefs.less"; @import "prefs.less";
@import "dijit.less"; @import "dijit.less";
@import "utility.less";
@import "zoom.less";

View File

@ -1,4 +1,5 @@
html, body#ttrssMain, body#ttrssPrefs, #main { body.ttrss_main,
body.ttrss_prefs {
width: 100%; width: 100%;
height: 100%; height: 100%;
border: 0; border: 0;

View File

@ -1,4 +1,4 @@
body#ttrssPrefs { body.ttrss_prefs {
background-color : #f5f5f5; background-color : #f5f5f5;
#footer, #header { #footer, #header {

View File

@ -1,11 +1,11 @@
body { body.ttrss_main {
background : white; background : white;
color : black; color : black;
margin : 0px; margin : 0px;
padding : 0px; padding : 0px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px; font-size: 14px;
}
body#ttrssMain { body#ttrssMain {
overflow : hidden; overflow : hidden;
@ -1223,3 +1223,7 @@ body#ttrssZoom {
} }
}

View File

@ -1,290 +0,0 @@
body.sanity_failed {
background : #900;
}
body {
background : #f5f5f5;
color : black;
padding : 0px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
margin-left : auto;
margin-right : auto;
max-width : 800px;
}
body.small_margins {
margin : 1em;
max-width : none;
}
form {
margin : 10px 0px 0px 0px;
padding : 0px;
}
div.content {
overflow : hidden;
background : white;
border : 1px solid #ddd;
padding : 10px;
border-radius : 6px;
box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
}
p.warning {
color : red;
}
p.query, code {
color : green;
}
p.insensitive {
color : gray;
}
div.insensitive-small {
color : gray;
font-size : 10px;
}
.floatingLogo {
display : none;
}
a {
color : rgb(82, 168, 236);
text-decoration : none;
}
a:hover {
color : black;
}
.alert {
padding: 8px 35px 8px 14px;
margin-bottom: 20px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
background-color: #fcf8e3;
border: 1px solid #fbeed5;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.alert,
.alert h4 {
color: #c09853;
}
.alert h4 {
margin: 0;
}
.alert .close {
position: relative;
top: -2px;
right: -21px;
line-height: 20px;
cursor : pointer;
}
.alert-success {
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.alert-success h4 {
color: #468847;
}
.alert-danger,
.alert-error {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.alert-danger h4,
.alert-error h4 {
color: #b94a48;
}
.alert-info {
color: #3a87ad;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-info h4 {
color: #3a87ad;
}
h1 {
color : rgb(82, 168, 236);
font-size : 32px;
margin : 20px 0px 5px 0px;
text-shadow : 0 0 6px #fff;
}
h2 {
color : rgb(82, 168, 236);
font-size : 14pt;
border-width : 0px 0px 1px 0px;
border-color : #f0f0f0;
border-style : solid;
}
div.content > h2 {
margin-top : 0px;
}
div.rss h1 {
border-width : 0px 0px 1px 0px;
border-color : gray;
border-style : dotted;
color : gray;
}
div.rss h2 {
font-size : 12pt;
}
div.rss a.extlink {
color : gray;
border-width : 0px 0px 1px 0px;
border-color : #778899;
border-style : dotted;
font-size : 9pt;
}
div.rss img {
max-width : 775px;
}
div.rss p.description {
color : gray;
font-size : 9pt;
}
div.rss div.content {
margin-top : 0.5em;
}
div.rss img.feedicon {
float : right;
}
div.rss hr {
border-width : 0px 0px 1px 0px;
border-style : dashed;
border-color : #e0e0e0;
}
body#sharepopup {
background-color : white;
background-image : url("../images/toolbar.png");
background-repeat : repeat-x;
background-position : bottom;
margin : 10px;
padding : 0px;
}
body#sharepopup h1 {
font-size : 14px;
margin : 0px;
color : rgb(82, 168, 236);
}
body#sharepopup table {
background : white;
border : 1px solid rgb(82, 168, 236);
padding : 5px;
}
body#sharepopup form {
height : 100%;
}
body#sharepopup input {
width : 100%;
}
div.autocomplete {
position : absolute;
width : 250px;
background-color : white;
border :1px solid #778899;
margin : 0px;
padding : 0px;
z-index : 4;
}
div.autocomplete ul {
list-style-type : none;
margin : 0px;
padding : 0px;
font-size : 10px;
}
div.autocomplete ul li.selected {
background-color : #fff7d5;
}
div.autocomplete ul li {
list-style-type : none;
display : block;
margin : 0;
padding : 2px;
height : 32px;
cursor : pointer;
}
fieldset {
border-width : 0px;
padding : 0px 0px 5px 0px;
margin : 0px;
}
fieldset input {
font-family : sans-serif;
font-size : medium;
border-spacing : 2px;
border : 1px solid #b5bcc7;
padding : 2px;
}
fieldset label {
width : 120px;
margin-right : 20px;
display : inline-block;
text-align : right;
color : gray;
}
body.otp {
margin : 1em;
padding : 0px;
}
form.otpform {
margin : 0px;
padding : 0px;
}
form.otpform label {
margin : 0px;
padding : 0px;
}
body.otp div.content {
display : inline-block;
width : auto;
}
span.hint {
font-size : 10px;
color : gray;
}

290
css/utility.less Normal file
View File

@ -0,0 +1,290 @@
body.sanity_failed {
background : #900;
}
body.ttrss_utility {
background : #f5f5f5;
color : black;
padding : 0px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
margin-left : auto;
margin-right : auto;
max-width : 800px;
form {
margin : 10px 0px 0px 0px;
padding : 0px;
}
div.content {
overflow : hidden;
background : white;
border : 1px solid #ddd;
padding : 10px;
border-radius : 6px;
box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
}
p.warning {
color : red;
}
p.query, code {
color : green;
}
p.insensitive {
color : gray;
}
div.insensitive-small {
color : gray;
font-size : 10px;
}
.floatingLogo {
display : none;
}
a {
color : rgb(82, 168, 236);
text-decoration : none;
}
a:hover {
color : black;
}
.alert {
padding: 8px 35px 8px 14px;
margin-bottom: 20px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
background-color: #fcf8e3;
border: 1px solid #fbeed5;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.alert,
.alert h4 {
color: #c09853;
}
.alert h4 {
margin: 0;
}
.alert .close {
position: relative;
top: -2px;
right: -21px;
line-height: 20px;
cursor : pointer;
}
.alert-success {
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.alert-success h4 {
color: #468847;
}
.alert-danger,
.alert-error {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.alert-danger h4,
.alert-error h4 {
color: #b94a48;
}
.alert-info {
color: #3a87ad;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-info h4 {
color: #3a87ad;
}
h1 {
color : rgb(82, 168, 236);
font-size : 32px;
margin : 20px 0px 5px 0px;
text-shadow : 0 0 6px #fff;
}
h2 {
color : rgb(82, 168, 236);
font-size : 14pt;
border-width : 0px 0px 1px 0px;
border-color : #f0f0f0;
border-style : solid;
}
div.content > h2 {
margin-top : 0px;
}
div.rss h1 {
border-width : 0px 0px 1px 0px;
border-color : gray;
border-style : dotted;
color : gray;
}
div.rss h2 {
font-size : 12pt;
}
div.rss a.extlink {
color : gray;
border-width : 0px 0px 1px 0px;
border-color : #778899;
border-style : dotted;
font-size : 9pt;
}
div.rss img {
max-width : 775px;
}
div.rss p.description {
color : gray;
font-size : 9pt;
}
div.rss div.content {
margin-top : 0.5em;
}
div.rss img.feedicon {
float : right;
}
div.rss hr {
border-width : 0px 0px 1px 0px;
border-style : dashed;
border-color : #e0e0e0;
}
body#sharepopup {
background-color : white;
background-image : url("../images/toolbar.png");
background-repeat : repeat-x;
background-position : bottom;
margin : 10px;
padding : 0px;
}
body#sharepopup h1 {
font-size : 14px;
margin : 0px;
color : rgb(82, 168, 236);
}
body#sharepopup table {
background : white;
border : 1px solid rgb(82, 168, 236);
padding : 5px;
}
body#sharepopup form {
height : 100%;
}
body#sharepopup input {
width : 100%;
}
div.autocomplete {
position : absolute;
width : 250px;
background-color : white;
border :1px solid #778899;
margin : 0px;
padding : 0px;
z-index : 4;
}
div.autocomplete ul {
list-style-type : none;
margin : 0px;
padding : 0px;
font-size : 10px;
}
div.autocomplete ul li.selected {
background-color : #fff7d5;
}
div.autocomplete ul li {
list-style-type : none;
display : block;
margin : 0;
padding : 2px;
height : 32px;
cursor : pointer;
}
fieldset {
border-width : 0px;
padding : 0px 0px 5px 0px;
margin : 0px;
}
fieldset input {
font-family : sans-serif;
font-size : medium;
border-spacing : 2px;
border : 1px solid #b5bcc7;
padding : 2px;
}
fieldset label {
width : 120px;
margin-right : 20px;
display : inline-block;
text-align : right;
color : gray;
}
body.otp {
margin : 1em;
padding : 0px;
}
form.otpform {
margin : 0px;
padding : 0px;
}
form.otpform label {
margin : 0px;
padding : 0px;
}
body.otp div.content {
display : inline-block;
width : auto;
}
span.hint {
font-size : 10px;
color : gray;
}
}
body.small_margins {
margin : 1em;
max-width : none;
}

View File

@ -1,105 +0,0 @@
body#ttrssZoom {
margin-left : auto;
margin-right : auto;
padding : 20px;
max-width : 770px;
background : #f5f5f5;
}
body#ttrssZoom div.postHeader div.postFeedTitle {
float : left;
text-align : right;
padding-left : 0px;
font-size : 11px;
}
body#ttrssZoom div.postHeader a.postComments {
text-align : right;
padding-left : 0px;
font-size : 11px;
}
body#ttrssZoom div.postHeader div.postDate {
float : none;
text-align : right;
padding-left : 0px;
color : #777;
font-size : 11px;
}
body#ttrssZoom div.postHeader div.postTags {
color : #777;
font-size : 11px;
}
body#ttrssZoom div.postHeader div.postTitle {
white-space : normal;
font-size : 16px;
}
body#ttrssZoom div.postContent {
font-size : 15px;
line-height : 1.5;
}
body#ttrssZoom div.postContent p {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
body#ttrssZoom div.postHeader {
margin : 10px;
border-width : 0px 0px 1px 0px;
border-style : solid;
border-color : #eee;
background : white;
}
body#ttrssZoom div.postReply {
border : 1px solid #ddd;
background : white;
box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
border-radius : 6px;
}
body#ttrssZoom div.footer {
margin-top : 1em;
text-align : center;
}
body#ttrssZoom div.postContent img {
max-width : 730px;
height : auto;
}
body#ttrssZoom div.postContent blockquote {
margin : 5px 0px 5px 0px;
color : #555;
padding-left : 10px;
border-width : 0px 0px 0px 4px;
border-color : #ccc;
border-style : solid;
}
body#ttrssZoom div.postContent code {
color : #009900;
font-family : monospace;
font-size : 12px;
}
body#ttrssZoom div.postContent pre {
margin : 5px 0px 5px 0px;
padding : 10px;
color : #555;
font-family : monospace;
font-size : 12px;
border-width : 0px;
border-color : #ccc;
border-style : solid;
background : #f5f5f5;
display : block;
max-width : 98%;
overflow : auto;
}

107
css/zoom.less Normal file
View File

@ -0,0 +1,107 @@
body.ttrss_zoom {
margin-left : auto;
margin-right : auto;
padding : 20px;
max-width : 770px;
background : #f5f5f5;
div.postHeader div.postFeedTitle {
float : left;
text-align : right;
padding-left : 0px;
font-size : 11px;
}
div.postHeader a.postComments {
text-align : right;
padding-left : 0px;
font-size : 11px;
}
div.postHeader div.postDate {
float : none;
text-align : right;
padding-left : 0px;
color : #777;
font-size : 11px;
}
div.postHeader div.postTags {
color : #777;
font-size : 11px;
}
div.postHeader div.postTitle {
white-space : normal;
font-size : 16px;
}
div.postContent {
font-size : 15px;
line-height : 1.5;
}
div.postContent p {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
div.postHeader {
margin : 10px;
border-width : 0px 0px 1px 0px;
border-style : solid;
border-color : #eee;
background : white;
}
div.postReply {
border : 1px solid #ddd;
background : white;
box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
border-radius : 6px;
}
div.footer {
margin-top : 1em;
text-align : center;
}
div.postContent img {
max-width : 730px;
height : auto;
}
div.postContent blockquote {
margin : 5px 0px 5px 0px;
color : #555;
padding-left : 10px;
border-width : 0px 0px 0px 4px;
border-color : #ccc;
border-style : solid;
}
div.postContent code {
color : #009900;
font-family : monospace;
font-size : 12px;
}
div.postContent pre {
margin : 5px 0px 5px 0px;
padding : 10px;
color : #555;
font-family : monospace;
font-size : 12px;
border-width : 0px;
border-color : #ccc;
border-style : solid;
background : #f5f5f5;
display : block;
max-width : 98%;
overflow : auto;
}
}

View File

@ -143,7 +143,7 @@
</script> </script>
</head> </head>
<body id="ttrssMain" class="claro"> <body class="claro ttrss_main">
<div id="overlay" style="display : block"> <div id="overlay" style="display : block">
<div id="overlay_inner"> <div id="overlay_inner">

View File

@ -109,7 +109,7 @@
</head> </head>
<body id="ttrssPrefs" class="claro"> <body class="claro ttrss_main ttrss_prefs">
<div id="notify" class="notify"></div> <div id="notify" class="notify"></div>
<div id="cmdline" style="display : none"></div> <div id="cmdline" style="display : none"></div>