commit 95f00445c1d735c13edf273e7b0358f768226cfd Author: Farhan Khan Date: Sat Oct 14 00:42:01 2023 -0400 Initial commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..e69de29 diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..819ed4c --- /dev/null +++ b/css/main.css @@ -0,0 +1,322 @@ +* { + margin: 0; + padding: 0; + font-family: sans-serif; + box-sizing: border-box; +} + +.clear { + clear: both; +} + +html, body { + /* To vertically center align */ + display: table; + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; +} + +h1, h2, h3, h4, a { + color: #666666; +} + +h1, h2, h3, h4 { + margin: 0 0 10px; +} + +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +.homepage .center { + text-align: center; + /* To vertically center align */ + display: table-cell; + vertical-align: middle; +} + +.section { + margin: 50px auto; +} + +.searcharea { + border: 1px solid #b3b3b3; + border-radius: 30px; + max-width: 800px; +} + +.searchinput { + width: 75%; + color: #666666; + background: none; + border: none; + font-size: 22px; + float: left; + padding: 10px 25px; + box-sizing: border-box; + outline: none; +} + +.searchsubmit { + float: right; + width: 20%; + background: #333333; + color: #f2f2f2; + border: none; + border-radius: 30px; + padding: 10px 20px; + margin: 2px; + font-size: 18px; + cursor: pointer; +} + +.links.section li { + display: inline-block; + margin: 0 10px; + color: #666666; +} + +.hbmenu { + position: absolute; + top: 0; + right: 0; + background: #ffffff; + /* Remove focus border */ + outline: none; + z-index: 100; +} + +.hbmenu .hbbtn { + display: block; + padding: 15px 20px; + content: "\2630"; + color: #666666; + font-size:24px; + cursor: pointer; +} + +.hbmenu:focus { + pointer-events: none; + height: 100%; + border-left: 1px solid #b3b3b3; + padding: 0; +} + +.hbmenu .menu { + display: none; + z-index: 1000; + pointer-events: auto; +} + +.hbmenu:focus .menu { + display: unset; +} + +.hbmenu .menu li { + display: block; +} + +.hbmenu .menu li a { + display: inline-block; + width: 160px; + padding: 15px 20px; +} + +/* ----- Search result page ----- */ + +.resultpage .navbar { + padding: 10px 10px; +} + +.resultpage .logo { + margin: 20px 0 0 10px; +} + +.resultpage .hbbtn { + margin: 20px 0 0; +} + +.resultpage .logo img { + width: 150px; + float: left; +} + +.resultpage .searcharea { + margin: 20px auto; + max-width: 600px; +} + +.resultpage .resultarea { + margin: 0 auto; + max-width: 600px; + padding: 10px 25px; + color: #666666; +} + +.resultpage .resultinfo { + font-style: italic; + margin: 0 0 10px 0; +} + +.resultarea .result:last-child { + border-bottom: none; +} + +.result { + padding: 30px 0; + border-bottom: 1px solid #d6d6d6; +} + +.result .useravatar { + border-radius: 100px; + border: 3px solid #4d4d4d; + width: 50px; + height: 50px; + float: left; + margin-right: 10px; +} + +.result .useravatar img { + border-radius: 100px; + width: 44px; + height: 44px; +} + +.result .resulttop { + height: 54px; + margin: 0 0 10px 0; +} + +.result .userdata { + width: 70%; + float:left; +} + +.result .userlabel, .result .userident { + display: block; + width: auto; +} + +.result .userlabel { + font-weight: bold; + padding-bottom: 2px; + padding: 2px 0; + color: #4d4d4d; +} + +.result .userident { + padding: 0 0; +} + +.result .actions { + float: right; + padding: 5px 10px; + display: none; +} + +.result:hover .actions { + display: unset; +} + +.result .actions li { + list-style: none; + display: inline-block; + margin: 0 2px; +} + +.result:hover .actions li a { + padding: 2px; + border-radius: 100px; + background: #e6e6e6; + display: inline-block; + width:36px; + height:36px; +} + +.result:hover .actions li a:hover { + background: #cccccc; +} + +.result:hover .actions li img { + width: 18px; + height: 18px; + margin: 7px 0 0 7px; +} + +.pagin { + text-align: center; + margin: 50px 0; +} + +.pagin ul { + list-style: none; +} + +.pagin ul li { + display: inline-block; +} + +.pagin a { + padding: 10px; + display: inline-block; + border-radius: 30px; + min-height: 40px; + min-width: 40px; +} + +.pagin a:hover { + background: #e6e6e6; + /* No underline for pagination links */ + text-decoration: none; +} + +.pagin a.current { + background: #333333; + color: #f2f2f2; +} + +.sidebar { + position: absolute; + top: 100px; + width: 300px; + padding: 20px 30px; +} + +.left.sidebar { + left: 0; +} + +.right.sidebar { + right: 0; +} + +.sidebar .list { + list-style: none; +} + +.sidebar h4, .sidebar h5 { + margin-top: 10px; +} + +.list.checks li a { + /* Create place for checkmark */ + padding-left: 20px; +} + +.list li.current a { + font-weight: bold; +} + +.list.checks li.current { + background: url("../images/checkmark.png") no-repeat; + /* Size of checkmark */ + background-size: 15px; + background-position-y: 5px; +} diff --git a/css/main.css.bak b/css/main.css.bak new file mode 100644 index 0000000..f6b8f40 --- /dev/null +++ b/css/main.css.bak @@ -0,0 +1,322 @@ +* { + margin: 0; + padding: 0; + font-family: sans-serif; + box-sizing: border-box; +} + +.clear { + clear: both; +} + +html, body { + /* To vertically center align */ + display: table; + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; +} + +h1, h2, h3, h4, a { + color: #666666; +} + +h1, h2, h3, h4 { + margin: 0 0 10px; +} + +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +.homepage .center { + text-align: center; + display: table-cell; + vertical-align: middle; +} + +.section { + margin: 50px auto; +} + +.searcharea { + border: 1px solid #b3b3b3; + border-radius: 30px; + max-width: 800px; +} + +.searchinput { + color: #666666; + background: none; + border: none; + font-size: 22px; + float: left; + display: inline-block; + margin-right: 100px; + padding: 10px 25px; + box-sizing: border-box; + outline: none; +} + +.searchsubmit { + display: inline-block; + float: right; + width: 100px; + background: #333333; + color: #f2f2f2; + border: none; + border-radius: 30px; + padding: 10px 20px; + margin: 2px; + font-size: 18px; + cursor: pointer; +} + +.links.section li { + display: inline-block; + margin: 0 10px; + color: #666666; +} + +.hbmenu { + position: absolute; + top: 0; + right: 0; + background: #ffffff; + /* Remove focus border */ + outline: none; + z-index: 100; +} + +.hbmenu .hbbtn { + display: block; + padding: 15px 20px; + content: "\2630"; + color: #666666; + font-size:24px; + cursor: pointer; +} + +.hbmenu:focus { + pointer-events: none; + height: 100%; + border-left: 1px solid #b3b3b3; + padding: 0; +} + +.hbmenu .menu { + display: none; + z-index: 1000; + pointer-events: auto; +} + +.hbmenu:focus .menu { + display: unset; +} + +.hbmenu .menu li { + display: block; +} + +.hbmenu .menu li a { + display: inline-block; + width: 160px; + padding: 15px 20px; +} + +/* Search result page */ +.resultpage .navbar { + padding: 10px 10px; +} + +.resultpage .logo { + margin: 20px 0 0 10px; +} + +.resultpage .hbbtn { + margin: 20px 0 0; +} + +.resultpage .logo img { + width: 150px; + float: left; +} + +.resultpage .searcharea { + margin: 20px auto; + max-width: 600px; +} + +.resultpage .resultarea { + margin: 0 auto; + max-width: 600px; + padding: 10px 25px; + color: #666666; +} + +.resultpage .resultinfo { + font-style: italic; + margin: 0 0 10px 0; +} + +.resultarea .result:last-child { + border-bottom: none; +} + +.result { + padding: 30px 0; + border-bottom: 1px solid #d6d6d6; +} + +.result .useravatar { + border-radius: 100px; + border: 3px solid #4d4d4d; + width: 50px; + height: 50px; + float: left; + margin-right: 10px; +} + +.result .useravatar img { + border-radius: 100px; + width: 44px; + height: 44px; +} + +.result .resulttop { + height: 54px; + margin: 0 0 10px 0; +} + +.result .userdata { + width: 70%; + float:left; +} + +.result .userlabel, .result .userident { + display: block; + width: auto; +} + +.result .userlabel { + font-weight: bold; + padding-bottom: 2px; + padding: 2px 0; + color: #4d4d4d; +} + +.result .userident { + padding: 0 0; +} + +.result .actions { + float: right; + padding: 5px 10px; + display: none; +} + +.result:hover .actions { + display: unset; +} + +.result .actions li { + list-style: none; + display: inline-block; + margin: 0 2px; +} + +.result:hover .actions li a { + padding: 2px; + border-radius: 100px; + background: #e6e6e6; + display: inline-block; + width:36px; + height:36px; +} + +.result:hover .actions li a:hover { + background: #cccccc; +} + +.result:hover .actions li img { + width: 18px; + height: 18px; + margin: 7px 0 0 7px; +} + +.pagin { + text-align: center; + margin: 50px 0; +} + +.pagin ul { + list-style: none; +} + +.pagin ul li { + display: inline-block; +} + +.pagin a { + padding: 10px; + display: inline-block; + border-radius: 30px; + min-height: 40px; + min-width: 40px; +} + +.pagin a:hover { + background: #e6e6e6; + /* No underline for pagination links */ + text-decoration: none; +} + +.pagin a.current { + background: #333333; + color: #f2f2f2; +} + +.sidebar { + position: absolute; + top: 100px; + width: 300px; + padding: 20px 30px; +} + +.left.sidebar { + left: 0; +} + +.right.sidebar { + right: 0; +} + +.sidebar .list { + list-style: none; +} + +.sidebar h4, .sidebar h5 { + margin-top: 10px; +} + +.list.checks li a { + /* place for checkmark */ + padding-left: 20px; +} + +.list li.current a { + font-weight: bold; +} + +.list.checks li.current { + background: url("../images/checkmark.png") no-repeat; + /* size of checkmark */ + background-size: 15px; + background-position-y: 5px; +} diff --git a/homepage-01.svg b/homepage-01.svg new file mode 100644 index 0000000..b0836d8 --- /dev/null +++ b/homepage-01.svg @@ -0,0 +1,188 @@ + + + + + + + + + + + + Fedi + logue + + + + + Search + About + How it works + FAQ + Contact + Trending + | + + diff --git a/images/checkmark.png b/images/checkmark.png new file mode 100644 index 0000000..77ab650 Binary files /dev/null and b/images/checkmark.png differ diff --git a/images/icon-avatar.png b/images/icon-avatar.png new file mode 100644 index 0000000..407fbcd Binary files /dev/null and b/images/icon-avatar.png differ diff --git a/images/icon-expand.png b/images/icon-expand.png new file mode 100644 index 0000000..de6ccaa Binary files /dev/null and b/images/icon-expand.png differ diff --git a/images/icon-link.png b/images/icon-link.png new file mode 100644 index 0000000..0a2ed88 Binary files /dev/null and b/images/icon-link.png differ diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..b1e2585 Binary files /dev/null and b/images/logo.png differ diff --git a/images/logo.svg b/images/logo.svg new file mode 100644 index 0000000..c82abc5 --- /dev/null +++ b/images/logo.svg @@ -0,0 +1,61 @@ + + + + + + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..de89170 --- /dev/null +++ b/index.html @@ -0,0 +1,52 @@ + + + + + + Fedilogue + + + + +
+ + +
+ +
+ + + +
+
+ + +
+
+
+ + + +
+ + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..e69de29 diff --git a/result-01.svg b/result-01.svg new file mode 100644 index 0000000..b2d33de --- /dev/null +++ b/result-01.svg @@ -0,0 +1,489 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Search + + Search results for "test" returned 3409 results. + + User One + @userone@instance.tld + + Lorem ipsum dolor sit amet, est ne nibh noster. No altera probatus gloriatur eam, vim ut postea ornatus meliore, alterum elaboraret nec ex. His summo detraxit menandri eu. Quas commune appellantur duo ad, his an vero ceteros accusam, eu latine eligendi pri. + + + User Two + @usertwo@instance.tld + + Eum in admodum recusabo referrentur. Legere placerat per no, his regione aperiam at. Cum tota vituperatoribus ne. Pri modus facilisis democritum ex, veritus minimum delicatissimi no est. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/result-02.svg b/result-02.svg new file mode 100644 index 0000000..b48b574 --- /dev/null +++ b/result-02.svg @@ -0,0 +1,621 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Search + + Search results for "test" returned 3409 results. + + User One + @userone@instance.tld + + Lorem ipsum dolor sit amet, est ne nibh noster. No altera probatus gloriatur eam, vim ut postea ornatus meliore, alterum elaboraret nec ex. His summo detraxit menandri eu. Quas commune appellantur duo ad, his an vero ceteros accusam, eu latine eligendi pri. + + + User Two + @usertwo@instance.tld + + Eum in admodum recusabo referrentur. Legere placerat per no, his regione aperiam at. Cum tota vituperatoribus ne. Pri modus facilisis democritum ex, veritus minimum delicatissimi no est. + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Finetune + Post time within: + all24 hours1 week1 month6 months1 year + + Trending + #test#exampletag#justexample + + diff --git a/search.html b/search.html new file mode 100644 index 0000000..2e853e2 --- /dev/null +++ b/search.html @@ -0,0 +1,157 @@ + + + + + + Fedilogue + + + + + + + +
+
Search for test returned 0000 results.
+ +
+
+ +
+
    +
  • +
  • +
+
+
+
+ Lorem ipsum dolor sit amet, est ne nibh noster. No altera probatus gloriatur eam, vim ut postea ornatus meliore, alterum elaboraret nec ex. His summo detraxit menandri eu. Quas commune appellantur duo ad, his an vero ceteros accusam, eu latine eligendi pri. +
+
+ +
+
+ +
+
    +
  • +
  • +
+
+
+
+ Lorem ipsum dolor sit amet, est ne nibh noster. No altera probatus gloriatur eam, vim ut postea ornatus meliore, alterum elaboraret nec ex. His summo detraxit menandri eu. Quas commune appellantur duo ad, his an vero ceteros accusam, eu latine eligendi pri. +
+
+ +
+
+ +
+
    +
  • +
  • +
+
+
+
+ Lorem ipsum dolor sit amet, est ne nibh noster. No altera probatus gloriatur eam, vim ut postea ornatus meliore, alterum elaboraret nec ex. His summo detraxit menandri eu. Quas commune appellantur duo ad, his an vero ceteros accusam, eu latine eligendi pri. +
+
+ +
+ +
+
+ + + + + + + \ No newline at end of file