From 6e060269c8eef4bde87291770c3fa26726c4a1a1 Mon Sep 17 00:00:00 2001 From: BonfaceKilz Date: Wed, 23 Dec 2020 16:08:44 +0300 Subject: Add tabbed content for commits, tweets and pubmed content * bh20simplewebuploader/templates/home.html: Add tab panes for commits, tweets and pubmed content. Use dummy place holder content for commits and tweets. * bh20simplewebuploader/static/main.css: Add basic styling for tabbed content. --- bh20simplewebuploader/static/main.css | 43 ++++++++++++++++++++++++++++++++--- 1 file changed, 40 insertions(+), 3 deletions(-) (limited to 'bh20simplewebuploader/static/main.css') diff --git a/bh20simplewebuploader/static/main.css b/bh20simplewebuploader/static/main.css index b7ba1af..b6c900c 100644 --- a/bh20simplewebuploader/static/main.css +++ b/bh20simplewebuploader/static/main.css @@ -510,7 +510,7 @@ div.status { justify-content: space-evenly; } -#twitter-feed { +#feed { background-color: #f5f8fa; max-height: 440px; max-width: 500px; @@ -521,11 +521,11 @@ div.status { } -#twitter-feed ul { +#feed ul { list-style-type: none; } -#twitter-feed ul li { +#feed ul li { border-bottom: 2px solid white; padding-bottom: 20px; } @@ -552,3 +552,40 @@ padding-right:10px; { max-width: 80%; } + +/** Tabbed feed **/ +input[name="feed-tabs"] { + display: none; +} + +input[name="feed-tabs"] + label { + display: inline-block; +} + +input[name="feed-tabs"] ~ .tab { + display: none; +} + +#tab-pubmed-articles:checked ~ .tab.content-pubmed-articles, +#tab-tweets:checked ~ .tab.content-tweets, +#tab-commits:checked ~ .tab.content-commits { + display: block; +} + +input[name="feed-tabs"] + label { + border: 1px solid #999; + background: #EEE; + padding: 4px 12px; + border-radius: 4px 4px 0 0; + position: relative; + top: 1px; +} + +input[name="feed-tabs"]:checked + label { + background: #FFF; + border-bottom: 1px solid transparent; +} +input[name="feed-tabs"] ~ .tab { /* grey line between tab and contents */ + border-top: 1px solid #999; + padding: 12px; +} -- cgit v1.2.3