html image and index
This commit is contained in:
Dario48true
parent
af5ccc8220
commit
fcd31e9f15
2 changed files with 195 additions and 0 deletions
70
home/Dario48/Pictures/html.svg
Normal file
70
home/Dario48/Pictures/html.svg
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="48"
|
||||
height="48"
|
||||
viewBox="0 0 12.7 12.7"
|
||||
version="1.1"
|
||||
id="svg1"
|
||||
inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
|
||||
sodipodi:docname="html.svg"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview1"
|
||||
pagecolor="#505050"
|
||||
bordercolor="#eeeeee"
|
||||
borderopacity="1"
|
||||
inkscape:showpageshadow="0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#505050"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:zoom="9.2218057"
|
||||
inkscape:cx="14.3139"
|
||||
inkscape:cy="22.067262"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="808"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="layer1" />
|
||||
<defs
|
||||
id="defs1">
|
||||
<linearGradient
|
||||
id="linearGradient2"
|
||||
inkscape:collect="always">
|
||||
<stop
|
||||
style="stop-color:#0357d1;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop2" />
|
||||
<stop
|
||||
style="stop-color:#27cdfc;stop-opacity:1;"
|
||||
offset="1"
|
||||
id="stop3" />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
inkscape:collect="always"
|
||||
xlink:href="#linearGradient2"
|
||||
id="linearGradient3"
|
||||
x1="6.768087e-06"
|
||||
y1="6.3637207"
|
||||
x2="12.694992"
|
||||
y2="6.3637207"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(0.98607749,0,0,0.9816203,0.08843632,0.08851652)" />
|
||||
</defs>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1">
|
||||
<path
|
||||
id="path2-2-6"
|
||||
style="fill:none;stroke:url(#linearGradient3);stroke-width:0.26458333;stroke-linejoin:bevel;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="M 11.729038,3.2476678 6.416327,3.2284637 0.97437682,3.2087923 M 11.729014,9.4301585 0.97404408,9.3888281 M 12.606596,6.3387384 0.08852914,6.2999638 M 6.4168354,0.08860892 6.3778847,12.550093 M 9.4824611,6.3584687 A 3.0949619,6.1959967 0 0 1 6.3874993,12.554465 3.0949619,6.1959967 0 0 1 3.2925374,6.3584687 3.0949619,6.1959967 0 0 1 6.3874993,0.16247206 3.0949619,6.1959967 0 0 1 9.4824611,6.3584687 Z M 12.561709,6.3238028 A 6.2096745,6.1816062 0 0 1 6.3520346,12.505408 6.2096745,6.1816062 0 0 1 0.14236009,6.3238028 6.2096745,6.1816062 0 0 1 6.3520346,0.14219655 6.2096745,6.1816062 0 0 1 12.561709,6.3238028 Z" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
125
home/Dario48/index.html
Normal file
125
home/Dario48/index.html
Normal file
|
|
@ -0,0 +1,125 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>/</title>
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
background-color: #161925;
|
||||
}
|
||||
::selection{
|
||||
background-color: #00D3A7;
|
||||
color: #fefefe;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.stretch {
|
||||
width: calc(50vw - 4px);
|
||||
color: #C3C7D1;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.column {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.border {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 50vw; /* 50% of the viewport's width */
|
||||
height: 50vh; /* 50% of the viewport's height */
|
||||
border: 2px solid white;
|
||||
flex-direction: row; /* Stack children horizontaly */
|
||||
justify-content: center; /* Align children to the top */
|
||||
align-items: flex-start;
|
||||
}
|
||||
button {
|
||||
background-color: #c6262e;
|
||||
color=black;
|
||||
border: 1px solid white;
|
||||
cursor: pointer;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #ed5353;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #C3C7D1;
|
||||
}
|
||||
|
||||
img {
|
||||
width: max(min(90%, 100px), 50px);
|
||||
aspect-ratio: 1/1;
|
||||
}
|
||||
|
||||
.folder {
|
||||
width: 25%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body id="body">
|
||||
<div class="border">
|
||||
<div class="column">
|
||||
<div class="stretch row">
|
||||
Dario48's website
|
||||
<div style="aspect-ratio: 1 / 1">
|
||||
<button
|
||||
type="button"
|
||||
onclick="document.getElementById('body').remove();"
|
||||
>
|
||||
X
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<form>
|
||||
<input type="text" value="/home/Dario48/" class="stretch" />
|
||||
</form>
|
||||
<nav class="row">
|
||||
<div class="column folder">
|
||||
<a href="Pictures/">
|
||||
<img
|
||||
src="/home/Dario48/Pictures/folder.svg"
|
||||
style="
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
"
|
||||
/>
|
||||
<p style="text-align: center">Pictures</p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="column folder">
|
||||
<a href="compito_online-ricerca_Dario-Spinnato-4Q-RSA-13022025.html">
|
||||
<img
|
||||
src="/home/Dario48/Pictures/html.svg"
|
||||
style="
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
"
|
||||
/>
|
||||
<p style="text-align: center">compito_online-ricerca_Dario-Spinnato-4Q-RSA-13022025.html</p>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue