User:Ada/prototyping: Difference between revisions
< User:Ada
(2 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
== | == SVG, CSS and HTML continued == | ||
Making cards, how to have a different web and print page<syntaxhighlight lang="css" line="1"> | |||
@media screen{ | |||
body{ | |||
background-color:beige; | |||
} | |||
section{ | |||
display: flex; | |||
flex-flow: wrap row; | |||
} | |||
div.card{ | |||
flex: 1 200px; | |||
background-color: beige; | |||
border: 3px solid white; | |||
margin: 10px; | |||
padding: 10px; | |||
} | |||
div.card:nth-of-type(3n) { | |||
flex: 2 300px; | |||
background-color: darkseagreen; | |||
} | |||
div.card:hover{ | |||
background-color: cornflowerblue; | |||
} | |||
} | |||
@media print{ | |||
@page{ | |||
size: A5 landscape; | |||
margin: 10mm 25mm; | |||
} | |||
h1{ | |||
display: none; | |||
} | |||
div.card{ | |||
color:blueviolet; | |||
page-break-after: always; | |||
} | |||
} | |||
</syntaxhighlight> | |||
== Jupyter & hypertext HTML&CSS editing == | |||
# [https://hub.xpub.nl/breadcube/hyperworld/ hyperworld hypertext edit] | # [https://hub.xpub.nl/breadcube/hyperworld/ hyperworld hypertext edit] | ||
Line 16: | Line 57: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
== | == Internet & markup == | ||
Hub: [[HUB|https://pzwiki.wdka.nl/mediadesign/HUB]] | Hub: [[HUB|https://pzwiki.wdka.nl/mediadesign/HUB]] | ||
Line 31: | Line 72: | ||
Shell Cheat Sheet | Shell Cheat Sheet | ||
== | == Breadcube setup == | ||
keywords: sandbox, raspberry pi, server, unix-like software, post-PRISM age (surveillance program) | keywords: sandbox, raspberry pi, server, unix-like software, post-PRISM age (surveillance program) | ||
Latest revision as of 13:55, 11 October 2022
SVG, CSS and HTML continued
Making cards, how to have a different web and print page
@media screen{
body{
background-color:beige;
}
section{
display: flex;
flex-flow: wrap row;
}
div.card{
flex: 1 200px;
background-color: beige;
border: 3px solid white;
margin: 10px;
padding: 10px;
}
div.card:nth-of-type(3n) {
flex: 2 300px;
background-color: darkseagreen;
}
div.card:hover{
background-color: cornflowerblue;
}
}
@media print{
@page{
size: A5 landscape;
margin: 10mm 25mm;
}
h1{
display: none;
}
div.card{
color:blueviolet;
page-break-after: always;
}
}
Jupyter & hypertext HTML&CSS editing
HTML details about header, title and language processing
<!DOCTYPE html> tells me it's html
<html>
<head>
<title> needs to be in head not body
<style>
h1{
color: red;
}
</style> css is in the head for everything or can be used for specific parts
<h1 class="" style="color:blue;">text</h1> this way it's both the whole text and h1
Internet & markup
Hub: https://pzwiki.wdka.nl/mediadesign/HUB
Hidden network main notes: xvm(xpub virtual machine) is the only publicly reachable server on the network (so if u need to see a page like from the bootleg library, you ask for the bl server to serve the main page of the software used). Basically the request goes from a laptop to
laptop—> xvm —> bootleg —> xvm—→ laptop
- XVM is the only one that has a domain name (xpub.nl, the rest is unreachable without xvm)
Tinc
- Software that makes these hidden networks
- Installing to add breadcube to the HUB
Shell Cheat Sheet
Breadcube setup
keywords: sandbox, raspberry pi, server, unix-like software, post-PRISM age (surveillance program)
Sandbox
- Spaces for testing and prototyping software and describe how users and processes can be isolated for security purpuses.
- Debian = OP most often used for servers, or computer without a graphic interaction (only terminal). UTF8 = character encoding
Server commands BREADCUBE
ssh ada @145.24.139.110
wall message
pwd (home)
ls (listing command)
apt intall nginx(install engine sever to access files from the server)
cd var/www/html
nano ada.html
(exit cntrl x)
http://145.24.139.110/ada.html
<a href="suzan.html".suzan,/a>
(to write)
figlet -f /usr/share/figlet/script.flf MESSAGE
ls /usr/share/figlet/
figlet -f shadow ada
- Root = main user
- Pseudo but not root: pseudoappinstall (will work if ur not root)