Fix CCS

restyled-io · Dec 9, 2024 · b8a3e92 · b8a3e92
1 parent 00186d3
commit b8a3e92
Show file tree

Hide file tree

Showing 2 changed files with 328 additions and 1 deletion.
diff --git a/nginx/html/index.html b/nginx/html/index.html
@@ -8,7 +8,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <link rel="shortcut icon" href="/favicon.ico" />
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">
-    <link rel="stylesheet" href="https://restyled.io/static/css/strapless.css"><link rel="stylesheet" href="https://restyled.io/static/css/main.css">
+    <link rel="stylesheet" href="/main.css">
   </head>
   <body>
     <nav>

diff --git a/nginx/html/main.css b/nginx/html/main.css
@@ -1642,3 +1642,330 @@ body > hr {
   background-color: #d2d2d2;
   color: #4f4f4f;
 }
+
+
+/* Main */
+
+body {
+  text-align: justify;
+}
+
+img {
+  width: 100%;
+
+  -webkit-box-shadow: 2px 12px 20px #888;
+     -moz-box-shadow: 2px 12px 20px #888;
+          box-shadow: 2px 12px 20px #888;
+
+  /* Sometimes my screenshot tool leaves artifacts, this papers over it */
+  outline: 3px solid white;
+  outline-offset: -3px;
+}
+
+.avatar {
+  background: white;
+  border-radius: 20px;
+  box-shadow: none;
+  margin: 10px 10px 10px 0px;
+  outline: none;
+  vertical-align: middle;
+  width: 40px;
+}
+
+table {
+  margin-bottom: 12px;
+}
+
+footer {
+  text-align: center;
+}
+
+form .errors {
+  color: #cd5c5c;
+  font-weight: bold;
+}
+
+.large {
+  font-size: 120%;
+}
+
+.center, .centered {
+  text-align: center;
+}
+
+.right {
+  float: right;
+}
+
+.uncenter, .uncentered {
+  text-align: inherit !important;
+}
+
+.strikethrough, .struckthrough {
+  text-decoration: line-through;
+}
+
+.green { color: #7f9f7f; }
+.red { color: #cc9393; }
+
+.how-it-works-highlight {
+  background: #f0ebee;
+  border-radius: 6px;
+  margin-bottom: 1em;
+  margin-top: 1em;
+  padding-bottom: 1em;
+  padding-top: 1em;
+}
+
+.install-button {
+  font-size: 140%;
+  margin-top: 2em;
+  text-align: center;
+}
+
+.github-students .logo {
+  width: 6em;
+  margin: auto;
+}
+
+.github-students .logo img {
+  -webkit-box-shadow: none;
+     -moz-box-shadow: none;
+          box-shadow: none;
+
+  outline-offset: 0;
+  outline: none;
+}
+
+section.login {
+  margin-top: 3em;
+}
+
+.login li {
+  list-style: none;
+  text-align: center;
+}
+
+.login a {
+  font-size: 16pt;
+  line-height: 32pt;
+  padding-left: 32px;
+  text-align: left;
+  width: 13em;
+}
+
+.login a .logo {
+  display: inline-block;
+  height: 32px;
+  left: -6pt;
+  position: relative;
+  top: 6pt;
+  width: 32px;
+}
+
+.login a.github {
+  background: #04AA51;
+  border-color: #04aa51;
+  color: #ffffff;
+}
+
+.login a.github .logo {
+  background-image: url("/static/img/logos/github-light-32px.png");
+}
+
+.login a.gitlab {
+  background: #f3f3f3;
+  border-color: #909090;
+  color: #909090;
+}
+
+.login a.gitlab .logo {
+  background-image: url("/static/img/logos/gitlab-whitespace.png");
+}
+
+/* Strapless styling for textual inputs. Why not number too? */
+form input[type="number"] {
+  width: 100%;
+  min-width: 18ch;
+  padding: 1ch;
+  margin-bottom: 1em;
+  border: 1px solid #6c6c6c;
+}
+
+form select {
+  width: 100%;
+  min-width: 18ch;
+  padding: 1ch;
+  margin-bottom: 1em;
+}
+
+form aside input[type="number"],
+form aside select,
+form footer input[type="number"],
+form footer select {
+  margin-bottom: 6px;
+}
+
+/* Strapless styling for p (et al). Why not details too? */
+details {
+  margin: 0 auto 1em auto;
+}
+@media screen and (min-width: 480px) {
+  details {
+    max-width: 55ch;
+  }
+}
+
+.log-line .key-map-key {
+  color: #9bddff;
+}
+
+.log-line .key-map-value {
+  color: #ee82ee;
+}
+
+.log-line .prefix:before {
+  color: gray;
+  content: "[";
+}
+.log-line .prefix:after {
+  color: gray;
+  content: "] ";
+}
+
+.log-line .level-unknown.prefix {
+  display: none;
+}
+
+.log-line .level-unknown.content {
+  color: #d3d3d3;
+}
+
+.js .log-line-level-trace {
+  display: none;
+}
+
+.log-line .level-debug.prefix, .log-line .level-debug.content {
+  color: gray;
+}
+
+.log-line .level-info.prefix {
+  color: #2a77ac; /* N.B. matches strapless .info */
+}
+
+.log-line .level-warn.prefix {
+  color: #efefaf;
+}
+
+.log-line .level-error.prefix {
+  color: #cc9393;
+}
+
+/* Hide debug by default */
+.js .log-line-level-debug {
+  display: none;
+}
+
+form.toggle-debug {
+  display: none; /* overridden if .js */
+
+  margin: 0;
+  margin-bottom: 0px;
+  padding: 0;
+  padding-left: 0px;
+  padding-left: 15px;
+  font-size: 80%;
+  margin-bottom: -10px;
+}
+
+form.toggle-debug label {
+  display: inline;
+  padding-left: 5px;
+}
+
+.js form.toggle-debug {
+  display: block;
+}
+
+.logs-stream {
+  display: none;
+}
+.js .logs-stream {
+  display: block;
+  max-width: inherit;
+  width: 98%;
+}
+
+.card {
+  border-radius: 3px;
+  border: 1px solid #999;
+  padding: 0 !important; /* sorry */
+}
+
+.card header {
+  background-color: #999;
+  border-bottom: 1px solid #999;
+  color: white;
+  font-weight: bold;
+  padding: 5px 20px;
+}
+
+.card.warn header {
+  background-color: #f9ab84;
+  color: #595959;
+}
+
+.card .permalink {
+  float: right;
+  font-size: 85%;
+  font-style: italic;
+  font-weight: normal;
+}
+
+.card p {
+  padding: 10px 0;
+  margin-bottom: 10px;
+}
+
+.card pre {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.profile-repo {
+  height: 4em;
+  padding: 1em;
+}
+
+.profile-repo aside {
+  float: right;
+}
+
+ul.pagination {
+  margin: 2em auto;
+}
+
+.pagination li {
+  border: 1px solid #999;
+  display: inline;
+  padding: 0.5em 1em;
+}
+
+.pagination li:first-child {
+  border-right: none;
+}
+
+.pagination li:last-child {
+  border-left: none;
+}
+
+.pagination .disabled a {
+  text-decoration: none;
+}
+
+.pagination li.active,
+.pagination li:hover:not(.disabled) {
+  background-color: #999;
+  color: white;
+  font-weight: bold;
+}