From: Andrew Dolgov Date: Wed, 29 Nov 2017 15:55:12 +0000 (+0300) Subject: generate base css files using lessc X-Git-Tag: 17.12~107 X-Git-Url: https://git.wh0rd.org/?a=commitdiff_plain;h=9dd336a2c32d7f9dd6224602cd31a9cb2c3503fd;p=tt-rss.git generate base css files using lessc --- diff --git a/classes/article.php b/classes/article.php index 8c8e0bdd..1d5f06e7 100644 --- a/classes/article.php +++ b/classes/article.php @@ -43,7 +43,7 @@ class Article extends Handler_Protected { } else if ($mode == "raw") { if (isset($_REQUEST['html'])) { header("Content-Type: text/html"); - print ''; + print ''; } $article = $this->format_article($id, false, isset($_REQUEST["zoom"])); @@ -601,9 +601,7 @@ class Article extends Handler_Protected { $rv['content'] .= " ".$line["title"]."". - stylesheet_tag("css/tt-rss.css"). - stylesheet_tag("css/zoom.css"). - stylesheet_tag("css/dijit.css")." + stylesheet_tag("css/default.css")." diff --git a/classes/handler/public.php b/classes/handler/public.php index ec41ddb8..a98ea019 100644 --- a/classes/handler/public.php +++ b/classes/handler/public.php @@ -387,7 +387,7 @@ class Handler_Public extends Handler { "; echo stylesheet_tag("css/utility.css"); - echo stylesheet_tag("css/dijit.css"); + echo stylesheet_tag("css/default.css"); echo javascript_tag("lib/prototype.js"); echo javascript_tag("lib/scriptaculous/scriptaculous.js?load=effects,controls"); print " diff --git a/css/Makefile b/css/Makefile index c0c51abd..49bbe195 100644 --- a/css/Makefile +++ b/css/Makefile @@ -1,5 +1,4 @@ -#cdm.css: cdm.less -# lessc $^ > $@ -#tt-rss.css: tt-rss.less -# lessc $^ > $@ +default.css: *.less + cat $^ | lessc -x - > $@ + diff --git a/css/cdm.css b/css/cdm.css deleted file mode 100644 index 5f4bf300..00000000 --- a/css/cdm.css +++ /dev/null @@ -1,413 +0,0 @@ -div.cdmHeader img, div.cdmHeader input, div.cdmFooter img { - vertical-align : middle; -} - -div.cdmHeader, div.cdmFooter { - display : table; -} - -div.cdmHeader > * { - display : table-cell; - padding : 5px; -} - -div.cdmFooter > * { - display : table-cell; - vertical-align : middle; -} - -div.cdmHeader > div, div.cdmFooter > div { - white-space : nowrap; -} - -div.cdmHeader > span, div.cdmFooter > span.left { - width : 100%; -} - -div.cdmHeader span.updated { - color : #555; - font-weight : normal; - font-size : 11px; - white-space : nowrap; - vertical-align : middle; -} - -div.cdmHeader input { - margin-right : 5px; -} - -div.cdmHeader div.updPic { - width : 25px; - display : inline-block; - text-align : center; -} - -div.cdmHeader div.updPic img { - vertical-align : middle; -} - -div.cdmHeader img, div.cdmFooter img { - margin : 0px 4px; -} - -div.cdmHeader input { - margin-left : 4px; - margin-right : 4px; -} - -div.cdmIntermediate { - margin : 10px; -} - -div.cdmContentInner { - margin : 10px; - line-height : 1.5; - font-size : 16px; -} - -div.cdmIntermediate img, -div.cdmIntermediate video, -div.cdmContentInner img, -div.cdmContentInner video { - border-width : 0px; - max-width : 98%; - height : auto; -} - -div.cdmContentInner h1 { - font-size : 16px; -} - -div.cdmContentInner h2, -div.cdmContentInner h3, -div.cdmContentInner h4 { - font-size : 15px; -} - -div.cdmFooter { - height : 30px; - padding-left : 5px; - font-weight : normal; - color : #555; - clear : both; -} - -div.cdm { - margin-right : 4px; -} - -div.cdm.expanded { - margin-top : 4px; - margin-bottom : 4px; -} - -div.cdm.expanded div.cdmFooter { - border-style : solid; - border-width : 0px 0px 1px 0px; - border-color : #ddd; -} - -div.cdm.expandable { - background-color : #f0f0f0; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; -} - -div.cdm.expandable > hr { - display : none; -} - -div.cdm.expanded > hr { - margin-top : 0px; - margin-bottom : 0px; -} - -div.cdm.expandable.Unread { - background : white; -} - -div.cdm.expandable.Selected { - background : #f9fbff; -} - -div.cdm.expandable.active { - background : white ! important; -} - -div.cdm.expandable div.cdmHeader span.titleWrap { - white-space : nowrap; - text-overflow : ellipsis; - overflow : hidden; - max-width : 500px; -} - -div.cdm.expandable.active div.cdmHeader span.titleWrap { - white-space : normal; -} - -div.cdm.expandable div.cdmHeader a.title { - font-weight : 600; - color : #555; - font-size : 14px; - -webkit-transition : color 0.2s; - transition : color 0.2s; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -div.cdm.expandable.Unread div.cdmHeader a.title { - color : black; -} - -div.cdm.expandable.active div.cdmHeader a.title { - color : #0088cc; - font-size : 16px; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -div.cdm.expanded div.cdmHeader { - background : transparent ! important; -} - -div.cdm.expanded div.cdmHeader a.title { - font-size : 16px; - color : #999; - font-weight : 600; - -webkit-transition : color 0.2s; - transition : color 0.2s; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -div.cdm.expanded.active { - background : white; -} - -div.cdm.expanded.active div.cdmHeader a.title { - color : #0088cc; -} - -div.cdm.expanded.Unread div.cdmHeader a.title { - color : black; -} - -div.cdm.expanded div.cdmContent { - color : #555; -} - -div.cdm.expanded.Unread div.cdmContent { - color : black; -} - -div.cdm.active div.cdmContent { - color : black; -} - -span.cdmExcerpt { - white-space : nowrap; - font-size : 11px; - color : #999; - font-weight : normal; - cursor : pointer; -} - -div.cdmContent div.postEnclosures { - margin-top : 1em; - color : #555; -} - -div.cdmFeedTitle { - border-color : #0088cc; - border-width : 0px 0px 1px 0px; - border-style : solid; - padding : 5px 3px 5px 5px; -} - -div.cdmFeedTitle a.title { - color : #555; - font-weight : bold; -} - -div.cdmFeedTitle a { - color : #555; -} - -div.cdmFeedTitle a:hover { - color : #0088cc; -} - -div.cdmHeader span.hlFeed { - float : right; - font-weight : normal; - font-style : italic; -} - -div.cdmHeader div.hlFeed, div.cdmHeader div.hlFeed a { - vertical-align : middle; - color : #555; - font-weight : normal; - font-style : italic; - font-size : 11px; -} - -div.cdm .hlFeed a { - border-radius : 4px; - display : inline-block; - padding : 1px 4px 1px 4px; -} - -div.cdmContentInner p { - /*max-width : 650px;*/ - -webkit-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; -} - -div.cdmContentInner iframe { - min-width : 50%; - max-width : 98%; -} - -div.cdmHeader span.author { - white-space : nowrap; - color : #555; - font-size : 11px; - font-weight : normal; -} - - -div#floatingTitle { - position : absolute; - z-index : 5; - top : 0px; - right : 0px; - left : 0px; - border-color : #ddd; - border-width : 0px 0px 1px 0px; - border-style : solid; - background : white; - color : #555; - box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1); -} - -div#floatingTitle > * { - display : table-cell; - white-space : nowrap; - vertical-align : middle; - padding : 9px 5px; -} - -div#floatingTitle img { - margin-right : 4px; - margin-left : 4px; -} - -div#floatingTitle span.author { - color : #555; - font-size : 11px; - font-weight : normal; -} - -div#floatingTitle a.title { - font-size : 16px; - color : #999; - -webkit-transition : color 0.2s; - transition : color 0.2s; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -div#floatingTitle.Unread a.title { - color : black; -} - -div#floatingTitle img.anchor { - margin-left : 0px; -} - -div#floatingTitle div.hlFeed { - padding-right : 10px; - color : #555; - font-weight : normal; - font-style : italic; - font-size : 11px; - white-space : nowrap; -} - -div#floatingTitle div.hlFeed a { - border-radius : 4px; - display : inline-block; - padding : 1px 4px 1px 4px; -} - -div#floatingTitle span.updated { - padding-right : 10px; - white-space : nowrap; - color : #555; - font-size : 11px; -} - -div#floatingTitle div.hlFeed a { - color : #555; -} - -div#floatingTitle span.titleWrap { - width : 100%; - white-space : normal; -} - -div#floatingTitle .dijit, -div#floatingTitle img.hlScorePic { - display : none; -} - -.cdm.high .cdmHeader a.title.high, .cdm.high .cdmHeader .cdmExcerpt, -.cdm.high .cdmHeader span.author { - color : #00aa00; -} - -.cdm.Unread.high .cdmHeader a.title.high, .cdm.Unread.high .cdmHeader .cdmExcerpt, -.cdm.Unread.high .cdmHeader span.author { - color : #00dd00; -} - -.cdm .cdmHeader a.title.low, .cdm.low .cdmHeader .cdmExcerpt, -.cdm.Unread .cdmHeader a.title.low, .cdm.Unread.low .cdmHeader .cdmExcerpt, -.cdm.low .cdmHeader span.author { - color : #909090; - text-decoration : line-through; -} - -div.cdmFeedTitle > * { - display : table-cell; - vertical-align : middle; -} - -div.cdmFeedTitle a.title { - width : 100%; -} - -div.cdmFeedTitle a.catchup { - text-align : right; - color : #555; - padding-right : 10px; - font-size : 11px; - white-space : nowrap; -} - -div.cdmFeedTitle a.catchup:hover { - color : #0088cc; -} - diff --git a/css/cdm.less b/css/cdm.less index ebefeabb..e1cf76ec 100644 --- a/css/cdm.less +++ b/css/cdm.less @@ -1,4 +1,5 @@ -@fonts-ui: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; +@fonts-ui-bold: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; +@fonts-ui: "Segoe UI Web", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; .cdm { margin-right : 4px; @@ -106,9 +107,8 @@ margin-bottom : 4px; .cdmFooter { - border-style : solid; - border-width : 0px 0px 1px 0px; - border-color : #ddd; + border: 0px solid #ddd; + border-bottom-width: 1px; } > hr { @@ -120,9 +120,8 @@ .cdm.expandable { background-color : #f0f0f0; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; + border: 0px solid #ddd; + border-bottom-width: 1px; > hr { display : none; @@ -159,7 +158,7 @@ div.cdm.expandable div.cdmHeader a.title { -webkit-transition : color 0.2s; transition : color 0.2s; text-rendering: optimizelegibility; - font-family : @fonts-ui; + font-family : @fonts-ui-bold; } div.cdm.expandable.Unread div.cdmHeader a.title { @@ -171,7 +170,7 @@ div.cdm.expandable.active div.cdmHeader a.title { font-size: 16px; font-weight: 600; text-rendering: optimizelegibility; - font-family: @fonts-ui; + font-family: @fonts-ui-bold; } div.cdm.expanded div.cdmHeader { @@ -185,7 +184,7 @@ div.cdm.expanded div.cdmHeader a.title { -webkit-transition : color 0.2s; transition : color 0.2s; text-rendering: optimizelegibility; - font-family : @fonts-ui; + font-family : @fonts-ui-bold; } div.cdm.expanded.active { @@ -226,9 +225,8 @@ div.cdmContent div.postEnclosures { } div.cdmFeedTitle { - border-color : #0088cc; - border-width : 0px 0px 1px 0px; - border-style : solid; + border: 0px solid #0088cc; + border-bottom-width: 1px; padding : 5px 3px 5px 5px; } @@ -290,9 +288,8 @@ div#floatingTitle { top : 0px; right : 0px; left : 0px; - border-color : #ddd; - border-width : 0px 0px 1px 0px; - border-style : solid; + border: 0px solid #ddd; + border-bottom-width: 1px; background : white; color : #555; box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1); @@ -322,7 +319,7 @@ div#floatingTitle { transition : color 0.2s; font-weight : 600; text-rendering: optimizelegibility; - font-family : @fonts-ui; + font-family : @fonts-ui-bold; } img.anchor { @@ -420,5 +417,3 @@ div#floatingTitle.Unread a.title { } } - - diff --git a/css/dijit.css b/css/dijit.css deleted file mode 100644 index b0c9243c..00000000 --- a/css/dijit.css +++ /dev/null @@ -1,666 +0,0 @@ -/* Tree */ - -.claro .dijitTreeRow .dijitCheckBox { - position : relative; - top : -2px; -} - -.claro .dijitTreeLabel { - outline : 0; -} - -.claro .dijitTree .feedParam { - color : #555; - float : right; - margin-right : 1em; -} - -.claro .dijitTree .filterRules { - display : block; - color : #ccc; - font-size : 10px; - margin-left : 100px; -} - -.claro .dijitTree .filterRules span { - display : block; - color : green; -} - -#filterDlg_Matches span.filterRule { - color : green; -} - -.claro .dijitTree .filterRules span.inverse, -#filterDlg_Matches span.filterRule.inverse { - color : red; -} - - -.claro .dijitTree .labelParam { - float : right; - margin-right : 1em; -} - -.claro .dijitTree .dijitTreeLabel.filterDisabled, -.claro .dijitTree .labelParam.filterDisabled { - color : #555; - text-decoration: line-through; -} - -.claro .dijitTreeRow.Error { - color : red; -} - -.claro .dijitTreeRow.Hidden { - display : none; -} - -.claro .dijitTreeNode .loadingNode { - margin-left : 3px; - height : 9px; -} - -.claro .dijitFolderClosed, -.claro .dijitFolderOpened { - display : none; -} - -.claro .dijitTreeNode .dijitCheckBox { - margin-left : 4px; -} - -.claro .dijitTreeIsRoot > .dijitTreeRow > .dijitTreeExpando { - margin-left : 5px; -} - -.claro .dijitTree .dijitTreeExpando { - margin-top : 0px; - opacity : 0.6; -} - -.claro .dijitTree .dijitTreeNode { - padding : 0px; - border-width : 0px; -} - -/*.claro .dijitTree .dijitTreeRow { - max-width: 100%; - overflow: hidden; - text-overflow: ellipsis; -}*/ - -.claro .dijitTree .dijitTreeRowSelected { - background : white; -} - -.claro .dijitTree .dijitTreeRowHover { - background : #f0f0f0; - border-color : #ddd; -} - -.claro .dijitTree .dijitTreeRowSelected { - background : white; - border-color : #ddd; -} - -.claro .dijitTreeRowSelected .dijitTreeLabel { - text-shadow : 1px 1px 2px #fff; -} - -.claro .dijitTreeRow .dijitTreeExpando { - background-image: url("../images/treeExpandImages.png"); - position : relative; - top : -1px; -} - -.claro .dijitTreeRow .dijitTreeExpandoLeaf { - background : none; -} - -/* Toolbar */ - -.claro .dijitToolbar { - background : #f5f5f5; - border-color : #ddd; - /* text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue", - Helvetica, Arial, sans-serif; */ -} - -/* .claro .dijitToolbar { - text-shadow : 1px 1px 2px #fff; -} */ - -.claro .dijitDialog .dijitToolbar { - border : 1px solid #ddd; -} - -/* Dialog */ - -.claro .dijitDialog h2 { - margin-top : 0px; - margin-bottom : 4px; - border-width : 0px; -} - -.claro .dijitMenu .dijitMenuItem .dijitMenuItemLabel { - font-size : 13px; - padding-top : 3px; - padding-bottom : 3px; -} - -/* Checkbox */ - -.claro .dijitCheckBox { - background-image : url("../images/untick.png"); - background-color : transparent; - width : 15px; - height : 15px; - margin : 1px; - opacity : 0.7; - background-position : center center; - transition : opacity 0.25s; - -webkit-transition : opacity 0.25s; - /* border : 1px solid #b5bcc7; */ - padding : 1px; -} - - .claro .dijitCheckBox:hover { - opacity : 1; -} - -.claro .dijitCheckBox.dijitCheckBoxDisabled:hover { - opacity : 0.7; -} - -.claro .dijitCheckBox.dijitCheckBoxChecked { - border-color : #69C671; - background-image : url("../images/tick.png"); - opacity : 1; -} - -/* Various buttons */ - -.claro .dijitButton.danger .dijitButtonText { - color: #ffffff; -} - -.claro .dijitButton.danger { - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - background-color: #da4f49; - *background-color: #bd362f; - background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f)); - background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f); - background-image: -o-linear-gradient(top, #ee5f5b, #bd362f); - background-image: linear-gradient(to bottom, #ee5f5b, #bd362f); - background-repeat: repeat-x; - border-color: #bd362f #bd362f #802420; - border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0); - filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); -} - -.claro .dijitButton.dijitButtonDisabled.danger, -.claro .dijitButton.dijitButtonActive.danger, -.claro .dijitButton.dijitButtonHover.danger, -.claro .dijitButton.dijitFocused.danger { - color: #ffffff; - background-color: #bd362f; - *background-color: #a9302a; -} - -.claro .dijitButton.dijitButtonActive.danger { - background-color: #942a25 \9; -} - -.claro .dijitDropDownButton { - margin : 0px; -} - -.claro .dijitDropDownButton .dijitButtonNode { - padding : 0px; -} - -.claro .dijitButton.dijitButtonActive.danger { - color: rgba(255, 255, 255, 0.75); -} - -.claro .dijitButton .dijitButtonNode, -.claro .dijitDropDownButton .dijitButtonNode, -.claro .dijitComboButton .dijitButtonNode, -.claro .dijitToolbar .dijitDropDownButton .dijitButtonNode, -.claro .dijitToolbar .dijitComboButton, -.claro .dijitToolbar .dijitSelect.dijitDownArrowButton .dijitButtonNode, -.claro .dijitToolbar .dijitComboButton .dijitButtonNode { - background : none; - border-color : transparent; - box-shadow : none; -} - -button, -input[type="submit"] { - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size : 14px; -} - -button, -input[type="submit"], -.claro .dijitButton, -.claro .dijitDropDownButton .dijitDownArrowButton, -.claro .dijitComboButton { - display: inline-block; - padding: 4px 12px; - margin-bottom: 0; - font-size: 14px; - line-height: 20px; - color: #333333; - text-align: center; - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); - vertical-align: middle; - cursor: pointer; - background-color: #f5f5f5; - background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); - background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); - background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); - background-repeat: repeat-x; - border: 1px solid #cccccc; - border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); - border-bottom-color: #b3b3b3; - -webkit-border-radius: 4px; - border-radius: 4px; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -} - -button:hover, -button:focus, -button:active, -input[type="submit"]:hover, -input[type="submit"]:focus, -input[type="submit"]:active, -.claro .dijitButton:hover, -.claro .dijitButton:focus, -.claro .dijitButton:active, -.claro .dijitDropDownButton .dijitDownArrowButton:hover, -.claro .dijitDropDownButton .dijitDownArrowButton:focus, -.claro .dijitDropDownButton .dijitDownArrowButton:active, -.claro .dijitComboButton:hover, -.claro .dijitComboButton:focus, -.claro .dijitComboButton:active, -.claro .dijitButton.dijitButtonDisabled { - color: #333333; - background-color: #e6e6e6; -} - -button:active, -input[type="submit"]:active, -.claro .dijitButton:active, -.claro .dijitDropDownButton .dijitDownArrowButton:active, -.claro .dijitComboButton:active { - background-color: #cccccc \9; -} - -.claro .dijitToolbar .dijitButton, -.claro .dijitToolbar .dijitButton.dijitHover, -.claro .dijitToolbar .dijitComboButton, -.claro .dijitToolbar .dijitDropDownButton .dijitDownArrowButton, -.claro .dijitToolbar .dijitComboButton.dijitHover { - background : none; - border-color : transparent; - box-shadow : none; - padding : 0px; - margin : 0px; - line-height : auto; - text-shadow : none; -} - -.claro .dijitToolbar .dijitDropDownButton .dijitButtonText, -.claro .dijitToolbar .dijitDownArrowButton .dijitButtonText, -.claro .dijitToolbar .dijitComboButton .dijitButtonText { - padding : 0px; -} - -.claro .dijitToolbar .dijitDropDownButton .dijitButtonNode { - border-radius : 4px; -} - -.claro .dijitToolbar .dijitButton.dijitHover, -.claro .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode, -.claro .dijitToolbar .dijitComboButton.dijitHover { - border-color : #ccc; -} - -.claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode, -.claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode { - background : none; -} - -.claro .dijitToolbar .dijitButton .dijitButtonContents, -.claro .dijitToolbar .dijitDropDownButton .dijitButtonContents, -.claro .dijitToolbar .dijitComboButton .dijitButtonContents { - font-size : 13px; -} - -button:hover, -button:focus, -input[type="submit"]:hover, -input[type="submit"]:focus, -.claro .dijitButton:hover, -.claro .dijitDropDownButton .dijitDownArrowButton:hover, -.claro .dijitToolbar .dijitButton:hover .dijitButtonNode, -.claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode, -.claro .dijitButton:focus, -.claro .dijitComboButton:hover, -.claro .dijitComboButton:focus { - color: #333333; - text-decoration: none; - background-position: 0 -15px; - -webkit-transition: background-position 0.1s linear; - transition: background-position 0.1s linear; -} - -button:focus, -input[type="submit"]:focus, -.claro .dijitButton:focus, -.claro .dijitDropDownButton .dijitDownArrowButton:focus, -.claro .dijitComboButton:focus { - outline: thin dotted #333; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; -} - -button:active, -input[type="submit"]:active, -.claro .dijitButton:active, -.claro .dijitComboButton:active, -.claro .dijitToolbar .dijitDropDownButton.dijitOpened, -.claro .dijitToolbar .dijitComboButton.dijitOpened, -.claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode { - background-image: none; - outline: 0; - -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); - box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); -} - -input[type="submit"][disabled], -button[disabled], -.claro .dijitButton[disabled], -.claro .dijitDropDownButton .dijitDownArrowButton[disabled], -.claro .dijitButton.dijitButtonDisabled, -.claro .dijitComboButton.dijitButtonDisabled { - cursor: default; - background-image: none; - opacity: 0.65; - filter: alpha(opacity=65); - -webkit-box-shadow: none; - box-shadow: none; -} - -.claro .dijitButton .dijitButtonContents, -.claro .dijitDropDownButton .dijitButtonContents, -.claro .dijitComboButton .dijitButtonContents { - font-size : 14px; - font-weight : normal; - line-height : 20px; -} - -.claro .dijitButton.small .dijitButtonText { - font-size : 11px; -} - -.claro .dijitMenu { - border-color: rgba(82, 168, 236, 0.8); -} - -.claro .dijitMenu .dijitMenuItemSelected, -.claro .dijitMenu .dijitMenuItemSelected td { - background : rgb(82, 168, 236); - color : white; - border-color : rgba(82, 168, 236, 0.8); -} - -.claro .dijitButton .dijitButtonNode, -.claro .dijitComboButton .dijitButtonNode { - padding : 0px; -} - -/* Other stuff */ - -/* .claro .dijitAccordionTitleFocus { - text-shadow : 1px 1px 2px #fff; -} - -.claro .dijitAccordionTitle { - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue", - Helvetica, Arial, sans-serif; -} */ - - -.claro .dijitAccordionTitle.dijitAccordionTitleHover, -.claro .dijitAccordionTitle.dijitAccordionTitleFocused { - background : white; - transition : background 0.25s; -} -.claro .dijitAccordionTitle { - background : #f0f0f0; - transition : background 0.25s; -} - -.claro .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected, -.claro .dijitAccordionTitle.dijitAccordionTitleSelected { - background : #0088cc; - transition : background 0.25s; -} - -.claro .dijitAccordionTitle.dijitAccordionTitleSelected .dijitAccordionText { - color : white; -} - -.claro .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected { - border-color : #0088cc; -} - -.claro .dijitAccordionContainer .dijitAccordionChildWrapper { - border-color : #ddd; -} - -/* Tabs */ - -.claro .dijitTabInner.dijitTab { - background : #f0f0f0; -} - -.claro .dijitTabContent { - background : #eee; -} - -.claro .dijitTabContent.dijitTabChecked, -.claro .dijitTabContent.dijitTabHover, -.claro .dijitTabContent.dijitFocused { - background : white; -} - -.claro .dijitTabPaneWrapper, -.claro .dijitTabContainerTop-tabs, -.claro .dijitTab, -.claro .dijitAccordionInnerContainer { - border-color : #ddd; -} - -/* Text fields & selects */ - -.claro .dijitComboBox .dijitArrowButton, -.claro .dijitSelect .dijitArrowButton { - background : transparent; - border-color : transparent; -} - -.claro .dijitSelect .dijitArrowButton .dijitArrowButtonInner { - margin-right : 5px; - float :right; -} - -.claro select, -.claro .dijitDownArrowButton.dijitSelect { - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - margin-bottom : 4px; - -} - -.claro .dijitSelect .dijitButtonContents { - display: inline-block; - height: 20px; - padding: 4px 6px; - font-size: 14px; - line-height: 20px; - color: #555555; - vertical-align: middle; - border-width : 0px; -} - -.claro select, -.claro textarea, -.claro .input.input-text, -.claro .dijitTextBox { - display: inline-block; - height: 20px; - padding: 4px 6px; - font-size: 14px; - line-height: 20px; - color: #555555; - vertical-align: middle; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - margin-bottom : 4px; -} -.claro textarea { - height : auto; -} - -.claro select, -.claro .input.input-text { - height : 30px; -} - -.claro textarea, -.claro select, -.claro .input.input-text, -.claro .dijitTextBox, -.claro .dijitSelect { - background-color: #ffffff; - border: 1px solid #cccccc; - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; - -moz-transition: border linear 0.2s, box-shadow linear 0.2s; - -o-transition: border linear 0.2s, box-shadow linear 0.2s; - transition: border linear 0.2s, box-shadow linear 0.2s; -} - -.claro select:focus, -.claro .input.input-text:focus, -.claro .dijitTextBox.dijitFocused, -.claro .dijitSelect.dijitFocused { - border-color: rgba(82, 168, 236, 0.8); - outline: 0; - outline: thin dotted \9; - /* IE6-9 */ - - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); -} - -.claro .dijitError .dijitValidationContainer { - padding : 0px; - width : 13px; - border-width : 1px; - display : none; -} - -.claro .dijitSelect.dijitSelectDisabled { - background-color: #eeeeee; -} - -.claro .dijitSelect.dijitSelectDisabled .dijitSelectLabel { - cursor: not-allowed; -} - -.claro .dijitTextBox.dijitTextBoxDisabled, -.claro .dijitTextBox.dijitTextBoxDisabled .dijitInputInner, -.claro .dijitTextBox.dijitReadOnly, -.claro .dijitTextBox.dijitReadOnly .dijitInputInner { - cursor: not-allowed; - background-color: #eeeeee; -} - -.claro .dijitToolbar .dijitDownArrowButton.dijitSelect { - border-color : rgba(0,0,0,0.1); -} - -.claro .dijitToolbar .dijitDownArrowButton.dijitSelect .dijitButtonContents { - padding : 2px 2px 0px 4px; -} - -.claro .dijitToolbar .dijitDownArrowButton.dijitSelect { - margin : 0px; -} - -.claro .dijitToolbar .dijitTextBox { - padding : 0px; - margin-bottom : 0px; - border-radius : 0px; -} - -/* dialog */ - -.claro .dijitDialog { - border-radius : 6px; - -} - -.claro .dijitDialog .dijitDialogCloseIcon { - margin-top : 5px; -} - -.claro .dijitDialog .dijitDialogTitleBar { - background : white; - padding : 8px; - font-weight : 600; - color : #555; - font-size : 16px; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -.claro .dijitDialog .dijitDialogPaneContent { - border-color : #ddd; - padding : 10px; -} - -.claro .dijitProgressBar.dijitProgressBarEmpty { - background : #ddd; - border-color : #0088cc; -} - -.claro .dijitProgressBar.dijitProgressBarEmpty .dijitProgressBarFull .dijitProgressBarTile { - background : rgb(82, 168, 236); - -} - -.claro .dijitProgressBar .dijitProgressBarLabel { - color : white; -} - - diff --git a/css/dijit.less b/css/dijit.less new file mode 100644 index 00000000..73f85643 --- /dev/null +++ b/css/dijit.less @@ -0,0 +1,666 @@ +/* Tree */ + +.claro { + + .dijitTreeRow .dijitCheckBox { + position: relative; + top: -2px; + } + + .dijitTreeLabel { + outline: 0; + } + + .dijitTree .feedParam { + color: #555; + float: right; + margin-right: 1em; + } + + .dijitTree .filterRules { + display: block; + color: #ccc; + font-size: 10px; + margin-left: 100px; + } + + .dijitTree .filterRules span { + display: block; + color: green; + } + + #filterDlg_Matches span.filterRule { + color: green; + } + + .dijitTree .filterRules span.inverse, + #filterDlg_Matches span.filterRule.inverse { + color: red; + } + + .dijitTree .labelParam { + float: right; + margin-right: 1em; + } + + .dijitTree .dijitTreeLabel.filterDisabled, + .dijitTree .labelParam.filterDisabled { + color: #555; + text-decoration: line-through; + } + + .dijitTreeRow.Error { + color: red; + } + + .dijitTreeRow.Hidden { + display: none; + } + + .dijitTreeNode .loadingNode { + margin-left: 3px; + height: 9px; + } + + .dijitFolderClosed, + .dijitFolderOpened { + display: none; + } + + .dijitTreeNode .dijitCheckBox { + margin-left: 4px; + } + + .dijitTreeIsRoot > .dijitTreeRow > .dijitTreeExpando { + margin-left: 5px; + } + + .dijitTree .dijitTreeExpando { + margin-top: 0px; + opacity: 0.6; + } + + .dijitTree .dijitTreeNode { + padding: 0px; + border-width: 0px; + } + + /*.dijitTree .dijitTreeRow { + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + }*/ + + .dijitTree .dijitTreeRowSelected { + background: white; + } + + .dijitTree .dijitTreeRowHover { + background: #f0f0f0; + border-color: #ddd; + } + + .dijitTree .dijitTreeRowSelected { + background: white; + border-color: #ddd; + } + + .dijitTreeRowSelected .dijitTreeLabel { + text-shadow: 1px 1px 2px #fff; + } + + .dijitTreeRow .dijitTreeExpando { + background-image: url("../images/treeExpandImages.png"); + position: relative; + top: -1px; + } + + .dijitTreeRow .dijitTreeExpandoLeaf { + background: none; + } + + /* Toolbar */ + + .dijitToolbar { + background: #f5f5f5; + border-color: #ddd; + /* text-rendering: optimizelegibility; + font-family : "Segoe WP Semibold", "Segoe UI Semibold", + "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue", + Helvetica, Arial, sans-serif; */ + } + + /* .dijitToolbar { + text-shadow : 1px 1px 2px #fff; + } */ + + .dijitDialog .dijitToolbar { + border: 1px solid #ddd; + } + + /* Dialog */ + + .dijitDialog h2 { + margin-top: 0px; + margin-bottom: 4px; + border-width: 0px; + } + + .dijitMenu .dijitMenuItem .dijitMenuItemLabel { + font-size: 13px; + padding-top: 3px; + padding-bottom: 3px; + } + + /* Checkbox */ + + .dijitCheckBox { + background-image: url("../images/untick.png"); + background-color: transparent; + width: 15px; + height: 15px; + margin: 1px; + opacity: 0.7; + background-position: center center; + transition: opacity 0.25s; + -webkit-transition: opacity 0.25s; + /* border : 1px solid #b5bcc7; */ + padding: 1px; + } + + .dijitCheckBox:hover { + opacity: 1; + } + + .dijitCheckBox.dijitCheckBoxDisabled:hover { + opacity: 0.7; + } + + .dijitCheckBox.dijitCheckBoxChecked { + border-color: #69C671; + background-image: url("../images/tick.png"); + opacity: 1; + } + + /* Various buttons */ + + .dijitButton.danger .dijitButtonText { + color: #ffffff; + } + + .dijitButton.danger { + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); + background-color: #da4f49; + *background-color: #bd362f; + background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f)); + background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f); + background-image: -o-linear-gradient(top, #ee5f5b, #bd362f); + background-image: linear-gradient(to bottom, #ee5f5b, #bd362f); + background-repeat: repeat-x; + border-color: #bd362f #bd362f #802420; + border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0); + filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); + } + + .dijitButton.dijitButtonDisabled.danger, + .dijitButton.dijitButtonActive.danger, + .dijitButton.dijitButtonHover.danger, + .dijitButton.dijitFocused.danger { + color: #ffffff; + background-color: #bd362f; + *background-color: #a9302a; + } + + .dijitButton.dijitButtonActive.danger { + background-color: #942a25 \9; + } + + .dijitDropDownButton { + margin: 0px; + } + + .dijitDropDownButton .dijitButtonNode { + padding: 0px; + } + + .dijitButton.dijitButtonActive.danger { + color: rgba(255, 255, 255, 0.75); + } + + .dijitButton .dijitButtonNode, + .dijitDropDownButton .dijitButtonNode, + .dijitComboButton .dijitButtonNode, + .dijitToolbar .dijitDropDownButton .dijitButtonNode, + .dijitToolbar .dijitComboButton, + .dijitToolbar .dijitSelect.dijitDownArrowButton .dijitButtonNode, + .dijitToolbar .dijitComboButton .dijitButtonNode { + background: none; + border-color: transparent; + box-shadow: none; + } + + button, + input[type="submit"] { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 14px; + } + + button, + input[type="submit"], + .dijitButton, + .dijitDropDownButton .dijitDownArrowButton, + .dijitComboButton { + display: inline-block; + padding: 4px 12px; + margin-bottom: 0; + font-size: 14px; + line-height: 20px; + color: #333333; + text-align: center; + text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); + vertical-align: middle; + cursor: pointer; + background-color: #f5f5f5; + background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); + background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); + background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); + background-repeat: repeat-x; + border: 1px solid #cccccc; + border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); + border-bottom-color: #b3b3b3; + -webkit-border-radius: 4px; + border-radius: 4px; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); + } + + button:hover, + button:focus, + button:active, + input[type="submit"]:hover, + input[type="submit"]:focus, + input[type="submit"]:active, + .dijitButton:hover, + .dijitButton:focus, + .dijitButton:active, + .dijitDropDownButton .dijitDownArrowButton:hover, + .dijitDropDownButton .dijitDownArrowButton:focus, + .dijitDropDownButton .dijitDownArrowButton:active, + .dijitComboButton:hover, + .dijitComboButton:focus, + .dijitComboButton:active, + .dijitButton.dijitButtonDisabled { + color: #333333; + background-color: #e6e6e6; + } + + button:active, + input[type="submit"]:active, + .dijitButton:active, + .dijitDropDownButton .dijitDownArrowButton:active, + .dijitComboButton:active { + background-color: #cccccc \9; + } + + .dijitToolbar .dijitButton, + .dijitToolbar .dijitButton.dijitHover, + .dijitToolbar .dijitComboButton, + .dijitToolbar .dijitDropDownButton .dijitDownArrowButton, + .dijitToolbar .dijitComboButton.dijitHover { + background: none; + border-color: transparent; + box-shadow: none; + padding: 0px; + margin: 0px; + line-height: auto; + text-shadow: none; + } + + .dijitToolbar .dijitDropDownButton .dijitButtonText, + .dijitToolbar .dijitDownArrowButton .dijitButtonText, + .dijitToolbar .dijitComboButton .dijitButtonText { + padding: 0px; + } + + .dijitToolbar .dijitDropDownButton .dijitButtonNode { + border-radius: 4px; + } + + .dijitToolbar .dijitButton.dijitHover, + .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode, + .dijitToolbar .dijitComboButton.dijitHover { + border-color: #ccc; + } + + .dijitToolbar .dijitButton.dijitHover .dijitButtonNode, + .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode { + background: none; + } + + .dijitToolbar .dijitButton .dijitButtonContents, + .dijitToolbar .dijitDropDownButton .dijitButtonContents, + .dijitToolbar .dijitComboButton .dijitButtonContents { + font-size: 13px; + } + + button:hover, + button:focus, + input[type="submit"]:hover, + input[type="submit"]:focus, + .dijitButton:hover, + .dijitDropDownButton .dijitDownArrowButton:hover, + .dijitToolbar .dijitButton:hover .dijitButtonNode, + .dijitToolbar .dijitButton.dijitHover .dijitButtonNode, + .dijitButton:focus, + .dijitComboButton:hover, + .dijitComboButton:focus { + color: #333333; + text-decoration: none; + background-position: 0 -15px; + -webkit-transition: background-position 0.1s linear; + transition: background-position 0.1s linear; + } + + button:focus, + input[type="submit"]:focus, + .dijitButton:focus, + .dijitDropDownButton .dijitDownArrowButton:focus, + .dijitComboButton:focus { + outline: thin dotted #333; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; + } + + button:active, + input[type="submit"]:active, + .dijitButton:active, + .dijitComboButton:active, + .dijitToolbar .dijitDropDownButton.dijitOpened, + .dijitToolbar .dijitComboButton.dijitOpened, + .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode { + background-image: none; + outline: 0; + -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); + box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); + } + + input[type="submit"][disabled], + button[disabled], + .dijitButton[disabled], + .dijitDropDownButton .dijitDownArrowButton[disabled], + .dijitButton.dijitButtonDisabled, + .dijitComboButton.dijitButtonDisabled { + cursor: default; + background-image: none; + opacity: 0.65; + filter: alpha(opacity=65); + -webkit-box-shadow: none; + box-shadow: none; + } + + .dijitButton .dijitButtonContents, + .dijitDropDownButton .dijitButtonContents, + .dijitComboButton .dijitButtonContents { + font-size: 14px; + font-weight: normal; + line-height: 20px; + } + + .dijitButton.small .dijitButtonText { + font-size: 11px; + } + + .dijitMenu { + border-color: rgba(82, 168, 236, 0.8); + } + + .dijitMenu .dijitMenuItemSelected, + .dijitMenu .dijitMenuItemSelected td { + background: rgb(82, 168, 236); + color: white; + border-color: rgba(82, 168, 236, 0.8); + } + + .dijitButton .dijitButtonNode, + .dijitComboButton .dijitButtonNode { + padding: 0px; + } + + /* Other stuff */ + + /* .dijitAccordionTitleFocus { + text-shadow : 1px 1px 2px #fff; + } + + .dijitAccordionTitle { + text-rendering: optimizelegibility; + font-family : "Segoe WP Semibold", "Segoe UI Semibold", + "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue", + Helvetica, Arial, sans-serif; + } */ + + .dijitAccordionTitle.dijitAccordionTitleHover, + .dijitAccordionTitle.dijitAccordionTitleFocused { + background: white; + transition: background 0.25s; + } + .dijitAccordionTitle { + background: #f0f0f0; + transition: background 0.25s; + } + + .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected, + .dijitAccordionTitle.dijitAccordionTitleSelected { + background: #0088cc; + transition: background 0.25s; + } + + .dijitAccordionTitle.dijitAccordionTitleSelected .dijitAccordionText { + color: white; + } + + .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected { + border-color: #0088cc; + } + + .dijitAccordionContainer .dijitAccordionChildWrapper { + border-color: #ddd; + } + + /* Tabs */ + + .dijitTabInner.dijitTab { + background: #f0f0f0; + } + + .dijitTabContent { + background: #eee; + } + + .dijitTabContent.dijitTabChecked, + .dijitTabContent.dijitTabHover, + .dijitTabContent.dijitFocused { + background: white; + } + + .dijitTabPaneWrapper, + .dijitTabContainerTop-tabs, + .dijitTab, + .dijitAccordionInnerContainer { + border-color: #ddd; + } + + /* Text fields & selects */ + + .dijitComboBox .dijitArrowButton, + .dijitSelect .dijitArrowButton { + background: transparent; + border-color: transparent; + } + + .dijitSelect .dijitArrowButton .dijitArrowButtonInner { + margin-right: 5px; + float: right; + } + + select, + .dijitDownArrowButton.dijitSelect { + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + margin-bottom: 4px; + + } + + .dijitSelect .dijitButtonContents { + display: inline-block; + height: 20px; + padding: 4px 6px; + font-size: 14px; + line-height: 20px; + color: #555555; + vertical-align: middle; + border-width: 0px; + } + + select, + textarea, + .input.input-text, + .dijitTextBox { + display: inline-block; + height: 20px; + padding: 4px 6px; + font-size: 14px; + line-height: 20px; + color: #555555; + vertical-align: middle; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + margin-bottom: 4px; + } + textarea { + height: auto; + } + + select, + .input.input-text { + height: 30px; + } + + textarea, + select, + .input.input-text, + .dijitTextBox, + .dijitSelect { + background-color: #ffffff; + border: 1px solid #cccccc; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); + -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; + -moz-transition: border linear 0.2s, box-shadow linear 0.2s; + -o-transition: border linear 0.2s, box-shadow linear 0.2s; + transition: border linear 0.2s, box-shadow linear 0.2s; + } + + select:focus, + .input.input-text:focus, + .dijitTextBox.dijitFocused, + .dijitSelect.dijitFocused { + border-color: rgba(82, 168, 236, 0.8); + outline: 0; + outline: thin dotted \9; + /* IE6-9 */ + + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); + } + + .dijitError .dijitValidationContainer { + padding: 0px; + width: 13px; + border-width: 1px; + display: none; + } + + .dijitSelect.dijitSelectDisabled { + background-color: #eeeeee; + } + + .dijitSelect.dijitSelectDisabled .dijitSelectLabel { + cursor: not-allowed; + } + + .dijitTextBox.dijitTextBoxDisabled, + .dijitTextBox.dijitTextBoxDisabled .dijitInputInner, + .dijitTextBox.dijitReadOnly, + .dijitTextBox.dijitReadOnly .dijitInputInner { + cursor: not-allowed; + background-color: #eeeeee; + } + + .dijitToolbar .dijitDownArrowButton.dijitSelect { + border-color: rgba(0, 0, 0, 0.1); + } + + .dijitToolbar .dijitDownArrowButton.dijitSelect .dijitButtonContents { + padding: 2px 2px 0px 4px; + } + + .dijitToolbar .dijitDownArrowButton.dijitSelect { + margin: 0px; + } + + .dijitToolbar .dijitTextBox { + padding: 0px; + margin-bottom: 0px; + border-radius: 0px; + } + + /* dialog */ + + .dijitDialog { + border-radius: 6px; + + } + + .dijitDialog .dijitDialogCloseIcon { + margin-top: 5px; + } + + .dijitDialog .dijitDialogTitleBar { + background: white; + padding: 8px; + font-weight: 600; + color: #555; + font-size: 16px; + text-rendering: optimizelegibility; + font-family: "Segoe WP Semibold", "Segoe UI Semibold", + "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", + Helvetica, Arial, sans-serif; + } + + .dijitDialog .dijitDialogPaneContent { + border-color: #ddd; + padding: 10px; + } + + .dijitProgressBar.dijitProgressBarEmpty { + background: #ddd; + border-color: #0088cc; + } + + .dijitProgressBar.dijitProgressBarEmpty .dijitProgressBarFull .dijitProgressBarTile { + background: rgb(82, 168, 236); + + } + + .dijitProgressBar .dijitProgressBarLabel { + color: white; + } + +} \ No newline at end of file diff --git a/css/layout.css b/css/layout.css index 3351331c..376f9e63 100644 --- a/css/layout.css +++ b/css/layout.css @@ -2,6 +2,6 @@ html, body#ttrssMain, body#ttrssPrefs, #main { width: 100%; height: 100%; border: 0; - padding: 0; + padding: 0; margin: 0; } diff --git a/css/tt-rss.css b/css/tt-rss.css deleted file mode 100644 index 866e95f2..00000000 --- a/css/tt-rss.css +++ /dev/null @@ -1,1192 +0,0 @@ -body#ttrssMain, body#ttrssPrefs, body#ttrssLogin, body { - background : white; - color : black; - margin : 0px; - padding : 0px; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 14px; -} - -body#ttrssMain { - overflow : hidden; - max-height : 100%; -} - -div.postReply { - padding : 0px; -} - -div.postReply div.postHeader { - padding : 5px; - margin-right : 4px; - color : #909090; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; -} - -div.postReply div.postTitle { - overflow : hidden; - text-overflow: ellipsis; - white-space : nowrap; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -div.postReply div.postDate { - padding-left : 10px; -} - -div.postReply div.postContent { - padding : 10px; - font-size : 16px; -} - -div.postReply div.postContent img, -div.postReply div.postContent video { - border-width : 0px; - max-width : 98%; - height: auto; -} - -div.postReply div.postEnclosures { - color : #555; -} - -div.postReply img.tagsPic { - width : 16px; - height : 16px; - margin-left : 4px; - vertical-align : middle; -} - -div.articleNote { - background-color : #fff7d5; - padding : 5px; - margin : 5px; - border-style : solid; - border-color : #e7d796; - border-width : 1px; - color : #9a8c59; -} - -div.articleNote div.noteEdit { - float : right; - cursor : pointer; -} - -div.postReply span.author { - font-size : 12px; -} - -h1 { - font-size : 18px; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -h2 { - font-size : 16px; - font-weight : 600; - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ecf4ff; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -h3 { - font-size : 13px; - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ecf4ff; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -h4 { - font-size : 14px; - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -hr { - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ccc; -} - -a { - color: #0088cc; - text-decoration: none; -} - -a:hover { - color: #005580; - text-decoration: underline; -} - -#piggie { - z-index : 999; - position : absolute; -} - -#notify.visible { - transform: translate(0, -35px); - -webkit-transform: translate(0, -35px); - -o-transform: translate(0, -35px); - -moz-transform: translate(0, -35px); -} - -#notify { - bottom : -35px; - right : 0px; - height : 20px; - left : 0px; - border-width : 1px 0px 0px 0px; - border-style : solid; - position : fixed; - font-size : 12px; - z-index : 99; - padding : 5px; - box-shadow : 0px -2px 2px rgba(0,0,0,0.1); - - transition: all 0.5s ease-in-out; - -webkit-transition: all 0.5s ease-in-out; - -moz-transition: all 0.5s ease-in-out; - -o-transition: all 0.5s ease-in-out; -} - -#notify img { - vertical-align : middle; - max-height : 14px; -} - -#notify span.msg { - width : 100%; -} - -#notify img.close { - cursor : pointer; -} - -#notify span { - display : table-cell; - vertical-align : middle; - padding : 2px; -} - -.notify { - border-color : #d7c47a; - background-color : #fff7d5; -} - -.notify.notify_progress { - border-color : #d7c47a; - background-color : #fff7d5; -} - -.notify.notify_info { - border-color : rgb(82, 168, 236); - background-color : #ecf4ff; -} - -.notify.notify_error { - background-color : #ffcccc; - border-color : #ff0000; -} - -.hl div.hlTitle a { - font-weight : 600; - text-rendering: optimizelegibility; - font-family : "Segoe WP Semibold", "Segoe UI Semibold", - "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; - color : #777; -} - -.hl.Unread div.hlTitle a { - color : black; -} - -.hl.active div.hlTitle a { - color : rgb(82, 168, 236); - /* text-shadow : 1px 1px 2px #fff; */ -} - -.hl.Selected { - background : #f9fbff; -} - -.hl.Grayed { - color : #909090; -} - -.hl { - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ddd; - padding : 1px; -} - -.hl.active { - background : #ecf4ff ! important; -} - -div.filterTestHolder { - height : 300px; - overflow : auto; - border-color : #ddd; - border-style : solid; - margin : 0px 0px 5px 0px; - border-width : 1px; -} - - -#content-insert blockquote, #headlines-frame blockquote, .dijitContentPane blockquote { - margin : 5px 0px 5px 0px; - color : #555; - padding-left : 10px; - border-width : 0px 0px 0px 4px; - border-color : #ccc; - border-style : solid; -} - -#content-insert code, #headlines-frame code, .dijitContentPane code { - color : #009900; - font-family : monospace; - font-size : 12px; -} - -#content-insert pre, #headlines-frame pre, .dijitContentPane 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; -} - -.alert { - padding: 8px 35px 8px 14px; - margin-bottom: 10px; - 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; -} - -ul.nomarks { - list-style-type : none; - margin : 0px; - padding : 10px; -} - -div.prefHelp { - color : #555; - padding : 5px; -} - -.insensitive { - color : #555; -} - -.small { - font-size : 11px; -} - -#main-toolbar > * { - white-space : nowrap; - display : table-cell; - color : #999; - overflow : hidden; -} - -#main-toolbar > *, -#main-toolbar table *, -#main-toolbar .actionChooser * { - text-rendering: optimizelegibility; - font-family : "Segoe WP", "Segoe UI Web", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; - font-size : 12px; - -} - -#main-toolbar #headlines-toolbar { - padding-right : 4px; - width : 100%; -} - -#main-toolbar #headlines-toolbar span.holder { - display : table; - width : 100%; -} - -#main-toolbar #headlines-toolbar span.holder > * { - display : table-cell; -} - -#main-toolbar #headlines-toolbar .main { - text-align : right; -} - -#main-toolbar #headlines-toolbar .main, -#main-toolbar #headlines-toolbar .r { - line-height : 24px; -} - -#headlines-toolbar span.r img { - margin-right : 4px; - position : relative; - top : 3px; -} - -#headlines-toolbar span.r .error a { - color : red; -} - -#main-toolbar #selected_prompt { - font-style : italic; - text-align : right; - margin-right : 4px; -} - -@media (max-width: 992px) { - #main-toolbar #selected_prompt { - display : none; - } -} - -span.contentPreview { - color : #999; - font-weight : normal; - font-size : 12px; - padding-left : 4px; -} - -span.hlLabelRef { - background-color : #fff7d5; - font-size : 8px; - color : #063064; - font-weight : normal; - margin-left : 2px; - padding : 1px 4px 1px 4px; - display : inline-block; - vertical-align : middle; - white-space: nowrap; - border-radius : 4px; -} - -div.postHeader div.postDate { - text-align : right; - color : #909090; - float : right; -} - -div.postHeader div { - padding-bottom : 3px; -} - -#feedUpdateErrors { - display : none; -} - -#allEntryTags { - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ddd; - padding-bottom : 5px; - display : none; -} - -img.markedPic, img.pubPic { - cursor : pointer; - vertical-align : middle; - opacity : 0.5; - -webkit-transition : opacity 0.25s; - transition : opacity 0.25s; -} - -img.markedPic:hover, img.pubPic:hover { - opacity : 1; -} - -img[src*='pub_set.png'], img[src*='mark_set.png'] { - opacity : 1; -} - -div.tagCloudContainer { - border : 1px solid #ddd; - margin : 5px 0px 5px 0px; - padding : 5px; - text-align : center; -} - -div.errorExplained { - border : 1px solid #ddd; - margin : 5px 0px 5px 0px; - padding : 5px; -} - -ul.feedErrorsList { - max-height : 300px; - overflow : auto; - list-style-type : none; - border : 1px solid #ddd; - margin : 0px 0px 5px 0px; - padding : 5px; -} - -ul.feedErrorsList em { - color : #555; -} - -ul.browseFeedList { - height : 300px; - overflow : auto; - border-width : 0px 1px 1px 1px; - border-color : #ddd; - border-style : solid; - margin : 0px 0px 5px 0px; - background-color : white; - list-style-type : none; - padding : 0px; - -} - -ul.browseFeedList li { - margin : 0px; - padding : 2px 4px 2px 4px; -} - -span.subscribers { - color : #808080; -} - -div.subscribers { - color : #808080; - font-size : 12px; - float : right; -} - -div.browserDetails { - margin : 5px 5px 5px 5px; - padding : 5px; -} - -ul.compact { - list-style-type : none; - margin : 0px; - padding : 0px; -} - -ul.compact li { - margin : 0px; - padding : 0px; -} - -.noborder { - border-width : 0px; -} - -#overlay { - background : white; - left : 0; - top : 0; - height : 100%; - width : 100%; - z-index : 100; - position : absolute; -} - -#overlay_inner { - font-weight : bold; - margin : 1em; -} - -form { - margin : 0px; - padding : 0px; -} - -div.loadingPrompt { - padding : 1em; - text-align : center; - font-weight : bold; -} - -div.whiteBox { - margin-left : 1px; - text-align : center; - padding : 1em 1em 0px 1em; - font-size : 11px; - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ddd; -} - -div.autocomplete { - position : absolute; - width : 250px; - background-color : white; - border :1px solid #778899; - margin : 0px; - padding : 0px; -} - -div.autocomplete ul { - list-style-type : none; - margin : 0px; - padding : 0px; -} - -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; -} - -.hl .hlTitle { - overflow : hidden; - white-space : nowrap; - max-width : 500px; - text-overflow : ellipsis; - padding-left : 6px; - padding-right : 6px; -} - -div#headlines-frame.wide .hlTitle { - max-width : auto; - overflow : visible; - white-space : normal; -} - -div#headlines-frame.wide .hl .hlFeed { - display : none; -} - -.hl a.title.high, span.hlContent.high .contentPreview { - color : #00aa00; -} -.hl.Unread a.title.high, .hl.Unread span.hlContent.high .contentPreview { - color : #00dd00; -} - -.hl a.title.low, span.hlContent.low .contentPreview, -.hl.Unread a.title.low, .hl.Unread span.hlContent.low .contentPreview { - color : #909090; - text-decoration : line-through; -} - -img.hlScorePic { - vertical-align : middle; - width : 16px; - height : 16px; -} - -div.dlgSec { - font-size : 12px; - color : #555; - font-weight : bold; - clear : both; - height : 20px; -} - -div.dlgSecCont { - position : relative; - left : 150px; - top : -20px; - float : left; - font-size : 12px; - font-weight : normal; -} - -div.dlgSecCont hr, div.dlgSecSimple hr { - height : 0px; - line-height : 0px; - border : 0px solid transparent; - margin : 2px; -} - -div.dlgSecCont > * { - position : relative; - top : -2px; -} - -div.dlgButtons { - text-align : right; - clear : both; -} - -span.labelColorIndicator { - height : 16px; - width : 16px; - border-radius : 4px; - line-height : 14px; - vertical-align : middle; - font-size : 9px; - display : inline-block; - border : 1px solid #ccc; - background-color : #fff7d5; - color : #063064; - text-align : center; -} - -div#cmdline { - position : absolute; - left : 5px; - bottom : 5px; - font-size : 11px; - color : #555; - font-weight : bold; - background-color : white; - border : 1px solid rgb(82, 168, 236); - padding : 3px 5px 3px 5px; - z-index : 5; -} - -#feed_browser_spinner { - vertical-align : middle; - height : 18px; - width : 18px; -} - -div.hlTitle { - display : table-cell; - cursor : pointer; - width : 100%; - vertical-align : middle; - padding-top : 4px; - padding-bottom : 4px; -} - -div.hlLeft { - display : table-cell; - vertical-align : middle; - white-space: nowrap; -} - -div.hlRight { - display : table-cell; - white-space: nowrap; - text-align : right; - vertical-align : middle; -} - -div.hlRight img { - max-width : 16px; - max-height : 16px; -} - -.hl span.hlFeed { - display : table-cell; - vertical-align : middle; - text-align : right; -} - -.hl span.hlFeed a { - border-radius : 4px; - display : inline-block; - padding : 1px 4px 1px 4px; - font-size : 11px; - font-style : italic; - font-weight : normal; - color : #555; - white-space : nowrap; -} - -.hl span.hlFeed a:hover { - color : rgb(82, 168, 236); -} - -.hl span.hlUpdated { - color : #555; - display : table-cell; - vertical-align : middle; - text-align : right; - font-size : 11px; - white-space : nowrap; - padding-left : 10px; -} - -span.hlUpdated div { - display : inline-block; -} - -div.hlLeft { - padding-left : 8px; -} - -div.hlLeft input { - margin-left : 4px; - margin-right : 4px; -} - -div.hlLeft img, div.hlRight img { - margin : 0px 4px; -} - -div.hlLeft img { - width : 16px; - height : 16px; -} - -div.fatalError { - margin-bottom : 10px; -} - -div.fatalError button { - margin-top : 5px; -} - -div.fatalError textarea { - width : 565px; - height : 200px; -} - -#ttrssMain #main { - border-width : 0px; - margin : 0px; - padding : 0px; -} - -#header-wrap { - border-width : 0px; - margin : 0px; - padding : 0px; -} - -#content-wrap { - padding : 0px; - border-width : 0px; - margin : 0px; -} - -#feeds-holder { - padding : 0px; - border-width : 0px 0px 0px 0px; - border-style : solid; - border-color : #ddd; - overflow : hidden; - background : #f5f5f5; - box-shadow : inset -1px 0px 2px -1px rgba(0,0,0,0.1); - -webkit-overflow-scrolling : touch; -} - -#headlines-wrap-inner { - padding : 0px; - margin : 0px; - border-width : 0px; -} - -#headlines-frame { - padding : 0px; - border-width : 0px; - border-color : #ddd; - margin-top : 0px; - -webkit-overflow-scrolling : touch; -} - -#headlines-toolbar_splitter, #toolbar_splitter { - display : none; -} - -#toolbar { - padding : 0px; - margin : 0px; - border-width : 0px; - white-space: nowrap; - font-size : 12px; -} - -#main-toolbar { - background : white; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; - padding-left : 4px; - height : 26px; - -} - -#header { - border-width : 0px; - text-align : right; - color : #555; - padding : 5px 5px 0px 0px; - margin : 0px; - position : absolute; - right : 0px; - top : 0px; - z-index : 5; -} - -#footer { - text-align : center; - color : #555; - padding : 4px 4px 8px 4px; - border-width : 0px; -} - -#content-insert { - padding : 0px; - border-color : #ddd; - border-width : 0px; - line-height: 1.5; - font-size : 15px; - overflow : auto; - -webkit-overflow-scrolling : touch; -} - -#feedTree .dijitTreeRow .dijitTreeLabel.Unread { - font-weight : bold; -} - -#feedTree .dijitTreeRow.Error .dijitTreeLabel { - color : red; -} - -img.feedIcon, img.tinyFeedIcon { - width : 16px; - height : 16px; - line-height : 16px; - vertical-align : middle; - display : inline-block; -} - -.player { - display : inline-block; - color : #555; - font-size : 11px; - font-family : sans-serif; - border : 1px solid #555; - padding : 0px 4px 0px 4px; - margin : 0px 2px 0px 2px; - width : 50px; - text-align : center; - background : white; -} - -.player.playing { - color : #00c000; - border-color : #00c000; -} - -.player:hover { - background : #f0f0f0; - cursor : pointer; -} - -#headlines-spacer { - height : 100%; - margin-left : 1px; - text-align : center; - color : #555; - font-size : 11px; - font-style : italic; -} - -#headlines-spacer a, #headlines-spacer span { - color : #555; - padding : 10px; - display : block; -} - -#headlines-spacer a:hover { - color : rgb(82, 168, 236); -} - -ul#filterDlg_Matches, ul#filterDlg_Actions { - max-height : 100px; - overflow : auto; - list-style-type : none; - border-style : solid; - border-color : #ddd; - border-width : 0px 1px 1px 1px; - background-color : white; - margin : 0px 0px 5px 0px; - padding : 0px; -} - -ul#filterDlg_Matches li, ul#filterDlg_Actions li { - cursor : pointer; - padding : 0px 0px 0px 5px; -} - -ul.helpKbList { - max-height : 300px; - overflow : auto; - list-style-type : none; - border : 1px solid #ddd; - margin : 0px 0px 5px 0px; - padding : 5px; -} - -ul.helpKbList span.hksequence { - width : 6em; - margin-left : 20px; - color : rgb(82, 168, 236); - font-weight : bold; - display : inline-block; -} - -ul.helpKbList h2 { - margin-top : 0px; -} - -span.collapseBtn { - cursor : pointer; -} - -span.collapseBtn img { - vertical-align : middle; -} - -div.postContent h1 { - font-size : 16px; -} - -div.postContent h2, -div.postContent h3, -div.postContent h4 { - font-size : 15px; -} - -div.postContent p { - /*max-width : 650px;*/ - -webkit-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; -} - -div.postContent iframe { - min-width : 50%; - max-width : 98%; -} - -div.postHeader span.author { - color : #555; - font-size : 11px; - font-weight : normal; -} - -select.attachments { - display : block; - margin-top : 10px; - max-width : 120px; -} - -#selected_prompt { - margin-right : 25px; - vertical-align : middle; -} - -span.sel_links { - margin-right : 4px; - vertical-align : middle; -} - -/*#feedTree img.feedIcon { - position : relative; - top : -2px; -}*/ - -body#ttrssMain.claro #feedTree.dijitTree .dijitTreeNode .dijitTreeRowSelected { - box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1); - border-right-color : white; -} - -body#ttrssMain #feedTree.dijitTree .dijitTreeContainer { - max-width : 100%; -} - -body#ttrssMain #feedTree.dijitTree .dijitTreeRow { - overflow: hidden; - text-overflow: ellipsis; -} - -body#ttrssMain #feedTree.dijitTree .dijitTreeNode .dijitTreeRow { - padding : 4px 0px 4px; - border-width : 1px; - color : #333; -} - -body#ttrssMain #feedTree.dijitTree img.tinyFeedIcon { - position : relative; - top : -2px; -} - -#filterDlg_feeds select { - height : 150px; - width : 410px; -} - -ul#filterDlg_Matches li div.dijitCheckBox, ul#filterDlg_Actions li div.dijitCheckBox { - margin-right : 5px; -} - -body#ttrssMain #feedTree { - height : 100%; - overflow-x : hidden; - text-rendering: optimizelegibility; - font-family : "Segoe UI Web", "Segoe UI", Ubuntu, "Helvetica Neue", - Helvetica, Arial, sans-serif; -} - -body#ttrssMain #feedTree .counterNode.aux { - background : #f0f0f0; - color : #999; - border-color : #f0f0f0; -} - -body#ttrssMain #feedTree .counterNode { - font-weight : bold; - display : inline-block; - font-size : 9px; - text-align : center; - border : 1px solid rgb(82, 168, 236); - color : white; - background : rgb(82, 168, 236); - border-radius : 4px; - vertical-align : middle; - float : right; - position : relative; - line-height : 14px; - margin-right : 8px; - margin-top : 2px; - min-width : 23px; - height : 14px; -} - -body#ttrssMain #feedTree .dijitTreeNode .loadingExpando { - left : -3px; - height : 22px; - position : relative; - top : -3px; -} - - -span.highlight { - background-color : #ffff00; - color : #cc90cc; -} - -div.enclosure_title { - -} - -body#ttrssMain #headlines-frame .dijitCheckBox { - border-width : 0px; - opacity : 0.5; -} - -body#ttrssMain #headlines-frame .dijitCheckBoxHover, -body#ttrssMain #headlines-frame .dijitCheckBoxChecked { - opacity : 1; -} - -body#ttrssMain #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf { - width : 16px; - height : 16px; - vertical-align : middle; - position : relative; -} - -#headlines-frame { - -webkit-transform: translateZ(0); - -webkit-backface-visibility: hidden; -} - -:focus { - outline: none; -} - -.dijitDropDownButton.attachments .dijitButtonText { - font-size : 12px; -} - -.dijitDropDownButton.attachments { - display : inline-block; -} - -#editTagsDlg{ - overflow: visible; -} \ No newline at end of file diff --git a/css/tt-rss.less b/css/tt-rss.less index 5a651930..75c4141d 100644 --- a/css/tt-rss.less +++ b/css/tt-rss.less @@ -1,8 +1,11 @@ -@fonts-ui: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; +@fonts-ui-bold: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; +@fonts-ui: "Segoe UI Web", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif; + @color-accent: rgb(82, 168, 236); @color-accent-light: #ecf4ff; +@color-link: #0088cc; -body#ttrssMain, body#ttrssPrefs, body#ttrssLogin, body { +body { background : white; color : black; margin : 0px; @@ -16,6 +19,10 @@ body#ttrssMain { max-height : 100%; } +:focus { + outline: none; +} + div.postReply { padding : 0px; @@ -23,9 +30,24 @@ div.postReply { padding : 5px; margin-right : 4px; color : #909090; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; + border: 0px solid #ddd; + border-bottom-width: 1px; + + div.postDate { + text-align : right; + color : #909090; + float : right; + } + + div { + padding-bottom : 3px; + } + + span.author { + color : #555; + font-size : 11px; + font-weight : normal; + } } div.postTitle { @@ -34,7 +56,7 @@ div.postReply { white-space : nowrap; font-weight : 600; text-rendering: optimizelegibility; - font-family : @fonts-ui; + font-family : @fonts-ui-bold; } div.postDate { @@ -44,13 +66,32 @@ div.postReply { div.postContent { padding : 10px; font-size : 16px; - } - div.postContent img, - div.postContent video { - border-width : 0px; - max-width : 98%; - height: auto; + img, + video { + border-width : 0px; + max-width : 98%; + height: auto; + } + + h1 { + font-size : 16px; + } + + h2, + h3, + h4 { + font-size : 15px; + } + + p { + hyphens: auto; + } + + iframe { + min-width : 50%; + max-width : 98%; + } } div.postEnclosures { @@ -73,9 +114,7 @@ div.articleNote { background-color : #fff7d5; padding : 5px; margin : 5px; - border-style : solid; - border-color : #e7d796; - border-width : 1px; + border: 1px solid #e7d796; color : #9a8c59; div.noteEdit { @@ -122,12 +161,12 @@ hr { } a { - color: #0088cc; + color: @color-link; text-decoration: none; } a:hover { - color: #005580; + color: darken(@color-link, 20%); text-decoration: underline; } @@ -149,9 +188,6 @@ a:hover { box-shadow : 0px -2px 2px rgba(0,0,0,0.1); transition: all 0.5s ease-in-out; - -webkit-transition: all 0.5s ease-in-out; - -moz-transition: all 0.5s ease-in-out; - -o-transition: all 0.5s ease-in-out; img { vertical-align : middle; @@ -198,6 +234,89 @@ a:hover { border-bottom-width: 1px; padding : 1px; + div.hlTitle { + display : table-cell; + cursor : pointer; + width : 100%; + vertical-align : middle; + overflow : hidden; + white-space : nowrap; + max-width : 500px; + text-overflow : ellipsis; + padding: 4px 6px; + } + + div.hlLeft { + display : table-cell; + vertical-align : middle; + white-space: nowrap; + } + + div.hlRight { + display : table-cell; + white-space: nowrap; + text-align : right; + vertical-align : middle; + } + + div.hlRight img { + max-width : 16px; + max-height : 16px; + } + + span.hlFeed { + display : table-cell; + vertical-align : middle; + text-align : right; + } + + span.hlFeed a { + border-radius : 4px; + display : inline-block; + padding : 1px 4px 1px 4px; + font-size : 11px; + font-style : italic; + font-weight : normal; + color : #555; + white-space : nowrap; + } + + span.hlFeed a:hover { + color : @color-accent; + } + + span.hlUpdated { + color : #555; + display : table-cell; + vertical-align : middle; + text-align : right; + font-size : 11px; + white-space : nowrap; + padding-left : 10px; + } + + span.hlUpdated div { + display : inline-block; + } + + div.hlLeft { + padding-left : 8px; + } + + div.hlLeft input { + margin-left : 4px; + margin-right : 4px; + } + + div.hlLeft img, div.hlRight img { + margin : 0px 4px; + } + + div.hlLeft img { + width : 16px; + height : 16px; + } + div.hlTitle a { font-weight : 600; text-rendering: optimizelegibility; @@ -205,15 +324,6 @@ a:hover { color : #777; } - .hlTitle { - overflow : hidden; - white-space : nowrap; - max-width : 500px; - text-overflow : ellipsis; - padding-left : 6px; - padding-right : 6px; - } - a.title.high, span.hlContent.high .contentPreview { color : #00aa00; } @@ -455,38 +565,10 @@ span.hlLabelRef { border-radius : 4px; } -.postHeader { - - div.postDate { - text-align : right; - color : #909090; - float : right; - } - - div { - padding-bottom : 3px; - } - -} - - -#feedUpdateErrors { - display : none; -} - -#allEntryTags { - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ddd; - padding-bottom : 5px; - display : none; -} - img.markedPic, img.pubPic { cursor : pointer; vertical-align : middle; opacity : 0.5; - -webkit-transition : opacity 0.25s; transition : opacity 0.25s; } @@ -543,21 +625,10 @@ ul.browseFeedList { } -span.subscribers { +.browseFeedList span.subscribers { color : #808080; } -div.subscribers { - color : #808080; - font-size : 12px; - float : right; -} - -div.browserDetails { - margin : 5px 5px 5px 5px; - padding : 5px; -} - ul.compact { list-style-type : none; margin : 0px; @@ -604,9 +675,8 @@ div.whiteBox { text-align : center; padding : 1em 1em 0px 1em; font-size : 11px; - border-width : 0px 0px 1px 0px; - border-style : solid; - border-color : #ddd; + border: 0px solid #ddd; + border-bottom-width: 1px; } div.autocomplete { @@ -639,7 +709,7 @@ div.autocomplete { div#headlines-frame.wide .hlTitle { - max-width : auto; + max-width : none; overflow : visible; white-space : normal; } @@ -669,6 +739,11 @@ div.dlgSecCont { float : left; font-size : 12px; font-weight : normal; + + > * { + position : relative; + top : -2px; + } } div.dlgSecCont hr, div.dlgSecSimple hr { @@ -678,11 +753,6 @@ div.dlgSecCont hr, div.dlgSecSimple hr { margin : 2px; } -div.dlgSecCont > * { - position : relative; - top : -2px; -} - div.dlgButtons { text-align : right; clear : both; @@ -721,97 +791,17 @@ div#cmdline { width : 18px; } -div.hlTitle { - display : table-cell; - cursor : pointer; - width : 100%; - vertical-align : middle; - padding-top : 4px; - padding-bottom : 4px; -} - -div.hlLeft { - display : table-cell; - vertical-align : middle; - white-space: nowrap; -} - -div.hlRight { - display : table-cell; - white-space: nowrap; - text-align : right; - vertical-align : middle; -} - -div.hlRight img { - max-width : 16px; - max-height : 16px; -} - -.hl span.hlFeed { - display : table-cell; - vertical-align : middle; - text-align : right; -} - -.hl span.hlFeed a { - border-radius : 4px; - display : inline-block; - padding : 1px 4px 1px 4px; - font-size : 11px; - font-style : italic; - font-weight : normal; - color : #555; - white-space : nowrap; -} - -.hl span.hlFeed a:hover { - color : @color-accent; -} - -.hl span.hlUpdated { - color : #555; - display : table-cell; - vertical-align : middle; - text-align : right; - font-size : 11px; - white-space : nowrap; - padding-left : 10px; -} - -span.hlUpdated div { - display : inline-block; -} - -div.hlLeft { - padding-left : 8px; -} - -div.hlLeft input { - margin-left : 4px; - margin-right : 4px; -} - -div.hlLeft img, div.hlRight img { - margin : 0px 4px; -} - -div.hlLeft img { - width : 16px; - height : 16px; -} - div.fatalError { margin-bottom : 10px; -} -div.fatalError button { - margin-top : 5px; -} + button { + margin-top : 5px; + } -div.fatalError textarea { - width : 565px; - height : 200px; + textarea { + width : 565px; + height : 200px; + } } #ttrssMain #main { @@ -834,9 +824,7 @@ div.fatalError textarea { #feeds-holder { padding : 0px; - border-width : 0px 0px 0px 0px; - border-style : solid; - border-color : #ddd; + border: 0px solid #ddd; overflow : hidden; background : #f5f5f5; box-shadow : inset -1px 0px 2px -1px rgba(0,0,0,0.1); @@ -851,10 +839,11 @@ div.fatalError textarea { #headlines-frame { padding : 0px; - border-width : 0px; - border-color : #ddd; + border: 0px #ddd; margin-top : 0px; -webkit-overflow-scrolling : touch; + -webkit-transform: translateZ(0); + -webkit-backface-visibility: hidden; } #headlines-toolbar_splitter, #toolbar_splitter { @@ -871,9 +860,8 @@ div.fatalError textarea { #main-toolbar { background : white; - border-width : 0px 0px 1px 0px; - border-color : #ddd; - border-style : solid; + border: 0px solid #ddd; + border-bottom-width: 1px; padding-left : 4px; height : 26px; @@ -954,16 +942,16 @@ img.feedIcon, img.tinyFeedIcon { color : #555; font-size : 11px; font-style : italic; -} -#headlines-spacer a, #headlines-spacer span { - color : #555; - padding : 10px; - display : block; -} + a, span { + color : #555; + padding : 10px; + display : block; + } -#headlines-spacer a:hover { - color : @color-accent; + a:hover { + color : @color-accent; + } } ul#filterDlg_Matches, ul#filterDlg_Actions { @@ -990,54 +978,26 @@ ul.helpKbList { border : 1px solid #ddd; margin : 0px 0px 5px 0px; padding : 5px; -} -ul.helpKbList span.hksequence { - width : 6em; - margin-left : 20px; - color : @color-accent; - font-weight : bold; - display : inline-block; -} + span.hksequence { + width : 6em; + margin-left : 20px; + color : @color-accent; + font-weight : bold; + display : inline-block; + } -ul.helpKbList h2 { - margin-top : 0px; + h2 { + margin-top : 0px; + } } span.collapseBtn { cursor : pointer; -} - -span.collapseBtn img { - vertical-align : middle; -} - -div.postContent h1 { - font-size : 16px; -} - -div.postContent h2, -div.postContent h3, -div.postContent h4 { - font-size : 15px; -} - -div.postContent p { - /*max-width : 650px;*/ - -webkit-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; -} -div.postContent iframe { - min-width : 50%; - max-width : 98%; -} - -div.postHeader span.author { - color : #555; - font-size : 11px; - font-weight : normal; + img { + vertical-align : middle; + } } select.attachments { @@ -1051,16 +1011,6 @@ select.attachments { vertical-align : middle; } -span.sel_links { - margin-right : 4px; - vertical-align : middle; -} - -/*#feedTree img.feedIcon { - position : relative; - top : -2px; -}*/ - body#ttrssMain.claro #feedTree.dijitTree .dijitTreeNode .dijitTreeRowSelected { box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1); border-right-color : white; @@ -1100,40 +1050,40 @@ body#ttrssMain #feedTree { overflow-x : hidden; text-rendering: optimizelegibility; font-family : @fonts-ui; -} -body#ttrssMain #feedTree .counterNode.aux { - background : #f0f0f0; - color : #999; - border-color : #f0f0f0; -} + .counterNode.aux { + background : #f0f0f0; + color : #999; + border-color : #f0f0f0; + } -body#ttrssMain #feedTree .counterNode { - font-weight : bold; - display : inline-block; - font-size : 9px; - text-align : center; - border : 1px solid @color-accent; - color : white; - background : @color-accent; - border-radius : 4px; - vertical-align : middle; - float : right; - position : relative; - line-height : 14px; - margin-right : 8px; - margin-top : 2px; - min-width : 23px; - height : 14px; -} + .counterNode { + font-weight : bold; + display : inline-block; + font-size : 9px; + text-align : center; + border : 1px solid @color-accent; + color : white; + background : @color-accent; + border-radius : 4px; + vertical-align : middle; + float : right; + position : relative; + line-height : 14px; + margin-right : 8px; + margin-top : 2px; + min-width : 23px; + height : 14px; + } -body#ttrssMain #feedTree .dijitTreeNode .loadingExpando { - left : -3px; - height : 22px; - position : relative; - top : -3px; -} + .dijitTreeNode .loadingExpando { + left : -3px; + height : 22px; + position : relative; + top : -3px; + } +} span.highlight { background-color : #ffff00; @@ -1161,15 +1111,6 @@ body#ttrssMain #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf { position : relative; } -#headlines-frame { - -webkit-transform: translateZ(0); - -webkit-backface-visibility: hidden; -} - -:focus { - outline: none; -} - .dijitDropDownButton.attachments .dijitButtonText { font-size : 12px; } @@ -1180,4 +1121,112 @@ body#ttrssMain #feedTree .dijitTreeRow img.dijitTreeExpandoLeaf { #editTagsDlg{ overflow: visible; -} \ No newline at end of file +} + +body#ttrssZoom { + 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; + } + + +} + diff --git a/css/utility.css b/css/utility.css index 9420e05d..4afdb067 100644 --- a/css/utility.css +++ b/css/utility.css @@ -1,5 +1,3 @@ -@import "dijit.css"; - body.sanity_failed { background : #900; } diff --git a/include/login_form.php b/include/login_form.php index 0d956d20..41c3f173 100644 --- a/include/login_form.php +++ b/include/login_form.php @@ -3,8 +3,7 @@ Tiny Tiny RSS : Login - - + Tiny Tiny RSS - Installer - + diff --git a/register.php b/register.php index a6f42c65..11f5d928 100644 --- a/register.php +++ b/register.php @@ -96,7 +96,7 @@ Create new account - + diff --git a/themes/default.php b/themes/default.php index db131e34..48ca8075 100644 --- a/themes/default.php +++ b/themes/default.php @@ -5,10 +5,6 @@ return "@import \"$filename?".filemtime($filename)."\";"; } - $styles = [ "tt-rss.css", "dijit.css", "cdm.css", "prefs.css" ]; - - foreach ($styles as $style) { - print import_tag("../css/$style") . "\n"; - } + print import_tag("../css/default.css") . "\n"; ?>