source for lucas.co
improvements
.DS_Store | Bin 0 -> 6148 bytes
files.html | 23 +-
fonts/belda/Web Font EULA 2.0.txt | 180 +++++------
fonts/bellefair/SIL Open Font License.txt | 2 +-
fonts/mauren/Web Font EULA 2.0.txt | 180 +++++------
images/box_1.png | Bin 0 -> 722755 bytes
images/drawing.png | Bin 0 -> 10219826 bytes
index.html | 2 -
main.js | 497 +++++++++++++++++-------------
styles.css | 16 +-
10 files changed, 479 insertions(+), 421 deletions(-)
diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..fd9649f
Binary files /dev/null and b/.DS_Store differ
diff --git a/files.html b/files.html
index e7bff0e..8c947eb 100644
--- a/files.html
+++ b/files.html
@@ -1,13 +1,12 @@
-<!DOCTYPE html>
-<html>
-
-<head>
-<link rel="stylesheet" href="/styles.css">
-<!-- <script src="/main.js"></script> -->
-</head>
-<body>
-<!-- <a id="files" href="https://lucas.co/files.html">Files</a> -->
-<!-- <div id="mode"></div> -->
-</body>
-
+<!DOCTYPE html>
+<html>
+
+<head>
+<link rel="stylesheet" href="/styles.css">
+
+</head>
+<body>
+
+</body>
+
</html>
\ No newline at end of file
diff --git a/fonts/belda/Web Font EULA 2.0.txt b/fonts/belda/Web Font EULA 2.0.txt
index 8e4e443..bc415eb 100644
--- a/fonts/belda/Web Font EULA 2.0.txt
+++ b/fonts/belda/Web Font EULA 2.0.txt
@@ -1,90 +1,90 @@
-<strong>WEBFONTS | END USER LICENSE AGREEMENT | V2.0</strong>
-
-By downloading, installing and/or embedding font software (“Fonts”) offered for license by Creative Market Labs, Inc, Fontspring, and its distributors (“Licensor”), you (“Licensee”) agree to be bound by the following terms and conditions of this End User Licensing Agreement (“EULA”):
-
-<strong>1. RIGHTS GRANTED</strong>
-Licensor grants to Licensee a perpetual, worldwide, non-exclusive and non-transferable license to install the Fonts, and create, reproduce, modify, display, and distribute artwork created with the Fonts in accordance with the terms and conditions of this EULA.
-
-<strong>1.1 Storage & Backup</strong>
-<span style="color:#6F43EE;">⬇︎</span> <strong>Server Storage</strong>
-The Licensee is permitted to upload the Fonts to a server or a cloud-based storage service that is owned, leased, or otherwise controlled by Licensee, for the purpose of storage, asset management, and retrieval by Licensee only.
-
-<span style="color:#6F43EE;">⬇︎</span> <strong>Backup</strong>
-The Licensee is permitted to make a reasonable number of backup copies of the Font for disaster recovery purposes only.
-
-<strong>1.2 Limits</strong>
-<span style="color:orange">⚠️</span> <strong>@Font-Face Only</strong>
-The Licensee is only permitted to embed the Fonts in websites using the @font-face syntax in CSS stylesheets.
-
-<span style="color:orange">⚠️</span> <strong>Ownership</strong>
-The Licensee is only permitted to embed the Fonts in websites the Licensee owns or controls.
-
-<span style="color:orange">⚠️</span> <strong>Pageview Limit</strong>
-Websites that embed the Fonts must not have a monthly combined traffic that exceeds the pageviews per month limit indicated on the applicable order receipt (“Receipt”).
-
-<strong>1.3 Rights</strong>
-<span style="color:#669900">✔</span> <strong>Multiple Websites</strong>
-The Licensee is permitted to embed the Font into more than one distinct website.
-
-<span style="color:#669900">✔</span> <strong>PDF Report Embedding</strong>
-Licensee is permitted to embed the Font in Portable Document Format (PDF) reports that the App saves or exports, provided that the reports are not sold for profit.
-
-<strong>1.4 Restrictions</strong>
-<span style="color:red">✘</span> <strong>Webfont Files Only</strong>
-The Licensee must use the provided Fonts from Licensor. Fonts designed for Websites will be in the format of WOFF OR WOFF2. Licensee is prohibited from embedding Fonts in standard desktop formats of CFF OpenType (.otf) or TrueType (.ttf).
-
-<span style="color:red">✘</span> <strong>No Source Code Distribution</strong>
-Licensee is prohibited from redistributing the Fonts with any Website’s source code.
-
-<span style="color:red">✘</span> <strong>No Typesetting Products</strong>
-Licensee is prohibited from embedding the Font in any Website that enables an End User to create custom typesetting with the Font. For example: An image editor with text features.
-
-<span style="color:red">✘</span> <strong>No Other Systems/Product Embedding</strong>
-Licensed Users are prohibited from embedding or installing the Fonts in:
-- Computer operating systems, such as Mac, Windows or Linux
-- Digital ads using CSS @font-face
-- Desktop applications, mobile apps, and other software
-- Cloud-based apps allowing third-party, End User Font usage
-- Electronic devices
-- Digital games
-- Ebooks
-- Editable templates and editable PDFs
-
-<strong>1.5 Third Parties</strong>
-The Licensee is permitted to temporarily provide the Fonts to a third-party designer or agent (“Agent”) who is working on behalf of the Licensee. All Agents of the Licensee must: (a) agree in writing to Licensee that the Fonts will be used exclusively for Licensee’s work, in accordance with the terms of this EULA; (b) destroy all copies of the Fonts upon completion and delivery of the work to Licensee; and (c) use and/or embed the Fonts only in work owned or controlled by Licensee.
-
-<strong>2. FONT MODIFICATIONS</strong>
-Licensed Users are prohibited from modifying the Fonts, or creating derivative Fonts without prior written consent from Licensor or the Font’s copyright holder except where derivative Fonts are necessary for embedding or linking in accordance with this EULA.
-
-<strong>3. COPYRIGHT</strong>
-The Fonts are protected by United States and international copyright and other laws and treaties. The copyright holder is the sole, exclusive owner of all intellectual property rights, including rights under copyright and trademark law. Licensee agrees not to use the Fonts in any manner that infringes the intellectual property rights of the copyright holder or violates the terms of this EULA. Licensee will be held legally responsible, and indemnifies Licensor, for any infringements on the copyright holder’s rights caused by failure to abide by the terms of this EULA.
-
-<strong>4. TERMINATION</strong>
-This EULA is effective until terminated. If Licensee fails to comply with any term of this EULA, Licensor may terminate the EULA with 30 days notice.
-
-<strong>5. REFUNDS AND DISCLAIMER</strong>
-At Licensee’s request, Licensor may, at its discretion, provide a refund for the Fonts if the following conditions have been met:
-- The Fonts have never been used in any published or released artwork by Licensee.
-- No more than 30 days have passed since the date of purchase, specified on the Receipt.
-- The Fonts have been completely removed or destroyed from all Licensee’s installations, servers, and backups.
-
-<strong>6. WARRANTY</strong>
-The Fonts are provided “as is.” Licensor makes no warranty of any kind, either expressed or implied, including, but not limited to the implied warranties of merchantability and fitness for a particular purpose.
-
-Licensor shall not be liable for any direct, indirect, consequential, or incidental damages (including damages from loss of business profits, business interruption, loss of business information, and the like) arising out of the use of or inability to use the product even if Licensor has been advised of the possibility of such damages.
-
-Because some U.S. states do not allow the exclusion or limitation of liability for consequential or incidental damages, the above limitation may not apply to Licensee.
-
-<strong>7. GOVERNING LAW</strong>
-This EULA is governed by the laws of the United States of America and the State of California.
-
-<strong>8. ENTIRE AGREEMENT</strong>
-This EULA, in conjunction with the Receipt that accompanies each Font licensed from Licensor, constitutes the entire agreement between Licensor and Licensee.
-
-<strong>9. AGREEMENT MODIFICATION</strong>
-The Licensor and Licensee may modify or amend this EULA when agreed to in writing.
-
-<strong>10. WAIVER</strong>
-The waiver of one breach or default hereunder shall not constitute the waiver of any subsequent breach or default.
-
-<i>©2022 Creative Market Labs, Inc.</i>
+<strong>WEBFONTS | END USER LICENSE AGREEMENT | V2.0</strong>
+
+By downloading, installing and/or embedding font software (“Fonts”) offered for license by Creative Market Labs, Inc, Fontspring, and its distributors (“Licensor”), you (“Licensee”) agree to be bound by the following terms and conditions of this End User Licensing Agreement (“EULA”):
+
+<strong>1. RIGHTS GRANTED</strong>
+Licensor grants to Licensee a perpetual, worldwide, non-exclusive and non-transferable license to install the Fonts, and create, reproduce, modify, display, and distribute artwork created with the Fonts in accordance with the terms and conditions of this EULA.
+
+<strong>1.1 Storage & Backup</strong>
+<span style="color:#6F43EE;">⬇︎</span> <strong>Server Storage</strong>
+The Licensee is permitted to upload the Fonts to a server or a cloud-based storage service that is owned, leased, or otherwise controlled by Licensee, for the purpose of storage, asset management, and retrieval by Licensee only.
+
+<span style="color:#6F43EE;">⬇︎</span> <strong>Backup</strong>
+The Licensee is permitted to make a reasonable number of backup copies of the Font for disaster recovery purposes only.
+
+<strong>1.2 Limits</strong>
+<span style="color:orange">⚠️</span> <strong>@Font-Face Only</strong>
+The Licensee is only permitted to embed the Fonts in websites using the @font-face syntax in CSS stylesheets.
+
+<span style="color:orange">⚠️</span> <strong>Ownership</strong>
+The Licensee is only permitted to embed the Fonts in websites the Licensee owns or controls.
+
+<span style="color:orange">⚠️</span> <strong>Pageview Limit</strong>
+Websites that embed the Fonts must not have a monthly combined traffic that exceeds the pageviews per month limit indicated on the applicable order receipt (“Receipt”).
+
+<strong>1.3 Rights</strong>
+<span style="color:#669900">✔</span> <strong>Multiple Websites</strong>
+The Licensee is permitted to embed the Font into more than one distinct website.
+
+<span style="color:#669900">✔</span> <strong>PDF Report Embedding</strong>
+Licensee is permitted to embed the Font in Portable Document Format (PDF) reports that the App saves or exports, provided that the reports are not sold for profit.
+
+<strong>1.4 Restrictions</strong>
+<span style="color:red">✘</span> <strong>Webfont Files Only</strong>
+The Licensee must use the provided Fonts from Licensor. Fonts designed for Websites will be in the format of WOFF OR WOFF2. Licensee is prohibited from embedding Fonts in standard desktop formats of CFF OpenType (.otf) or TrueType (.ttf).
+
+<span style="color:red">✘</span> <strong>No Source Code Distribution</strong>
+Licensee is prohibited from redistributing the Fonts with any Website’s source code.
+
+<span style="color:red">✘</span> <strong>No Typesetting Products</strong>
+Licensee is prohibited from embedding the Font in any Website that enables an End User to create custom typesetting with the Font. For example: An image editor with text features.
+
+<span style="color:red">✘</span> <strong>No Other Systems/Product Embedding</strong>
+Licensed Users are prohibited from embedding or installing the Fonts in:
+- Computer operating systems, such as Mac, Windows or Linux
+- Digital ads using CSS @font-face
+- Desktop applications, mobile apps, and other software
+- Cloud-based apps allowing third-party, End User Font usage
+- Electronic devices
+- Digital games
+- Ebooks
+- Editable templates and editable PDFs
+
+<strong>1.5 Third Parties</strong>
+The Licensee is permitted to temporarily provide the Fonts to a third-party designer or agent (“Agent”) who is working on behalf of the Licensee. All Agents of the Licensee must: (a) agree in writing to Licensee that the Fonts will be used exclusively for Licensee’s work, in accordance with the terms of this EULA; (b) destroy all copies of the Fonts upon completion and delivery of the work to Licensee; and (c) use and/or embed the Fonts only in work owned or controlled by Licensee.
+
+<strong>2. FONT MODIFICATIONS</strong>
+Licensed Users are prohibited from modifying the Fonts, or creating derivative Fonts without prior written consent from Licensor or the Font’s copyright holder except where derivative Fonts are necessary for embedding or linking in accordance with this EULA.
+
+<strong>3. COPYRIGHT</strong>
+The Fonts are protected by United States and international copyright and other laws and treaties. The copyright holder is the sole, exclusive owner of all intellectual property rights, including rights under copyright and trademark law. Licensee agrees not to use the Fonts in any manner that infringes the intellectual property rights of the copyright holder or violates the terms of this EULA. Licensee will be held legally responsible, and indemnifies Licensor, for any infringements on the copyright holder’s rights caused by failure to abide by the terms of this EULA.
+
+<strong>4. TERMINATION</strong>
+This EULA is effective until terminated. If Licensee fails to comply with any term of this EULA, Licensor may terminate the EULA with 30 days notice.
+
+<strong>5. REFUNDS AND DISCLAIMER</strong>
+At Licensee’s request, Licensor may, at its discretion, provide a refund for the Fonts if the following conditions have been met:
+- The Fonts have never been used in any published or released artwork by Licensee.
+- No more than 30 days have passed since the date of purchase, specified on the Receipt.
+- The Fonts have been completely removed or destroyed from all Licensee’s installations, servers, and backups.
+
+<strong>6. WARRANTY</strong>
+The Fonts are provided “as is.” Licensor makes no warranty of any kind, either expressed or implied, including, but not limited to the implied warranties of merchantability and fitness for a particular purpose.
+
+Licensor shall not be liable for any direct, indirect, consequential, or incidental damages (including damages from loss of business profits, business interruption, loss of business information, and the like) arising out of the use of or inability to use the product even if Licensor has been advised of the possibility of such damages.
+
+Because some U.S. states do not allow the exclusion or limitation of liability for consequential or incidental damages, the above limitation may not apply to Licensee.
+
+<strong>7. GOVERNING LAW</strong>
+This EULA is governed by the laws of the United States of America and the State of California.
+
+<strong>8. ENTIRE AGREEMENT</strong>
+This EULA, in conjunction with the Receipt that accompanies each Font licensed from Licensor, constitutes the entire agreement between Licensor and Licensee.
+
+<strong>9. AGREEMENT MODIFICATION</strong>
+The Licensor and Licensee may modify or amend this EULA when agreed to in writing.
+
+<strong>10. WAIVER</strong>
+The waiver of one breach or default hereunder shall not constitute the waiver of any subsequent breach or default.
+
+<i>©2022 Creative Market Labs, Inc.</i>
diff --git a/fonts/bellefair/SIL Open Font License.txt b/fonts/bellefair/SIL Open Font License.txt
index 566628d..ea850a4 100644
--- a/fonts/bellefair/SIL Open Font License.txt
+++ b/fonts/bellefair/SIL Open Font License.txt
@@ -1,4 +1,4 @@
-Copyright 2015 The Bellefair Project Authors (https://github.com/shinntype/bellefair)
+Copyright 2015 The Bellefair Project Authors (https://github.com/shinntype/bellefair)
This Font Software is licensed under the SIL Open Font License, Version 1.1.
diff --git a/fonts/mauren/Web Font EULA 2.0.txt b/fonts/mauren/Web Font EULA 2.0.txt
index 8e4e443..bc415eb 100644
--- a/fonts/mauren/Web Font EULA 2.0.txt
+++ b/fonts/mauren/Web Font EULA 2.0.txt
@@ -1,90 +1,90 @@
-<strong>WEBFONTS | END USER LICENSE AGREEMENT | V2.0</strong>
-
-By downloading, installing and/or embedding font software (“Fonts”) offered for license by Creative Market Labs, Inc, Fontspring, and its distributors (“Licensor”), you (“Licensee”) agree to be bound by the following terms and conditions of this End User Licensing Agreement (“EULA”):
-
-<strong>1. RIGHTS GRANTED</strong>
-Licensor grants to Licensee a perpetual, worldwide, non-exclusive and non-transferable license to install the Fonts, and create, reproduce, modify, display, and distribute artwork created with the Fonts in accordance with the terms and conditions of this EULA.
-
-<strong>1.1 Storage & Backup</strong>
-<span style="color:#6F43EE;">⬇︎</span> <strong>Server Storage</strong>
-The Licensee is permitted to upload the Fonts to a server or a cloud-based storage service that is owned, leased, or otherwise controlled by Licensee, for the purpose of storage, asset management, and retrieval by Licensee only.
-
-<span style="color:#6F43EE;">⬇︎</span> <strong>Backup</strong>
-The Licensee is permitted to make a reasonable number of backup copies of the Font for disaster recovery purposes only.
-
-<strong>1.2 Limits</strong>
-<span style="color:orange">⚠️</span> <strong>@Font-Face Only</strong>
-The Licensee is only permitted to embed the Fonts in websites using the @font-face syntax in CSS stylesheets.
-
-<span style="color:orange">⚠️</span> <strong>Ownership</strong>
-The Licensee is only permitted to embed the Fonts in websites the Licensee owns or controls.
-
-<span style="color:orange">⚠️</span> <strong>Pageview Limit</strong>
-Websites that embed the Fonts must not have a monthly combined traffic that exceeds the pageviews per month limit indicated on the applicable order receipt (“Receipt”).
-
-<strong>1.3 Rights</strong>
-<span style="color:#669900">✔</span> <strong>Multiple Websites</strong>
-The Licensee is permitted to embed the Font into more than one distinct website.
-
-<span style="color:#669900">✔</span> <strong>PDF Report Embedding</strong>
-Licensee is permitted to embed the Font in Portable Document Format (PDF) reports that the App saves or exports, provided that the reports are not sold for profit.
-
-<strong>1.4 Restrictions</strong>
-<span style="color:red">✘</span> <strong>Webfont Files Only</strong>
-The Licensee must use the provided Fonts from Licensor. Fonts designed for Websites will be in the format of WOFF OR WOFF2. Licensee is prohibited from embedding Fonts in standard desktop formats of CFF OpenType (.otf) or TrueType (.ttf).
-
-<span style="color:red">✘</span> <strong>No Source Code Distribution</strong>
-Licensee is prohibited from redistributing the Fonts with any Website’s source code.
-
-<span style="color:red">✘</span> <strong>No Typesetting Products</strong>
-Licensee is prohibited from embedding the Font in any Website that enables an End User to create custom typesetting with the Font. For example: An image editor with text features.
-
-<span style="color:red">✘</span> <strong>No Other Systems/Product Embedding</strong>
-Licensed Users are prohibited from embedding or installing the Fonts in:
-- Computer operating systems, such as Mac, Windows or Linux
-- Digital ads using CSS @font-face
-- Desktop applications, mobile apps, and other software
-- Cloud-based apps allowing third-party, End User Font usage
-- Electronic devices
-- Digital games
-- Ebooks
-- Editable templates and editable PDFs
-
-<strong>1.5 Third Parties</strong>
-The Licensee is permitted to temporarily provide the Fonts to a third-party designer or agent (“Agent”) who is working on behalf of the Licensee. All Agents of the Licensee must: (a) agree in writing to Licensee that the Fonts will be used exclusively for Licensee’s work, in accordance with the terms of this EULA; (b) destroy all copies of the Fonts upon completion and delivery of the work to Licensee; and (c) use and/or embed the Fonts only in work owned or controlled by Licensee.
-
-<strong>2. FONT MODIFICATIONS</strong>
-Licensed Users are prohibited from modifying the Fonts, or creating derivative Fonts without prior written consent from Licensor or the Font’s copyright holder except where derivative Fonts are necessary for embedding or linking in accordance with this EULA.
-
-<strong>3. COPYRIGHT</strong>
-The Fonts are protected by United States and international copyright and other laws and treaties. The copyright holder is the sole, exclusive owner of all intellectual property rights, including rights under copyright and trademark law. Licensee agrees not to use the Fonts in any manner that infringes the intellectual property rights of the copyright holder or violates the terms of this EULA. Licensee will be held legally responsible, and indemnifies Licensor, for any infringements on the copyright holder’s rights caused by failure to abide by the terms of this EULA.
-
-<strong>4. TERMINATION</strong>
-This EULA is effective until terminated. If Licensee fails to comply with any term of this EULA, Licensor may terminate the EULA with 30 days notice.
-
-<strong>5. REFUNDS AND DISCLAIMER</strong>
-At Licensee’s request, Licensor may, at its discretion, provide a refund for the Fonts if the following conditions have been met:
-- The Fonts have never been used in any published or released artwork by Licensee.
-- No more than 30 days have passed since the date of purchase, specified on the Receipt.
-- The Fonts have been completely removed or destroyed from all Licensee’s installations, servers, and backups.
-
-<strong>6. WARRANTY</strong>
-The Fonts are provided “as is.” Licensor makes no warranty of any kind, either expressed or implied, including, but not limited to the implied warranties of merchantability and fitness for a particular purpose.
-
-Licensor shall not be liable for any direct, indirect, consequential, or incidental damages (including damages from loss of business profits, business interruption, loss of business information, and the like) arising out of the use of or inability to use the product even if Licensor has been advised of the possibility of such damages.
-
-Because some U.S. states do not allow the exclusion or limitation of liability for consequential or incidental damages, the above limitation may not apply to Licensee.
-
-<strong>7. GOVERNING LAW</strong>
-This EULA is governed by the laws of the United States of America and the State of California.
-
-<strong>8. ENTIRE AGREEMENT</strong>
-This EULA, in conjunction with the Receipt that accompanies each Font licensed from Licensor, constitutes the entire agreement between Licensor and Licensee.
-
-<strong>9. AGREEMENT MODIFICATION</strong>
-The Licensor and Licensee may modify or amend this EULA when agreed to in writing.
-
-<strong>10. WAIVER</strong>
-The waiver of one breach or default hereunder shall not constitute the waiver of any subsequent breach or default.
-
-<i>©2022 Creative Market Labs, Inc.</i>
+<strong>WEBFONTS | END USER LICENSE AGREEMENT | V2.0</strong>
+
+By downloading, installing and/or embedding font software (“Fonts”) offered for license by Creative Market Labs, Inc, Fontspring, and its distributors (“Licensor”), you (“Licensee”) agree to be bound by the following terms and conditions of this End User Licensing Agreement (“EULA”):
+
+<strong>1. RIGHTS GRANTED</strong>
+Licensor grants to Licensee a perpetual, worldwide, non-exclusive and non-transferable license to install the Fonts, and create, reproduce, modify, display, and distribute artwork created with the Fonts in accordance with the terms and conditions of this EULA.
+
+<strong>1.1 Storage & Backup</strong>
+<span style="color:#6F43EE;">⬇︎</span> <strong>Server Storage</strong>
+The Licensee is permitted to upload the Fonts to a server or a cloud-based storage service that is owned, leased, or otherwise controlled by Licensee, for the purpose of storage, asset management, and retrieval by Licensee only.
+
+<span style="color:#6F43EE;">⬇︎</span> <strong>Backup</strong>
+The Licensee is permitted to make a reasonable number of backup copies of the Font for disaster recovery purposes only.
+
+<strong>1.2 Limits</strong>
+<span style="color:orange">⚠️</span> <strong>@Font-Face Only</strong>
+The Licensee is only permitted to embed the Fonts in websites using the @font-face syntax in CSS stylesheets.
+
+<span style="color:orange">⚠️</span> <strong>Ownership</strong>
+The Licensee is only permitted to embed the Fonts in websites the Licensee owns or controls.
+
+<span style="color:orange">⚠️</span> <strong>Pageview Limit</strong>
+Websites that embed the Fonts must not have a monthly combined traffic that exceeds the pageviews per month limit indicated on the applicable order receipt (“Receipt”).
+
+<strong>1.3 Rights</strong>
+<span style="color:#669900">✔</span> <strong>Multiple Websites</strong>
+The Licensee is permitted to embed the Font into more than one distinct website.
+
+<span style="color:#669900">✔</span> <strong>PDF Report Embedding</strong>
+Licensee is permitted to embed the Font in Portable Document Format (PDF) reports that the App saves or exports, provided that the reports are not sold for profit.
+
+<strong>1.4 Restrictions</strong>
+<span style="color:red">✘</span> <strong>Webfont Files Only</strong>
+The Licensee must use the provided Fonts from Licensor. Fonts designed for Websites will be in the format of WOFF OR WOFF2. Licensee is prohibited from embedding Fonts in standard desktop formats of CFF OpenType (.otf) or TrueType (.ttf).
+
+<span style="color:red">✘</span> <strong>No Source Code Distribution</strong>
+Licensee is prohibited from redistributing the Fonts with any Website’s source code.
+
+<span style="color:red">✘</span> <strong>No Typesetting Products</strong>
+Licensee is prohibited from embedding the Font in any Website that enables an End User to create custom typesetting with the Font. For example: An image editor with text features.
+
+<span style="color:red">✘</span> <strong>No Other Systems/Product Embedding</strong>
+Licensed Users are prohibited from embedding or installing the Fonts in:
+- Computer operating systems, such as Mac, Windows or Linux
+- Digital ads using CSS @font-face
+- Desktop applications, mobile apps, and other software
+- Cloud-based apps allowing third-party, End User Font usage
+- Electronic devices
+- Digital games
+- Ebooks
+- Editable templates and editable PDFs
+
+<strong>1.5 Third Parties</strong>
+The Licensee is permitted to temporarily provide the Fonts to a third-party designer or agent (“Agent”) who is working on behalf of the Licensee. All Agents of the Licensee must: (a) agree in writing to Licensee that the Fonts will be used exclusively for Licensee’s work, in accordance with the terms of this EULA; (b) destroy all copies of the Fonts upon completion and delivery of the work to Licensee; and (c) use and/or embed the Fonts only in work owned or controlled by Licensee.
+
+<strong>2. FONT MODIFICATIONS</strong>
+Licensed Users are prohibited from modifying the Fonts, or creating derivative Fonts without prior written consent from Licensor or the Font’s copyright holder except where derivative Fonts are necessary for embedding or linking in accordance with this EULA.
+
+<strong>3. COPYRIGHT</strong>
+The Fonts are protected by United States and international copyright and other laws and treaties. The copyright holder is the sole, exclusive owner of all intellectual property rights, including rights under copyright and trademark law. Licensee agrees not to use the Fonts in any manner that infringes the intellectual property rights of the copyright holder or violates the terms of this EULA. Licensee will be held legally responsible, and indemnifies Licensor, for any infringements on the copyright holder’s rights caused by failure to abide by the terms of this EULA.
+
+<strong>4. TERMINATION</strong>
+This EULA is effective until terminated. If Licensee fails to comply with any term of this EULA, Licensor may terminate the EULA with 30 days notice.
+
+<strong>5. REFUNDS AND DISCLAIMER</strong>
+At Licensee’s request, Licensor may, at its discretion, provide a refund for the Fonts if the following conditions have been met:
+- The Fonts have never been used in any published or released artwork by Licensee.
+- No more than 30 days have passed since the date of purchase, specified on the Receipt.
+- The Fonts have been completely removed or destroyed from all Licensee’s installations, servers, and backups.
+
+<strong>6. WARRANTY</strong>
+The Fonts are provided “as is.” Licensor makes no warranty of any kind, either expressed or implied, including, but not limited to the implied warranties of merchantability and fitness for a particular purpose.
+
+Licensor shall not be liable for any direct, indirect, consequential, or incidental damages (including damages from loss of business profits, business interruption, loss of business information, and the like) arising out of the use of or inability to use the product even if Licensor has been advised of the possibility of such damages.
+
+Because some U.S. states do not allow the exclusion or limitation of liability for consequential or incidental damages, the above limitation may not apply to Licensee.
+
+<strong>7. GOVERNING LAW</strong>
+This EULA is governed by the laws of the United States of America and the State of California.
+
+<strong>8. ENTIRE AGREEMENT</strong>
+This EULA, in conjunction with the Receipt that accompanies each Font licensed from Licensor, constitutes the entire agreement between Licensor and Licensee.
+
+<strong>9. AGREEMENT MODIFICATION</strong>
+The Licensor and Licensee may modify or amend this EULA when agreed to in writing.
+
+<strong>10. WAIVER</strong>
+The waiver of one breach or default hereunder shall not constitute the waiver of any subsequent breach or default.
+
+<i>©2022 Creative Market Labs, Inc.</i>
diff --git a/images/box_1.png b/images/box_1.png
new file mode 100644
index 0000000..cd000f2
Binary files /dev/null and b/images/box_1.png differ
diff --git a/images/drawing.png b/images/drawing.png
new file mode 100644
index 0000000..e6fef3e
Binary files /dev/null and b/images/drawing.png differ
diff --git a/index.html b/index.html
index 8315de6..69cd7e0 100644
--- a/index.html
+++ b/index.html
@@ -12,9 +12,7 @@
</div>
</div>
-<!-- <a id="files" href="https://lucas.co/files.html">Files</a> -->
<a id="files" href="files.html">Files</a>
-<div id="mode"></div>
</body>
</html>
\ No newline at end of file
diff --git a/main.js b/main.js
index 6ec9412..dece9ec 100644
--- a/main.js
+++ b/main.js
@@ -1,220 +1,279 @@
-let tab_data = {
- tab_0:
- {
- title: "Morphogen",
- body: "Computer program for design through evolution and growth based exploration.\n\nImages coming soon."
- },
-
- tab_1:
- {
- title: "Moldtek",
- body: "Computer based mold designing tools for objects with very complex geometry."
- },
-
- tab_2:
- {
- title: "Drawing",
- body: "Some examples of pencil drawings.\n\nImages coming soon."
- },
-
- tab_3:
- {
- title: "Spoon",
- body: "A wax carving intended for ceramic slip casting.\n\nImages coming soon."
- },
-
- tab_4:
- {
- title: "Info",
- body: "Lucas Galante\n\nadmin@lucas.co/\n\ngithub.com/lsgalante"
- }
-}
-
-window.addEventListener("resize", function() {
- sizing() });
-
-let n_tabs = Object.keys(tab_data).length;
-let active_tab = 0;
-
-const bg_on = "#3f3131";
-const txt_on = "#ffffff";
-
-const bg_off = "#ffffff";
-const txt_off = "#000000";
-
-let tabs = [];
-let counts = [0, 0, 0, 0];
-
-function loadPage() {
- create_tabs();
- sizing();
- set_tab(0);
-}
-
-function create_tabs() {
-
- for(let i = 0; i < n_tabs; i++) {
- let tab = document.createElement("div");
-
- let pos = i;
-
- if(pos >= 4) {
- pos = (3 - (i % 4)) % 4;
- }
-
- tab.pos = pos;
- tab.idx = counts[pos];
- counts[pos] += 1;
-
- tab.id = "tab_" + String(i);
-
- tab.addEventListener("click", function() {
- set_tab(i) });
-
- tab.addEventListener("mouseenter", function() {
- enter_tab(tab.id) });
-
- tab.addEventListener("mouseleave", function() {
- leave_tab(tab.id) });
-
- tabs.push(tab);
- body.append(tab);
- }
-
- for(let i = 0; i < n_tabs; i++) {
- let tab = tabs[i];
-
- let pos = tab.pos;
-
- let title = tab_data[tab.id].title;
-
- if(pos == 1 || pos == 3) {
- let new_title = "";
-
- for(const letter of title) {
- new_title += letter + "\n";
- }
- title = new_title;
- }
-
- tab.innerText = title;
- }
-}
-
-function set_tab(idx) {
- for(let i = 0; i < n_tabs; i++) {
- let tab_id = "tab_" + String(i);
-
- if(i == idx) {
- let tab = document.getElementById(tab_id);
- tab.style.backgroundColor = bg_on;
- tab.style.color = txt_on;
- }
-
- else {
- let tab = document.getElementById(tab_id);
- tab.style.backgroundColor = bg_off;
- tab.style.color = txt_off;
- }
- }
-
- active_tab = idx;
- let tab_id = "tab_" + idx;
- const description = document.getElementById("description");
-
- (description.innerText = tab_data[tab_id]["body"])
-}
-
-function enter_tab(tab_id) {
- let tab = document.getElementById(tab_id);
- tab.style.backgroundColor = bg_on;
- tab.style.color = txt_on;
-}
-
-function leave_tab(tab_id) {
- if(tab_id != "tab_" + active_tab) {
- let tab = document.getElementById(tab_id);
- tab.style.backgroundColor = bg_off;
- tab.style.color = txt_off;
- }
-}
-
-function sizing() {
- let window_w = window.innerWidth;
- let window_h = window.innerHeight;
-
- 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 tab_w;
- let tab_h;
-
- let dim_1 = 25;
-
- const border_radius = 45;
-
- 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.left = box_left + "px";
- tab.style.top = (box_top - tab_h) + "px";
-
- tab.style.borderTopLeftRadius = border_radius + "px";
- tab.style.borderTopRightRadius = border_radius + "px";
- }
-
- if(pos == 1) {
- tab_w = dim_1;
- tab_h = box_h / count;
-
- 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.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";
- }
-
- 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.width = tab_w + "px";
- tab.style.height = tab_h + "px";
- }
+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\nadmin@lucas.co/\n\ngithub.com/lsgalante",
+ images: []
+ }
+}
+
+window.addEventListener("resize", function() {
+ sizing() });
+
+let n_tabs = Object.keys(tab_data).length;
+let active_tab = 0;
+
+const bg_on = "#3f3131";
+const txt_on = "#ffffff";
+
+const bg_off = "#ffffff";
+const txt_off = "#000000";
+
+let tabs = [];
+let counts = [0, 0, 0, 0];
+
+function loadPage() {
+ create_tabs();
+ set_tab(0);
+}
+
+function create_tabs() {
+
+ for(let i = 0; i < n_tabs; i++) {
+ let tab = document.createElement("div");
+
+ let pos = i;
+
+ if(pos >= 4) {
+ pos = (3 - (i % 4)) % 4;
+ }
+
+ tab.pos = pos;
+ tab.idx = counts[pos];
+ counts[pos] += 1;
+
+ tab.id = "tab_" + String(i);
+
+ tab.addEventListener("click", function() {
+ set_tab(i) });
+
+ tab.addEventListener("mouseenter", function() {
+ enter_tab(tab.id) });
+
+ tab.addEventListener("mouseleave", function() {
+ leave_tab(tab.id) });
+
+ tabs.push(tab);
+ body.append(tab);
+ }
+
+ for(let i = 0; i < n_tabs; i++) {
+ let tab = tabs[i];
+
+ let pos = tab.pos;
+
+ let title = tab_data[tab.id].title;
+
+ if(pos == 1 || pos == 3) {
+ let new_title = "";
+
+ for(const letter of title) {
+ new_title += letter + "\n";
+ }
+ title = new_title;
+ }
+
+ tab.innerText = title;
+ }
+}
+
+function set_tab(idx) {
+ for(let i = 0; i < n_tabs; i++) {
+ let tab_id = "tab_" + String(i);
+
+ if(i == idx) {
+ let tab = document.getElementById(tab_id);
+ tab.style.backgroundColor = bg_on;
+ tab.style.color = txt_on;
+ active_tab = i;
+ images(i);
+ }
+
+ else {
+ let tab = document.getElementById(tab_id);
+ tab.style.backgroundColor = bg_off;
+ tab.style.color = txt_off;
+ }
+ }
+
+ active_tab = idx;
+ let tab_id = "tab_" + idx;
+ const description = document.getElementById("description");
+
+ (description.innerText = tab_data[tab_id]["body"])
+
+ sizing();
+}
+
+function enter_tab(tab_id) {
+ let tab = document.getElementById(tab_id);
+ tab.style.backgroundColor = bg_on;
+ tab.style.color = txt_on;
+}
+
+function leave_tab(tab_id) {
+ if(tab_id != "tab_" + active_tab) {
+ let tab = document.getElementById(tab_id);
+ tab.style.backgroundColor = bg_off;
+ tab.style.color = txt_off;
+ }
+}
+
+function images(i) {
+ let images = document.getElementsByTagName("img");
+
+ for(let img of images) {
+ img.remove();
+ }
+
+ let box = document.getElementById("box");
+ let urls = tab_data["tab_" + i].images;
+ let n = 0;
+ for(let url of urls) {
+ let image = document.createElement("img");
+ image.src=url;
+ image.id = "image_" + n;
+ box.append(image);
+ n += 1;
+ }
+}
+
+function sizing() {
+ let window_w = window.innerWidth;
+ let window_h = window.innerHeight;
+
+ let font_size = window_h * 0.014;
+
+ // 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";
+
+ 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;
+
+ for(img of images) {
+ img.style.width = img_w + "px";
+ img.style.height = img_h + "px";
+
+ img.style.left = 20 + "px";
+ img.style.top = (img_h - 20) + "px";
+ }
+
+ // tab
+ let tab_w;
+ let tab_h;
+
+ let dim_1 = window_h * 0.03;
+
+ const border_radius = 45;
+
+ 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.style.fontSize = font_size + "px";
+
+ if(pos == 0) {
+ tab_w = box_w / count;
+ tab_h = dim_1;
+
+ tab.style.left = box_left + "px";
+ tab.style.top = (box_top - tab_h) + "px";
+
+ tab.style.borderTopLeftRadius = border_radius + "px";
+ tab.style.borderTopRightRadius = border_radius + "px";
+ }
+
+ if(pos == 1) {
+ tab_w = dim_1;
+ tab_h = box_h / count;
+
+ 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.borderTopRightRadius = border_radius + "px";
+ tab.style.borderBottomRightRadius = border_radius + "px";
+
+ tab.style.lineHeight = font_size + "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";
+ }
+
+ 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.lineHeight = font_size + "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";
}
\ No newline at end of file
diff --git a/styles.css b/styles.css
index 72b68fa..b2c66b0 100644
--- a/styles.css
+++ b/styles.css
@@ -10,6 +10,11 @@ a {
text-decoration-line: none;
}
+img {
+ position: relative;
+
+}
+
#box {
position: fixed;
align-items: center;
@@ -19,24 +24,21 @@ a {
#description {
color: rgb(255, 233, 201);
position: relative;
- font-size: 14px;
- margin: 25px;
+ margin: 28px;
}
div[id*="tab"] {
- border-width: 1px;
+ border-width: 1.5px;
border-style: solid;
border-color: black;
display: flex;
align-items: center;
justify-content: center;
- font-size: 14px;
- line-height: 11px;
position: fixed;
}
#files {
- color: rgb(137, 135, 158);
+ color: rgb(190, 143, 124);
position: fixed;
right: 15px;
top: 15px;
@@ -46,5 +48,5 @@ div[id*="tab"] {
}
#files:hover {
- color: rgb(115, 87, 168);
+ color: rgb(15, 4, 36);
}
\ No newline at end of file