Browse Source

Restyling

multi-sources
Ben Kurtovic 3 years ago
parent
commit
208ebd3628
9 changed files with 136 additions and 100 deletions
  1. BIN
     
  2. +89
    -60
      static/style.css
  3. +1
    -1
      static/style.min.css
  4. +1
    -1
      templates/api.mako
  5. +1
    -1
      templates/error.mako
  6. +10
    -3
      templates/index.mako
  7. +1
    -1
      templates/settings.mako
  8. +13
    -11
      templates/support/footer.mako
  9. +20
    -22
      templates/support/header.mako

BIN
View File


+ 89
- 60
static/style.css View File

@@ -1,58 +1,89 @@
html, body {
height: 100%;
margin: 0;
}

body {
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
display: flex;
flex-direction: column;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
font-size: 14px;
color: #000;
background-color: #000;
background-color: #eaecf0;
background-attachment: fixed;
background-position: center;
margin: 0;
background-size: cover;
}

ul, ol {
line-height: 1.5;
#container {
flex: auto;
line-height: 1.25;
margin: 0 auto;
}

h2 {
margin-bottom: 0.2em;
#container > div {
background-color: #fff;
border: 1px solid #c8ccd1;
filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.25));
margin: 1.5em 3em;
padding: 1em;
}

#header {
font-size: 2.5em;
font-weight: bold;
margin: 20px 60px;
padding: 10px 15px;
border: 1px solid #777;
background-color: #FFF;
header {
background-color: #eaecf0;
padding: 0.2em 1em;
}

#container {
line-height: 1.25;
margin: 0 60px 65px 60px;
padding: 5px 15px 15px 15px;
border: 1px solid #777;
background-color: #FFF;
header > * {
vertical-align: middle;
display: inline-block;
}

#footer {
position: fixed;
width: 100%;
height: 45px;
bottom: 0;
header h1 {
font-size: 2em;
margin: 0 1em 0 0;
}

#settings-link::before {
content: ' ';
font-size: 0.85em;
color: black;
opacity: 0.6;
padding-left: 1.67em;
background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 xmlns:xlink=%22http://www.w3.org/1999/xlink%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Esettings%3C/title%3E%3Cg transform=%22translate%2810 10%29%22%3E%3Cpath id=%22a%22 d=%22M1.5-10h-3l-1 6.5h5m0 7h-5l1 6.5h3%22/%3E%3Cuse transform=%22rotate%2845%29%22 xlink:href=%22%23a%22/%3E%3Cuse transform=%22rotate%2890%29%22 xlink:href=%22%23a%22/%3E%3Cuse transform=%22rotate%28135%29%22 xlink:href=%22%23a%22/%3E%3C/g%3E%3Cpath d=%22M10 2.5a7.5 7.5 0 000 15 7.5 7.5 0 000-15v4a3.5 3.5 0 010 7 3.5 3.5 0 010-7%22/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: contain;
}

footer {
padding: 1em;
font-size: 0.9em;
text-align: center;
line-height: 1.5;
border-top: 1px solid #777;
background: #DDDDDD;
border-top: 1px solid #c8ccd1;
background: #fff;
}

#footer li {
footer ul {
margin: 0;
}

footer li {
display: inline;
}

#footer li:not(:last-child)::after {
footer li:not(:last-child)::after {
content: ' \00b7';
}

ul, ol {
line-height: 1.5;
}

h2 {
margin-bottom: 0.2em;
}

#notice-box {
padding: 10px;
margin: 10px 5px;
@@ -90,8 +121,8 @@ h2 {
#sources-container {
padding: 5px 10px;
margin: 15px 5px 10px 5px;
background-color: #EEE;
border: 1px solid #BBB;
background-color: #eee;
border: 1px solid #bbb;
}

#turnitin-title, #sources-title {
@@ -147,7 +178,7 @@ h2 {
}

#cv-result-sources tr:nth-child(even) {
background-color: #E0E0E0;
background-color: #e0e0e0;
}

#cv-result-sources td:first-child {
@@ -206,7 +237,7 @@ h2 {
}

#source-row-selected {
background-color: #CFCFCF !important;
background-color: #cfcfcf !important;
}

#head-settings {
@@ -272,31 +303,31 @@ h2 {
width: 500px;
padding: 5px;
z-index: 1;
background: #F3F3F3;
border: 1px solid #AAA;
background: #f3f3f3;
border: 1px solid #aaa;
color: black;
font-style: normal;
text-align: left;
}

.green-box {
background-color: #EFE;
border: 1px solid #7F7;
background-color: #efe;
border: 1px solid #7f7;
}

.yellow-box {
background-color: #FFD;
border: 1px solid #EE5;
background-color: #ffd;
border: 1px solid #ee5;
}

.red-box {
background-color: #FEE;
border: 1px solid #F77;
background-color: #fee;
border: 1px solid #f77;
}

.gray-box {
background-color: #EEE;
border: 1px solid #AAA;
background-color: #eee;
border: 1px solid #aaa;
}

.indentable {
@@ -314,8 +345,8 @@ h2 {

.cv-chain-detail {
padding: 0 10px 0 10px;
background-color: #FFF;
border: 1px solid #BBB;
background-color: #fff;
border: 1px solid #bbb;
}

.cv-chain-cell {
@@ -354,22 +385,22 @@ h2 {
}

.cv-hl {
background: #FAA;
background: #faa;
}

.cv-hl-in {
background: #FCC;
background: linear-gradient(to left, #FAA, #FFF);
background: #fcc;
background: linear-gradient(to left, #faa, #fff);
}

.cv-hl-out {
background: #FCC;
background: linear-gradient(to right, #FAA, #FFF);
background: #fcc;
background: linear-gradient(to right, #faa, #fff);
}

.mono { font-family: monospace; }
.light { color: #CCC; }
.medium { color: #AAA; }
.light { color: #ccc; }
.medium { color: #aaa; }

.source-similarity { font-weight: bold; }
.source-suspect { color: #900; }
@@ -393,15 +424,13 @@ a:active {
text-decoration: underline;
}

#a-home:link { color: #777; }
#a-home:visited { color: #777; }
#a-home:hover { color: #555; }
#a-home:active { color: #333; }
header a:link, header a:visited, header a:hover {
color: #54595d;
}

#a-settings:link { color: #AAA; }
#a-settings:visited { color: #AAA; }
#a-settings:hover { color: #888; }
#a-settings:active { color: #666; }
header a:active {
color: #333;
}

#cv-cached:active { color: #040; text-decoration: none; }
#cv-cached:hover { text-decoration: none; }


+ 1
- 1
static/style.min.css
File diff suppressed because it is too large
View File


+ 1
- 1
templates/api.mako View File

@@ -33,7 +33,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>API &ndash; Earwig's Copyvio Detector</title>
<title>API | Earwig's Copyvio Detector</title>
<link rel="stylesheet" href="${request.script_root}${url_for('static', file='api.min.css')}" type="text/css" />
</head>
<body>


+ 1
- 1
templates/error.mako View File

@@ -1,4 +1,4 @@
<%include file="/support/header.mako" args="title='Error! &ndash; Earwig\'s Copyvio Detector'"/>
<%include file="/support/header.mako" args="title='Error! | Earwig\'s Copyvio Detector'"/>
<h2>Error!</h2>
<p>An error occurred. If it hasn't been reported (<a href="https://github.com/earwig/copyvios/issues">try to check</a>), please <a href="https://github.com/earwig/copyvios/issues/new">file an issue</a> or <a href="mailto:wikipedia.earwig@gmail.com">email me</a>. Include the following information:</p>
<div id="info-box" class="red-box">


+ 10
- 3
templates/index.mako View File

@@ -4,7 +4,14 @@
from copyvios.checker import T_POSSIBLE, T_SUSPECT
from copyvios.misc import cache
%>\
<%include file="/support/header.mako" args="title='Earwig\'s Copyvio Detector'"/>
<%
titleparts = []
if query.page:
titleparts.append(query.page.title)
titleparts.append("Earwig's Copyvio Detector")
title = " | ".join(titleparts)
%>\
<%include file="/support/header.mako" args="title=title"/>
<%namespace module="copyvios.highlighter" import="highlight_delta"/>\
<%namespace module="copyvios.misc" import="httpsfix, urlstrip"/>\
% if notice:
@@ -49,9 +56,9 @@
</div>
% endif
%endif
<p>This tool attempts to detect <a href="https://en.wikipedia.org/wiki/WP:COPYVIO">copyright violations</a> in articles. In <i>search mode</i>, it will check for similar content elsewhere on the web using <a href="https://developers.google.com/custom-search/">Google</a>, external links present in the text of the page, or <a href="https://en.wikipedia.org/wiki/Wikipedia:Turnitin">Turnitin</a> (provided by <a href="https://en.wikipedia.org/wiki/User:EranBot">EranBot</a>), depending on which options are selected. In <i>comparison mode</i>, the tool will compare the article to a specific webpage without making additional searches, like the <a href="https://dupdet.toolforge.org/">Duplication Detector</a>.</p>
<p>This tool attempts to detect <a href="https://en.wikipedia.org/wiki/WP:COPYVIO">copyright violations</a> in articles. In <i>search mode</i>, it will check for similar content elsewhere on the web using <a href="https://developers.google.com/custom-search/">Google</a>, external links present in the text of the page, or <a href="https://en.wikipedia.org/wiki/Wikipedia:Turnitin">Turnitin</a> (via <a href="https://en.wikipedia.org/wiki/User:EranBot">EranBot</a>), depending on which options are selected. In <i>comparison mode</i>, the tool will compare the article to a specific webpage without making additional searches, like the <a href="https://dupdet.toolforge.org/">Duplication Detector</a>.</p>
<p>Running a full check can take up to a minute if other websites are slow or if the tool is under heavy use. Please be patient. If you get a timeout, wait a moment and refresh the page.</p>
<p>Be aware that other websites can copy from Wikipedia, so check the results carefully, especially for older or well-developed articles. Specific websites can be skipped by being added to the <a href="https://en.wikipedia.org/wiki/User:EarwigBot/Copyvios/Exclusions">excluded URL list</a>.</p>
<p>Be aware that other websites can copy from Wikipedia, so check the results carefully, especially for older or well-developed articles. Specific websites can be skipped by adding them to the <a href="https://en.wikipedia.org/wiki/User:EarwigBot/Copyvios/Exclusions">excluded URL list</a>.</p>
<form id="cv-form" action="${request.script_root}/" method="get">
<table id="cv-form-outer">
<tr>


+ 1
- 1
templates/settings.mako View File

@@ -3,7 +3,7 @@
from flask import g, request
from copyvios.misc import cache
%>\
<%include file="/support/header.mako" args="title='Settings &ndash; Earwig\'s Copyvio Detector'"/>
<%include file="/support/header.mako" args="title='Settings | Earwig\'s Copyvio Detector'"/>
% if status:
<div id="info-box" class="green-box">
<p>${status}</p>


+ 13
- 11
templates/support/footer.mako View File

@@ -2,16 +2,18 @@
from datetime import datetime
from flask import g, request
%>\
</main>
</div>
<div id="footer">
<ul>
<li>Maintained by <a href="https://en.wikipedia.org/wiki/User:The_Earwig">Ben Kurtovic</a></li>
<li><a href="${request.script_root}/api">API</a></li>
<li><a href="https://github.com/earwig/copyvios">Source code</a></li>
% if ("CopyviosBackground" in g.cookies and g.cookies["CopyviosBackground"].value in ["potd", "list"]) or "CopyviosBackground" not in g.cookies:
<li><a href="${g.descurl | h}">Background image</a></li>
% endif
</ul>
</div>
</body>
</div>
<footer>
<ul>
<li>Maintained by <a href="https://en.wikipedia.org/wiki/User:The_Earwig">Ben Kurtovic</a></li>
<li><a href="${request.script_root}/api">API</a></li>
<li><a href="https://github.com/earwig/copyvios">Source code</a></li>
% if ("CopyviosBackground" in g.cookies and g.cookies["CopyviosBackground"].value in ["potd", "list"]) or "CopyviosBackground" not in g.cookies:
<li><a href="${g.descurl | h}">Background image</a></li>
% endif
</ul>
</footer>
</body>
</html>

+ 20
- 22
templates/support/header.mako View File

@@ -5,25 +5,23 @@
%>\
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>${title}</title>
<link rel="stylesheet" href="${request.script_root}${url_for('static', file='style.min.css')}"/>
<script src="https://tools-static.wmflabs.org/cdnjs/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="${request.script_root}${url_for('static', file='script.min.js')}"></script>
</head>
<% selected = g.cookies["CopyviosBackground"].value if "CopyviosBackground" in g.cookies else "list" %>\
% if selected == "plain":
<body style="background-image: url('${request.script_root}/static/background.png');">
% else:
<body onload="update_screen_size()" style="background-image: url('${set_background(selected) | h}'); background-size: cover;">
% endif
<div id="header">
<table id="heading">
<tr>
<td id="head-home"><a id="a-home" href="${request.script_root}/">Earwig's Copyvio Detector</a></td>
<td id="head-settings"><a id="a-settings" href="${request.script_root}/settings">Settings</a></td>
</tr>
</table>
</div>
<div id="container">
<head>
<meta charset="utf-8">
<title>${title | h}</title>
<link rel="stylesheet" href="${request.script_root}${url_for('static', file='style.min.css')}"/>
<script src="https://tools-static.wmflabs.org/cdnjs/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="${request.script_root}${url_for('static', file='script.min.js')}"></script>
</head>
<% selected = g.cookies["CopyviosBackground"].value if "CopyviosBackground" in g.cookies else "list" %>\
% if selected == "plain":
<body>
% else:
<body onload="update_screen_size()" style="background-image: url('${set_background(selected) | h}');">
% endif
<div id="container">
<div>
<header>
<h1><a href="/">Earwig&apos;s <strong>Copyvio Detector</strong></a></h1>
<a id="settings-link" href="/settings">Settings</a>
</header>
<main>

Loading…
Cancel
Save