source for lucas.co
updates
How_to_use_webfonts.html | 230 ----------------------------------------
SIL Open Font License.txt | 43 --------
index.html | 12 ++-
info.json | 41 +++-----
main.js | 232 ++++++++++++++++++-----------------------
site_v1/CNAME | 1 -
site_v1/contact.html | 26 -----
site_v1/index.html | 69 ------------
site_v1/index.html.bak | 69 ------------
site_v1/media/chobits-chii.png | Bin 2093311 -> 0 bytes
site_v1/media/magic.gif | Bin 20502976 -> 0 bytes
site_v1/media/rin_kokonoe.jpg | Bin 29799 -> 0 bytes
site_v1/mystyle.css | 127 ----------------------
site_v1/mystyle.css.bak | 119 ---------------------
site_v2/horny.gif | Bin 20502976 -> 0 bytes
site_v2/index.html | 29 ------
site_v2/indexx.html | 45 --------
site_v2/media/chobits-chii.png | Bin 2093311 -> 0 bytes
site_v2/media/magic.gif | Bin 20502976 -> 0 bytes
site_v2/media/rin_kokonoe.jpg | Bin 29799 -> 0 bytes
site_v2/styles.css | 82 ---------------
styles.css | 2 +-
tests.txt | 12 ---
23 files changed, 129 insertions(+), 1010 deletions(-)
diff --git a/How_to_use_webfonts.html b/How_to_use_webfonts.html
deleted file mode 100644
index 653499c..0000000
--- a/How_to_use_webfonts.html
+++ /dev/null
@@ -1,230 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-
- <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
-
- <style type="text/css" media="screen">
- /*-- RESET ------*/
- html, body, div, span, applet, object, iframe,
- h1, h2, h3, h4, h5, h6, p, blockquote, pre,
- a, abbr, acronym, address, big, cite, code,
- del, dfn, em, font, img, ins, kbd, q, s, samp,
- small, strike, strong, sub, sup, tt, var,
- b, u, i, center, dl, dt, dd, ol, ul, li,
- fieldset, form, label, legend, table,
- caption, tbody, tfoot, thead, tr, th, td
- {margin: 0;padding: 0;border: 0;outline: 0;
- font-size: 100%;vertical-align: baseline;
- background: transparent;}
- body {line-height: 1;}
- ol, ul {list-style: none;}
- blockquote, q {quotes: none;}
- blockquote:before, blockquote:after,
- q:before, q:after {content: ''; content: none;}
- :focus {outline: 0;}
- ins {text-decoration: none;}
- del {text-decoration: line-through;}
- table {border-collapse: collapse;border-spacing: 0;}
-
- /*-- GRID -----*/
- .section {margin-bottom: 18px;
- }
- .section:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
- .section {*zoom: 1;}
-
- .section .firstcolumn,
- .section .firstcol {margin-left: 0;}
-
- .grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
- {margin-left: 15px;float: left;display: inline; overflow: hidden;}
- .width5, .grid5, .span-5 {width: 335px;}
- .width5_2cols,.grid5_2cols {width: 160px;}
- .width5_3cols,.grid5_3cols {width: 101px;}
- .width5_4cols,.grid5_4cols {width: 72px;}
- .input_width5 {width: 329px;}
-
- .width6, .grid6, .span-6 {width: 405px;}
- .width6_4cols,.grid6_4cols {width: 90px;}
- .input_width6 {width: 399px;}
-
- .width7, .grid7, .span-7 {width: 475px;}
- .width7_2cols,.grid7_2cols {width: 230px;}
- .width7_3cols,.grid7_3cols {width: 148px;}
- .width7_4cols,.grid7_4cols {width: 107px;}
- .input_width7 {width: 469px;}
-
- /*-- STYLES -----*/
- body {
- color: #000;
- background-color: #dcdcdc;
- font: 13px Arial, sans-serif;
- }
-
- a {
- text-decoration: none;
- color: #1883ba;
- }
-
- h1{
- font-size: 32px;
- font-weight: normal;
- font-style: normal;
- margin-bottom: 18px;
- }
-
- h2{
- font-size: 18px;
- }
-
- #container {
- width: 865px;
- margin: 0px auto;
- }
-
-
-
- #header {
- height:109px;
- font-size: 36px;
- background-color: #000;
- color: #fff;
- text-indent:-9999px;
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAABtCAMAAAAhztx9AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRFzen3mNLwDCc17fj8GVRwUbXlLprOrNzyesbrEjtOZb3oJXulP63iAAAA////MqfgopnD5wAABSNJREFUeNrs2u1yqyAQBmBARATU+7/bo6CRTwMp7ZnJvPurjUbrU1gWkGyIyiAgABWoQAUqUIEKASpQgQpUoAIVAlSgAhWoQAUqxJdSCbYsHFQ1MS/Lr1h9IRU7qBZQVVNpUL0PDao2K1BVJ/ZjKORdyb6SSiwLc0VDT6uvohKcMS72H/gyn0VDx7Lhq6hsM2LiyFZ6404KrSobzuawWoQ4pRhyVZnKdj7b/djMO1btX0V197m9UbHe5cJ3jYB7Wj873TwL1FUVw+CR1DEHrMT6jct+59Ke1qD6nwGqn1HpTATJQPN9rGGcR+1caC1y17oOPl/XSDoRQiiV4/2ZumMML6zKh4z/UXLUfTX+iNL93hOl6dmPVGxJwkuUevY+5yJc/WAiLQvZvTSSxnXeSNY7hul6gnUNPvaecA0PEek99/4Bvc8b4qc/vhDQ0qF0l59QiTk6osOFIvYZFQ2ffM1S7UFMnmr1RSKqdTCPVHKIb9KFSqTHeEB1TCvaqWKpItVttZatYqr42UMqmt6jjYqHoQNF96vQ0YpQbqn2RSWuS7kdlStc77NPeuaoUVHiU+3Zy8Vk//uT97w0PERKVK8vZaik07luLvebN1I9zLK8OYPDEcFvoVXaJ3W6oTLF/0qTe+jN2Hw25pqGOS6xyhLVKktUo0Wm4ajQgUokPUz7XfDqY6KV6vhzTe6GIdVmhvv3ODcPd+PJUK2qQDUlkM0jYL4KjiHOdhZR+cNgFVUxP0RUfvOLqeh9KEflD4PeV8ekTXWimjMLsF6XOxDmqOH1pZJlKlWmIiQYOzdyf5VmBsguVGmjCvi0zfjhqNiXSn1GZRMSyVGRJOf3odK5HW6vmLJU0TZcda6SP6SSD1Sun00ZqiFKYz2p2Fsqt1WiW0fAdRrfU9EyFSmndXKWBDKhMvFVPqFifvAHKnE/+Unlii/RQGWGc3ay11DKPFB5HnHJ/VAskPO/caX2m+o4c/gpVa5W59lttZTKlvTnMFhFdVY3V7EsS1Q0X1cZJW3FdeXnHJX1OU8Iqcj/pPJnOHVU8Yw1N0UxzoMUJzavDpalMvcwWKC6Z1H076i8yrSS6pxTkCG0UuWJXlkqT+Va7vQLVNVpXeSoXGWqm6iupOO3HVVePkjmuOP2TOXSGS3nql+nSkfAV7l1WDVTnY805qgGb5T0p8vRkF+gcqlOFkfA0V6LdKNaKqm2M7V/QGUfRaUrC1SV5rw0zM4lqmsYfKyraBeqqmo96JjsI6rp9deq8gzNpzJhDVukOofBx2q9E1XFHDBe6PuEirZS2T57T+XKVNaUPM4BO1FVrCzw6Oyfd8Aaqm3wTyxT3QVccWWhE1XFehWPGdupxjCtV1HJpwVjEo8ZT+tVnagqVkF53GFrqILZn927IVsbVZB0lJ+A4nqchlTJKmgvqvdr6wGVYHVUZJikm/sZ5ZbJZSuV8pY6g2opmbqQ9WFt3U2RulC93bHhaY+toIrryWlrpdq8tmgz1zAVqNwKfdolvehC9XYfkL+tWiuo6NZONXqNka7BYg3JzM2f9gE7Ub3ZXU5qCV1DJQOradw+oHL1pcmtwZPMuPEwV2/ZXY7fUUhaln1nYc69s5B9aSE9S+cmy9S+saDCfSZVeokgefHAvt9gXpOUaXqdl1xhTN5ZGF/vLJimRRgEqEAFKlCBClQIUIEKVKACFahAhQAVqEAFKlCBCgEqUIEKVKACFQJUoAIVqEAFKgSoQAUqUIEKVKBCgApUfx3/BBgAeuw63hnBp0AAAAAASUVORK5CYII=) no-repeat left center;
- background-color: #31a7e0;
-
- }
-
- #main_content {
- background-color: #fff;
- padding: 20px 20px 20px;
- }
-
-
- #footer p {
- margin: 0;
- padding-top: 10px;
- padding-bottom: 50px;
- color: #333;
- font: 10px Arial, sans-serif;
- }
- code {
- white-space: pre;
- background-color: #eee;
- display: block;
- padding: 10px;
- margin-bottom: 18px;
- overflow: auto;
- }
-
- .box {
- padding: 18px;
- margin-bottom: 18px;
- background: #eee;
- }
- .bottom,.last {margin-bottom:0 !important; padding-bottom:0 !important;}
-
-
-
- p{
- line-height: 1.2em;
- margin-bottom: 18px;
- font: 13px Arial, sans-serif;
- }
-
-
-
- h3{
- font-size: 15px;
- margin-top: 18px;
- }
-
- .sidebar p{
- font-size: 12px;
- line-height: 1.4em;
- }
-
- </style>
-
-<title>How to Use Webfonts</title>
-
-</head>
-
-<body>
-<div id="container">
- <div id="header">
- Fontspring
- </div>
- <div id="main_content">
- <div class="section">
- <div class="grid7 firstcol">
- <h1>Installing Webfonts</h1>
-
- <p>Webfonts are supported by all major browser platforms but not all in the same way. There are currently four different font formats that must be included in order to target all browsers. This includes TTF, WOFF, EOT and SVG.</p>
-
- <h2>1. Upload your webfonts</h2>
- <p>You must upload your webfont kit to your website. They should be in or near the same directory as your CSS files.</p>
-
- <h2>2. Include the webfont stylesheet</h2>
- <p>A special CSS @font-face declaration helps the various browsers select the appropriate font it needs without causing you a bunch of headaches. Learn more about this syntax by reading the <a href="https://www.fontspring.com/blog/further-hardening-of-the-bulletproof-syntax">Fontspring blog post</a> about it. The code for it is as follows:</p>
-
-
-<code>
-@font-face{
- font-family: 'MyWebFont';
- src: url('WebFont.eot');
- src: url('WebFont.eot?iefix') format('eot'),
- url('WebFont.woff') format('woff'),
- url('WebFont.ttf') format('truetype'),
- url('WebFont.svg#webfont') format('svg');
-}
-</code>
- <p>We've already gone ahead and generated the code for you. All you have to do is link to the stylesheet in your HTML, like this:</p>
- <code><link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" /></code>
-
- <h2>3. Modify your own stylesheet</h2>
- <p>To take advantage of your new fonts, you must tell your stylesheet to use them. Look at the original @font-face declaration above and find the property called "font-family." The name linked there will be what you use to reference the font. Prepend that webfont name to the font stack in the "font-family" property, inside the selector you want to change. For example:</p>
-<code>p { font-family: 'MyWebFont', Arial, sans-serif; }</code>
-
-<h2>4. Test</h2>
-<p>Getting webfonts to work cross-browser <em>can</em> be tricky. Use the information in the sidebar to help you if you find that fonts aren't loading in a particular browser.</p>
- </div>
-
- <div class="grid5 sidebar">
- <div class="box">
- <h2>Troubleshooting<br />Font-Face Problems</h2>
- <p>Having trouble getting your webfonts to load in your new website? Here are some tips to sort out what might be the problem.</p>
-
- <h3>Fonts not showing in any browser</h3>
-
- <p>This sounds like you need to work on the plumbing. You either did not upload the fonts to the correct directory, or you did not link the fonts properly in the CSS. If you've confirmed that all this is correct and you still have a problem, take a look at your .htaccess file and see if requests are getting intercepted.</p>
-
- <h3>Fonts not loading in iPhone or iPad</h3>
-
- <p>The most common problem here is that you are serving the fonts from an IIS server. IIS refuses to serve files that have unknown MIME types. If that is the case, you must set the MIME type for SVG to "image/svg+xml" in the server settings. Follow these instructions from Microsoft if you need help.</p>
-
- <h3>Fonts not loading in Firefox</h3>
-
- <p>The primary reason for this failure? You are still using a version Firefox older than 3.5. So upgrade already! If that isn't it, then you are very likely serving fonts from a different domain. Firefox requires that all font assets be served from the same domain. Lastly it is possible that you need to add WOFF to your list of MIME types (if you are serving via IIS.)</p>
-
- <h3>Fonts not loading in IE</h3>
-
- <p>Are you looking at Internet Explorer on an actual Windows machine or are you cheating by using a service like Adobe BrowserLab? Many of these screenshot services do not render @font-face for IE. Best to test it on a real machine.</p>
-
- <h3>Fonts not loading in IE9</h3>
-
- <p>IE9, like Firefox, requires that fonts be served from the same domain as the website. Make sure that is the case.</p>
- </div>
- </div>
- </div>
-
- </div>
-
- </div>
-
-</div>
-</body>
-</html>
diff --git a/SIL Open Font License.txt b/SIL Open Font License.txt
deleted file mode 100644
index 6873bd6..0000000
--- a/SIL Open Font License.txt
+++ /dev/null
@@ -1,43 +0,0 @@
-Copyright (c) 2013-2016 Abhaya Libre Project Authors (https://github.com/mooniak/abhaya-libre-font).
-
-This Font Software is licensed under the SIL Open Font License, Version 1.1.
-This license is copied below, and is also available with a FAQ at: http://scripts.sil.org/OFL
-
------------------------------------------------------------
-SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
------------------------------------------------------------
-
-PREAMBLE
-The goals of the Open Font License (OFL) are to stimulate worldwide development of collaborative font projects, to support the font creation efforts of academic and linguistic communities, and to provide a free and open framework in which fonts may be shared and improved in partnership with others.
-
-The OFL allows the licensed fonts to be used, studied, modified and redistributed freely as long as they are not sold by themselves. The fonts, including any derivative works, can be bundled, embedded, redistributed and/or sold with any software provided that any reserved names are not used by derivative works. The fonts and derivatives, however, cannot be released under any other type of license. The requirement for fonts to remain under this license does not apply to any document created using the fonts or their derivatives.
-
-DEFINITIONS
-"Font Software" refers to the set of files released by the Copyright Holder(s) under this license and clearly marked as such. This may include source files, build scripts and documentation.
-
-"Reserved Font Name" refers to any names specified as such after the copyright statement(s).
-
-"Original Version" refers to the collection of Font Software components as distributed by the Copyright Holder(s).
-
-"Modified Version" refers to any derivative made by adding to, deleting, or substituting -- in part or in whole -- any of the components of the Original Version, by changing formats or by porting the Font Software to a new environment.
-
-"Author" refers to any designer, engineer, programmer, technical writer or other person who contributed to the Font Software.
-
-PERMISSION & CONDITIONS
-Permission is hereby granted, free of charge, to any person obtaining a copy of the Font Software, to use, study, copy, merge, embed, modify, redistribute, and sell modified and unmodified copies of the Font Software, subject to the following conditions:
-
-1) Neither the Font Software nor any of its individual components, in Original or Modified Versions, may be sold by itself.
-
-2) Original or Modified Versions of the Font Software may be bundled, redistributed and/or sold with any software, provided that each copy contains the above copyright notice and this license. These can be included either as stand-alone text files, human-readable headers or in the appropriate machine-readable metadata fields within text or binary files as long as those fields can be easily viewed by the user.
-
-3) No Modified Version of the Font Software may use the Reserved Font Name(s) unless explicit written permission is granted by the corresponding Copyright Holder. This restriction only applies to the primary font name as presented to the users.
-
-4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font Software shall not be used to promote, endorse or advertise any Modified Version, except to acknowledge the contribution(s) of the Copyright Holder(s) and the Author(s) or with their explicit written permission.
-
-5) The Font Software, modified or unmodified, in part or in whole, must be distributed entirely under this license, and must not be distributed under any other license. The requirement for fonts to remain under this license does not apply to any document created using the Font Software.
-
-TERMINATION
-This license becomes null and void if any of the above conditions are not met.
-
-DISCLAIMER
-THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM OTHER DEALINGS IN THE FONT SOFTWARE.
\ No newline at end of file
diff --git a/index.html b/index.html
index 69cd7e0..e3c6fd5 100644
--- a/index.html
+++ b/index.html
@@ -1,18 +1,22 @@
<!DOCTYPE html>
+
<html>
<head>
+
<link rel="stylesheet" href="/styles.css">
-<script src="/main.js"></script>
+<script src="./main.js" type="module"></script>
+
</head>
-<body id="body" onload="loadPage()">
+<body id="body">
+
<div id="box">
- <div id="description">
- </div>
+ <div id="description"></div>
</div>
<a id="files" href="files.html">Files</a>
+
</body>
</html>
\ No newline at end of file
diff --git a/info.json b/info.json
index 0cd8812..bec3383 100644
--- a/info.json
+++ b/info.json
@@ -1,40 +1,33 @@
{
- "tabs":
- {
- "tab_0":
- {
+ "tabs": {
+ "tab_0": {
"title": "Morphogen",
- "body": "very special & advanced computer programme"
+ "body": "Computer program for design through evolution and growth based exploration.",
+ "image": []
},
- "tab_1":
- {
+ "tab_1": {
"title": "Moldtek",
- "body": "another very special and advanced computer programme"
+ "body": "Computer based mold designing tools for objects with very complex geometry.",
+ "image": []
},
- "tab_2":
- {
+ "tab_2": {
"title": "Drawing",
- "body": "a mad dope drawing i done"
+ "body": "Some pencil drawings",
+ "image": ["/images/drawing.png"]
},
- "tab_3":
- {
+ "tab_3": {
"title": "Spoon",
- "body": "im working on it"
+ "body": "A wax carving intended for ceramic slip casting",
+ "image": []
},
- "tab_4":
- {
- "title": "info",
- "body": "tab 4 lol"
- },
-
- "tab_5":
- {
- "title": "tab_5_title",
- "body": "tab 5 lolol"
+ "tab_4": {
+ "title": "Info",
+ "body": "Lucas Galante\n\[email protected]/\n\n",
+ "image": []
}
}
}
\ No newline at end of file
diff --git a/main.js b/main.js
index dece9ec..f0d9b10 100644
--- a/main.js
+++ b/main.js
@@ -1,56 +1,26 @@
-let tab_data = {
- tab_0:
- {
- title: "Morphogen",
- body: "Computer program for design through evolution and growth based exploration.",
- images: []
- },
-
- tab_1:
- {
- title: "Moldtek",
- body: "Computer based mold designing tools for objects with very complex geometry.",
- images: []
- },
-
- tab_2:
- {
- title: "Drawing",
- body: "Some pencil drawings",
- images: ["/images/drawing.png"]
- },
-
- tab_3:
- {
- title: "Spoon",
- body: "A wax carving intended for ceramic slip casting.",
- images: []
- },
-
- tab_4:
- {
- title: "Info",
- body: "Lucas Galante\n\[email protected]/\n\ngithub.com/lsgalante",
- images: []
- }
-}
-
-window.addEventListener("resize", function() {
- sizing() });
+import data from "./info.json" assert { type: "json" };
+console.log(data);
-let n_tabs = Object.keys(tab_data).length;
+let n_tabs = Object.keys(data.tabs).length;
let active_tab = 0;
const bg_on = "#3f3131";
-const txt_on = "#ffffff";
-
const bg_off = "#ffffff";
+
+const txt_on = "#ffffff";
const txt_off = "#000000";
let tabs = [];
let counts = [0, 0, 0, 0];
+let w_start = 0;
+
+loadPage();
+
function loadPage() {
+ window.addEventListener("resize", function() {
+ sizing() });
+
create_tabs();
set_tab(0);
}
@@ -90,7 +60,7 @@ function create_tabs() {
let pos = tab.pos;
- let title = tab_data[tab.id].title;
+ let title = data.tabs[tab.id].title;
if(pos == 1 || pos == 3) {
let new_title = "";
@@ -128,7 +98,7 @@ function set_tab(idx) {
let tab_id = "tab_" + idx;
const description = document.getElementById("description");
- (description.innerText = tab_data[tab_id]["body"])
+ (description.innerText = data.tabs[tab_id]["body"])
sizing();
}
@@ -155,7 +125,7 @@ function images(i) {
}
let box = document.getElementById("box");
- let urls = tab_data["tab_" + i].images;
+ let urls = data.tabs["tab_" + i].image;
let n = 0;
for(let url of urls) {
let image = document.createElement("img");
@@ -170,110 +140,114 @@ function sizing() {
let window_w = window.innerWidth;
let window_h = window.innerHeight;
- let font_size = window_h * 0.014;
+ if(window_w != w_start) {
+ w_start = window_w;
- // box
- let box = document.getElementById("box");
-
- let box_w = window_w * 0.6;
- let box_h = window_h * 0.5;
-
- let box_left = window_w / 2 - box_w / 2;
- let box_top = window_h / 2 - box_h / 2;
-
- box.style.width = box_w + "px";
- box.style.height = box_h + "px";
-
- box.style.left = box_left + "px";
- box.style.top = box_top + "px";
+ let font_size = window_h * 0.014;
- box.style.fontSize = font_size + "px";
-
- // image
- let images = document.getElementsByTagName("img");
- let n_images = images.length;
- console.log(n_images);
-
- let img_w = box_w * 0.4;
- let img_h = box_h * 0.4;
+ // box
+ let box = document.getElementById("box");
+
+ let box_w = window_w * 0.6;
+ let box_h = window_h * 0.5;
+
+ let box_left = window_w / 2 - box_w / 2;
+ let box_top = window_h / 2 - box_h / 2;
+
+ box.style.width = box_w + "px";
+ box.style.height = box_h + "px";
+
+ box.style.left = box_left + "px";
+ box.style.top = box_top + "px";
- for(img of images) {
- img.style.width = img_w + "px";
- img.style.height = img_h + "px";
+ box.style.fontSize = font_size + "px";
+
+ // image
+ let images = document.getElementsByTagName("img");
+ let n_images = images.length;
+
+ let img_w = box_w * 0.4;
+ let img_h = box_h * 0.4;
- img.style.left = 20 + "px";
- img.style.top = (img_h - 20) + "px";
- }
+ for(img of images) {
+ img.style.width = img_w + "px";
+ img.style.height = img_h + "px";
- // tab
- let tab_w;
- let tab_h;
-
- let dim_1 = window_h * 0.03;
-
- const border_radius = 45;
+ img.style.left = 20 + "px";
+ img.style.top = (img_h - 20) + "px";
+ }
- for(let i = 0; i < n_tabs; i++) {
- let tab = tabs[i];
- let pos = tab.pos;
- let idx = tab.idx;
- let count = counts[pos];
+ // tab
+ let tab_w;
+ let tab_h;
+
+ let dim_1 = window_h * 0.03;
+
+ const border_radius = 45;
- tab.style.fontSize = font_size + "px";
+ for(let i = 0; i < n_tabs; i++) {
+ let tab = tabs[i];
+ let pos = tab.pos;
+ let idx = tab.idx;
+ let count = counts[pos];
- if(pos == 0) {
- tab_w = box_w / count;
- tab_h = dim_1;
+ tab.style.fontSize = font_size + "px";
- tab.style.left = box_left + "px";
- tab.style.top = (box_top - tab_h) + "px";
+ if(pos == 0) {
+ tab_w = box_w / count;
+ tab_h = dim_1;
- tab.style.borderTopLeftRadius = border_radius + "px";
- tab.style.borderTopRightRadius = border_radius + "px";
- }
+ tab.style.left = box_left + "px";
+ tab.style.top = (box_top - tab_h) + "px";
- if(pos == 1) {
- tab_w = dim_1;
- tab_h = box_h / count;
+ tab.style.borderTopLeftRadius = border_radius + "px";
+ tab.style.borderTopRightRadius = border_radius + "px";
+ }
- tab.style.left = (box_left + box_w - tab_w / 2 + tab_w / 2) + "px";
- tab.style.top = (box_top + tab_h / 2 - tab_h / 2 + tab_h * idx) + "px";
+ if(pos == 1) {
+ tab_w = dim_1;
+ tab_h = box_h / count;
- tab.style.borderTopRightRadius = border_radius + "px";
- tab.style.borderBottomRightRadius = border_radius + "px";
+ tab.style.left = (box_left + box_w - tab_w / 2 + tab_w / 2) + "px";
+ tab.style.top = (box_top + tab_h / 2 - tab_h / 2 + tab_h * idx) + "px";
- tab.style.lineHeight = font_size + "px";
- }
+ tab.style.borderTopRightRadius = border_radius + "px";
+ tab.style.borderBottomRightRadius = border_radius + "px";
- if(pos == 2) {
- tab_w = box_w / count
- tab_h = dim_1;
-
- tab.style.top = (box_top + box_h) + "px";
- tab.style.left = (box_left + tab_w * idx) + "px";
-
- tab.style.borderBottomRightRadius = border_radius + "px";
- tab.style.borderBottomLeftRadius = border_radius + "px";
- }
+ tab.style.lineHeight = font_size + "px";
+ }
- if(pos == 3) {
- tab_w = dim_1;
- tab_h = box_h / count;
+ if(pos == 2) {
+ tab_w = box_w / count
+ tab_h = dim_1;
+
+ tab.style.top = (box_top + box_h) + "px";
+ tab.style.left = (box_left + tab_w * idx) + "px";
+
+ tab.style.borderBottomRightRadius = border_radius + "px";
+ tab.style.borderBottomLeftRadius = border_radius + "px";
+ }
+
+ if(pos == 3) {
+ tab_w = dim_1;
+ tab_h = box_h / count;
+
+ tab.style.top = (box_top + tab_h / 2 - tab_h / 2 + tab_h * idx) + "px";
+ tab.style.left = (box_left - tab_w / 2 - tab_w / 2) + "px";
+
+ tab.style.borderBottomLeftRadius = border_radius + "px";
+ tab.style.borderTopLeftRadius = border_radius + "px";
- tab.style.top = (box_top + tab_h / 2 - tab_h / 2 + tab_h * idx) + "px";
- tab.style.left = (box_left - tab_w / 2 - tab_w / 2) + "px";
-
- tab.style.borderBottomLeftRadius = border_radius + "px";
- tab.style.borderTopLeftRadius = border_radius + "px";
+ tab.style.lineHeight = font_size + "px";
+ }
- tab.style.lineHeight = font_size + "px";
+ tab.style.width = tab_w + "px";
+ tab.style.height = tab_h + "px";
}
- tab.style.width = tab_w + "px";
- tab.style.height = tab_h + "px";
+ // files
+ let files_box = document.getElementById("files");
+ files_box.style.fontSize = font_size + "px";
}
- // files
- let files_box = document.getElementById("files");
- files_box.style.fontSize = font_size + "px";
}
\ No newline at end of file
diff --git a/site_v1/CNAME b/site_v1/CNAME
deleted file mode 100644
index 6a06bef..0000000
--- a/site_v1/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-synthpu.re
diff --git a/site_v1/contact.html b/site_v1/contact.html
deleted file mode 100644
index 2676843..0000000
--- a/site_v1/contact.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-<head>
- <link rel="stylesheet" href="mystyle.css">
- <title>Synthpu.re/contact</title>
-</head>
-
-<body>
- <div class="header">
- Synthpu.re
- </div>
-
- <div class="navigation">
- <a class="there" href="/items.html">Items</a>
- <a class="here" href="/contact.html">Contact</a>
- </div>
-
- <div class = "contact_box">
- <div>Lucas Galante</div>
- <p>[email protected]</p>
- <p>@_lucasgalante</p>
- </div>
-</body>
-
-</html>
diff --git a/site_v1/index.html b/site_v1/index.html
deleted file mode 100644
index d60b67f..0000000
--- a/site_v1/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-<head>
- <link rel="stylesheet" href="mystyle.css">
- <title>Synthpu.re</title>
-</head>
-
-<body>
- <div class="header">
- Synthpu.re
- </div>
-
- <div class = "contact_box">
- <div>Halcyinth Elbatour</div>
- <p>[email protected]</p>
- <p>@x</p>
- </div>
-
- <div class="chocolate_box">
- <div class="box_title">Chocolate Anime Figures</div>
-
- <input class="radio" id="one" name="chocolate_figures" type="radio" checked>
- <input class="radio" id="two" name="chocolate_figures" type="radio">
-
- <div class="tab_container">
- <label class="tab" id="tab_one" for="one">Chobits Chii</label>
- <label class="tab" id="tab_two" for="two">New Figure</label>
- </div>
-
- <div class="slides">
- <div class="slide" id="slide_one">
- <img class="image" src="media/chobits-chii.png" height="128" width="128">
- <div class="description">Chobits Chii is a beautiful girl and you can take a big bite out of her with Chobits Chii Anime Figure Made Out of Chocolate.</div>
- <div class="price">USD 80</div>
- </div>
- <div class="slide" id="slide_two">
- <img class="image" src="media/rin_kokonoe.jpg" height="128" width="128">
- <div class="description">Please bear the extra cost and ask me to make you a new Anime Figure that I have not done before. Whatever character you choose will be added to the lineup of figures you can order for USD 80.</div>
- <div class="price">USD 200</div>
- </div>
- </div>
- </div>
-
- <div class="sewing_box">
-
- <div class="box_title">Sewing Services</div>
-
- <input class="radio" id="one" name="sewing_services" type="radio" checked>
-
- <div class="tab_container">
- <label class="tab" id="tab_one" for="one">Alterations</label>
- </div>
-
- <div class="slides">
- <div class="slide" id="slide_one">
- Alteration
- </div>
- <div class="price">USD TBD</div>
- </div>
- </div>
-
- <div class="magic_box">
- <img class="image" src="media/magic.gif" height="200" width="200">
- </div>
-
-</body>
-
-</html>
diff --git a/site_v1/index.html.bak b/site_v1/index.html.bak
deleted file mode 100644
index 327e6db..0000000
--- a/site_v1/index.html.bak
+++ /dev/null
@@ -1,69 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-<head>
- <link rel="stylesheet" href="mystyle.css">
- <title>Synthpu.re</title>
-</head>
-
-<body>
- <div class="header">
- Synthpu.re
- </div>
-
- <div class = "contact_box">
- <div>Halcyinth Elbatour</div>
- <p>[email protected]</p>
- <p>@x</p>
- </div>
-
- <div class="chocolate_box">
- <div class="box_title">Chocolate Anime Figures</div>
-
- <input class="radio" id="one" name="chocolate_figures" type="radio" checked>
- <input class="radio" id="two" name="chocolate_figures" type="radio">
-
- <div class="tab_container">
- <label class="tab" id="tab_one" for="one">Chobits Chii</label>
- <label class="tab" id="tab_two" for="two">New Figure</label>
- </div>
-
- <div class="slides">
- <div class="slide" id="slide_one">
- <img class="image" src="media/chobits-chii.png" height="128" width="128">
- <div class="description">Chobits Chii is a beautiful girl and you can take a big bite out of her with Chobits Chii Anime Figure Made Out of Chocolate.</div>
- <div class="price">USD 80</div>
- </div>
- <div class="slide" id="slide_two">
- <img class="image" src="media/rin_kokonoe.jpg" height="128" width="128">
- <div class="description">Please bear the extra cost and ask me to make you a new Anime Figure that I have not done before. Whatever character you choose will be added to the lineup of figures you can order for USD 80.</div>
- <div class="price">USD 200</div>
- </div>
- </div>
- </div>
-
- <div class="sewing_box">
-
- <div class="box_title">Sewing Services</div>
-
- <input class="radio" id="one" name="sewing_services" type="radio" checked>
-
- <div class="tab_container">
- <label class="tab" id="tab_one" for="one">Alterations</label>
- </div>
-
- <div class="slides">
- <div class="slide" id="slide_one">
- Alteration
- </div>
- <div class="price">USD TBD</div>
- </div>
- </div>
-
- <div class="magic_box">
-
- </div>
-
-</body>
-
-</html>
diff --git a/site_v1/media/chobits-chii.png b/site_v1/media/chobits-chii.png
deleted file mode 100644
index 7c7bc31..0000000
Binary files a/site_v1/media/chobits-chii.png and /dev/null differ
diff --git a/site_v1/media/magic.gif b/site_v1/media/magic.gif
deleted file mode 100644
index 86c6d73..0000000
Binary files a/site_v1/media/magic.gif and /dev/null differ
diff --git a/site_v1/media/rin_kokonoe.jpg b/site_v1/media/rin_kokonoe.jpg
deleted file mode 100644
index 530e5ab..0000000
Binary files a/site_v1/media/rin_kokonoe.jpg and /dev/null differ
diff --git a/site_v1/mystyle.css b/site_v1/mystyle.css
deleted file mode 100644
index de77e3d..0000000
--- a/site_v1/mystyle.css
+++ /dev/null
@@ -1,127 +0,0 @@
-
-
-body {
- background:white;
-}
-
-.header {
- padding:20px;
- margin:25px 25px 25px 100px;
-}
-
-.contact_box {
- height:100px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- border:1px solid black;
-}
-
-.chocolate_box {
- height:250px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- outline:1px solid black;
-}
-
-.sewing_box {
- height:250px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- outline:1px solid black;
-}
-
-.magic_box {
- height:250px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- outline:1px solid black;
-}
-
-.box_title {
- margin:0px 0px 20px 0px;
- outline:1px solid white;
-}
-
-.tab_container {
- margin:0px 0px 20px 0px;
- outline:0px solid black;
-}
-
-.tab {
- display:inline-block;
- cursor:pointer;
- padding:2px 8px 2px 8px;
- margin:0px 2px 0px 0px;
- outline:1px solid black;
-}
-
-.here:link, a.here:visited {
- background-color:black;
- color:white;
- padding:3px 35px;
- text-align:center;
- border:1px solid black;
- text-decoration:none;
- display:inline-block;
-}
-
-.there:link {
- background-color:white;
- color:black;
- padding:3px 35px;
- text-align:center;
- border:1px solid black;
- text-decoration:none;
- display:inline-block;
-}
-
-.slides {
- border:0px solid black;
-}
-
-.image {
- display:inline-block;
- margin:0px 10px 0px 0px;
- outline:0px solid black;
-}
-
-.description {
- display:inline-block;
- width:230px;
- vertical-align:top;
- text-align:justify;
- margin:0px 40px 0px 0px;
- outline:0px solid black;
-}
-
-.price {
- display:inline-block;
- vertical-align:top;
- margin:0px 0px 0px 0px;
- outline:0px solid black;
-}
-
-.slide {
- display:none;
-}
-
-.radio {
- display:none;
-}
-
-#one:checked ~ .slides #slide_one,
-#two:checked ~ .slides #slide_two,
-#three:checked ~ .slides #slide_three {
- display:block
-}
-
-#one:checked ~ .tab_container #tab_one,
-#two:checked ~ .tab_container #tab_two,
-#three:checked ~ .tab_container #tab_three {
- background:black;
- color:white;
-}
diff --git a/site_v1/mystyle.css.bak b/site_v1/mystyle.css.bak
deleted file mode 100644
index 26c6517..0000000
--- a/site_v1/mystyle.css.bak
+++ /dev/null
@@ -1,119 +0,0 @@
-
-
-body {
- background:white;
-}
-
-.header {
- padding:20px;
- margin:25px 25px 25px 100px;
-}
-
-.contact_box {
- height:100px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- border:1px solid black;
-}
-
-.chocolate_box {
- height:250px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin:25px 25px 25px 25px;
- outline:1px solid black;
-}
-
-.sewing_box {
- height:250px;
- width:500px;
- padding:20px 20px 20px 20px;
- margin: 25px 25px 25px 25px;
- outline:1px solid black;
-}
-
-.box_title {
- margin:0px 0px 20px 0px;
- outline:1px solid white;
-}
-
-.tab_container {
- margin:0px 0px 20px 0px;
- outline:0px solid black;
-}
-
-.tab {
- display:inline-block;
- cursor:pointer;
- padding:2px 8px 2px 8px;
- margin:0px 2px 0px 0px;
- outline:1px solid black;
-}
-
-.here:link, a.here:visited {
- background-color:black;
- color:white;
- padding:3px 35px;
- text-align:center;
- border:1px solid black;
- text-decoration:none;
- display:inline-block;
-}
-
-.there:link {
- background-color:white;
- color:black;
- padding:3px 35px;
- text-align:center;
- border:1px solid black;
- text-decoration:none;
- display:inline-block;
-}
-
-.slides {
- border:0px solid black;
-}
-
-.image {
- display:inline-block;
- margin:0px 10px 0px 0px;
- outline:0px solid black;
-}
-
-.description {
- display:inline-block;
- width:230px;
- vertical-align:top;
- text-align:justify;
- margin:0px 40px 0px 0px;
- outline:0px solid black;
-}
-
-.price {
- display:inline-block;
- vertical-align:top;
- margin:0px 0px 0px 0px;
- outline:0px solid black;
-}
-
-.slide {
- display:none;
-}
-
-.radio {
- display:none;
-}
-
-#one:checked ~ .slides #slide_one,
-#two:checked ~ .slides #slide_two,
-#three:checked ~ .slides #slide_three {
- display:block
-}
-
-#one:checked ~ .tab_container #tab_one,
-#two:checked ~ .tab_container #tab_two,
-#three:checked ~ .tab_container #tab_three {
- background:black;
- color:white;
-}
diff --git a/site_v2/horny.gif b/site_v2/horny.gif
deleted file mode 100644
index 86c6d73..0000000
Binary files a/site_v2/horny.gif and /dev/null differ
diff --git a/site_v2/index.html b/site_v2/index.html
deleted file mode 100644
index 816c282..0000000
--- a/site_v2/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
-<!DOCTYPE html>
-
-<html>
-
- <head>
- <link rel="stylesheet" href="styles.css">
- <title>
- lucas.co/
- </title>
- </head>
-
- <body>
- <!-- <div class="title">Lucas Galante</div> -->
- <div class="whitebox">
- <div class="title">
- Lucas Galante
- </div>
- </div>
- <div class="boxx">
- <img src="horny.gif" class="myimg">
- </div>
- <div class="left"></div>
- <div class="right"></div>
- <div class="center"></div>
- <div class="circle1"></div>
- <div class="circle2"></div>
- </body>
-
-</html>
diff --git a/site_v2/indexx.html b/site_v2/indexx.html
deleted file mode 100644
index 019485f..0000000
--- a/site_v2/indexx.html
+++ /dev/null
@@ -1,45 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<style>
-body {
- background-color: #8fb6ff;
- margin: 0;
-}
-.gradient {
- animation: animateBg 180s infinite linear;
- background-color: #fff;
- background-image: linear-gradient(0deg, #fff, #000, #da3287, #fff);
- background-size: 100% 300%;
- height: 100vh;
- width: 100vw;
-}
-@keyframes animateBg {
- 0% {
- background-position: 0 150%;
- }
- 100% {
- background-position: 0 0;
- }
-}
-div.work {
- position:absolute;
- left: 3vw;
- top: 3vh;
-}
-</style>
-<title>Page Title</title>
-</head>
-<body>
-
-<canvas id="canvas1" width="400" height="100"
-style="border:1px solid #000000;">
-You are a loser.
-</canvas>
-
-<article class="gradient"></article>
-<div class="work"><p><a href="file:///C:/Users/lsgal/OneDrive/Documents/website/index.html">Work</a></p></div>
-
-</body>
-</html>
\ No newline at end of file
diff --git a/site_v2/media/chobits-chii.png b/site_v2/media/chobits-chii.png
deleted file mode 100644
index 7c7bc31..0000000
Binary files a/site_v2/media/chobits-chii.png and /dev/null differ
diff --git a/site_v2/media/magic.gif b/site_v2/media/magic.gif
deleted file mode 100644
index 86c6d73..0000000
Binary files a/site_v2/media/magic.gif and /dev/null differ
diff --git a/site_v2/media/rin_kokonoe.jpg b/site_v2/media/rin_kokonoe.jpg
deleted file mode 100644
index 530e5ab..0000000
Binary files a/site_v2/media/rin_kokonoe.jpg and /dev/null differ
diff --git a/site_v2/styles.css b/site_v2/styles.css
deleted file mode 100644
index 2c2f3b1..0000000
--- a/site_v2/styles.css
+++ /dev/null
@@ -1,82 +0,0 @@
-:root {
- --width1: 11%;
- --height1: 75%;
- --height2: 63%;
- --top1: 1%;
- --top2: 5%;
- --top3: 78%;
- --bottom1: 13%;
- --side1: 20%;
-}
-.title {
- font-size: 1.7vw;
- margin-top: .5vw;
- margin-left: .5vw;
-}
-.myimg {
- object-fit: contain;
- width: 100%;
- height: 100%;
-}
-.boxx {
- position: absolute;
- top: var(--top1);
- left: 36.0%;
- height:19%;
- width: 25%;
- padding: 1%;
- border: 1px solid black;
-}
-.whitebox {
- position: absolute;
- top: 0%;
- left: var(--side1);
- height: 3.3vw;
- width: var(--width1);
- background-color: white;
- z-index: 2;
-}
-.left {
- position: absolute;
- top: calc(var(--top1));
- left: var(--side1);
- height: calc(var(--height1));
- width: var(--width1);
- background-color: black;
- z-index: 1;
-}
-.right {
- position: absolute;
- top: var(--top1);
- right: var(--side1);
- height: var(--height1);
- width: var(--width1);
- background-color: black;
-}
-.center {
- position: absolute;
- top: 25.4%;
- left: calc(50% - 8% / 2);
- height: 45%;
- width: 8%;
- background-color: black;
-}
-.circle1 {
- position: absolute;
- top: var(--top3);
- left: var(--side1);
- width: var(--width1);
- padding-bottom: var(--width1);
- border-radius: 50%;
- border: 1px solid black;
-
-}
-.circle2 {
- position: absolute;
- top: var(--top3);
- right: var(--side1);
- width: var(--width1);
- padding-bottom: var(--width1);
- border-radius: 50%;
- border: 1px solid black;
-}
\ No newline at end of file
diff --git a/styles.css b/styles.css
index b2c66b0..bbd60b4 100644
--- a/styles.css
+++ b/styles.css
@@ -28,7 +28,7 @@ img {
}
div[id*="tab"] {
- border-width: 1.5px;
+ border-width: 1px;
border-style: solid;
border-color: black;
display: flex;
diff --git a/tests.txt b/tests.txt
deleted file mode 100644
index 7d8d787..0000000
--- a/tests.txt
+++ /dev/null
@@ -1,12 +0,0 @@
-x -- 0 1 2 3 4 5
-
-desired -- 0 1 2 2 3 3
-
-(3 - 1) % 4
-
-0 1 2 3 0 1 2 3
-
-0 1 2 3 3 2 1 0
-
-
-