1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00

css grid to pack my layout

This commit is contained in:
muerwre 2019-04-02 17:25:50 +07:00
parent 44e10599d7
commit debb0640da
20 changed files with 1212 additions and 23 deletions

128
src/sprites/circles.svg Normal file
View file

@ -0,0 +1,128 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="1900"
height="1900"
viewBox="0 0 502.70831 502.70835"
version="1.1"
id="svg5743"
inkscape:version="0.92.2 5c3e80d, 2017-08-06"
sodipodi:docname="circles.svg">
<defs
id="defs5737" />
<sodipodi:namedview
id="base"
pagecolor="#111111"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="0.35355339"
inkscape:cx="236.02719"
inkscape:cy="885.79322"
inkscape:document-units="px"
inkscape:current-layer="g6342"
showgrid="false"
units="px"
inkscape:showpageshadow="false"
inkscape:window-width="1920"
inkscape:window-height="1036"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1" />
<metadata
id="metadata5740">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,205.70834)">
<g
id="g6342"
style="opacity:0.322">
<circle
r="371.18393"
cy="-244.80879"
cx="-61.365086"
id="path6288"
style="opacity:1;fill:none;fill-opacity:0.81042654;stroke:#ffffff;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<circle
style="opacity:1;fill:none;fill-opacity:0.81042654;stroke:#ffffff;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="circle6290"
cx="-101.77624"
cy="-190.92725"
r="490.92065" />
<rect
y="94.123978"
x="78.772171"
height="6.8791666"
width="25.929167"
id="rect6292"
style="opacity:1;fill:#ffffff;fill-opacity:0.92890996;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="opacity:1;fill:#ffffff;fill-opacity:0.92890996;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect6317"
width="25.929167"
height="6.8791666"
x="78.772171"
y="262.50378" />
<circle
style="opacity:1;fill:none;fill-opacity:0.81042654;stroke:#ffffff;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="circle6344"
cx="-61.365086"
cy="-361.22528"
r="371.18393" />
<circle
r="371.18393"
cy="-461.76675"
cx="-61.365086"
id="circle6346"
style="opacity:1;fill:none;fill-opacity:0.81042654;stroke:#ffffff;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<circle
style="opacity:1;fill:none;fill-opacity:0.81042654;stroke:#ffffff;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="circle6348"
cx="-61.365086"
cy="-535.8501"
r="371.18393" />
<rect
style="opacity:1;fill:#ffffff;fill-opacity:0.92890996;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect6350"
width="25.929167"
height="6.8791666"
x="78.772171"
y="-22.292683" />
<rect
y="-123.89268"
x="78.772171"
height="6.8791666"
width="25.929167"
id="rect6354"
style="opacity:1;fill:#ffffff;fill-opacity:0.92890996;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="opacity:1;fill:#ffffff;fill-opacity:0.92890996;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect6356"
width="25.929167"
height="6.8791666"
x="78.772171"
y="-197.97607" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.9 KiB

84
src/sprites/dots.svg Normal file
View file

@ -0,0 +1,84 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="30"
height="30"
viewBox="0 0 7.9374998 7.9375004"
version="1.1"
id="svg8"
inkscape:version="0.92.2 5c3e80d, 2017-08-06"
sodipodi:docname="dots.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#111111"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="19.909475"
inkscape:cx="16.741834"
inkscape:cy="10.63598"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
inkscape:showpageshadow="false"
units="px"
inkscape:window-width="1920"
inkscape:window-height="1036"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1">
<inkscape:grid
type="xygrid"
id="grid815" />
</sodipodi:namedview>
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-289.06249)">
<rect
style="opacity:0.051;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect5700"
width="0.52916664"
height="0.52916664"
x="0"
y="296.47083" />
<rect
y="296.47083"
x="7.9375"
height="0.52916664"
width="0.52916664"
id="rect5733"
style="opacity:0.051;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" />
<rect
style="opacity:0.102;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect5735"
width="0.52916664"
height="0.52916664"
x="3.7041667"
y="292.50208" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

145
src/sprites/logo_sm.svg Normal file
View file

@ -0,0 +1,145 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="24"
height="24"
viewBox="0 0 6.3499998 6.3499998"
version="1.1"
id="svg6364"
inkscape:version="0.92.2 5c3e80d, 2017-08-06"
sodipodi:docname="logo_sm.svg">
<defs
id="defs6358">
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath6466">
<path
sodipodi:nodetypes="ccccc"
inkscape:connector-curvature="0"
id="path6468"
d="m 4.3340568,275.02894 h 9.7949472 l 5.662705,18.81696 H 4.3340568 Z"
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.52916658;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
clip-path="none" />
</clipPath>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#111111"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="16"
inkscape:cx="-5.3422515"
inkscape:cy="16.073652"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:showpageshadow="false"
units="px"
inkscape:window-width="1920"
inkscape:window-height="1036"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1">
<inkscape:grid
type="xygrid"
id="grid6366" />
</sodipodi:namedview>
<metadata
id="metadata6361">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-290.65)">
<g
id="g6373"
clip-path="url(#clipPath6466)"
transform="matrix(0.3241467,0,0,0.30933959,-1.1402869,205.83724)"
style="stroke-width:3.15799522">
<ellipse
id="ellipse6390"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:1.67110562;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
ry="6.9238639"
rx="6.9239755"
cy="285.29712"
cx="13.302538" />
<path
cx="13.302538"
cy="284.2529"
rx="5.9107676"
ry="5.9046412"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.83555275;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="path6398"
d=""
inkscape:connector-curvature="0" />
<path
cx="13.302538"
cy="284.2529"
rx="5.9107676"
ry="5.9046412"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.83555275;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="path6400"
d=""
inkscape:connector-curvature="0" />
<path
cx="13.302538"
cy="284.2529"
rx="5.9107676"
ry="5.9046412"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.83555275;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="path6402"
d=""
inkscape:connector-curvature="0" />
<path
cx="13.302538"
cy="284.2529"
rx="5.9107676"
ry="5.9046412"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.83555275;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="path6404"
d=""
inkscape:connector-curvature="0" />
<path
cx="13.302538"
cy="284.2529"
rx="5.9107676"
ry="5.9046412"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:0.83555275;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="path6425"
d=""
inkscape:connector-curvature="0" />
<ellipse
cx="13.302538"
cy="285.29712"
rx="2.4326823"
ry="2.4166644"
style="opacity:1;fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:1.67110562;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="ellipse6427" />
<path
style="opacity:1;fill:#ffff00;fill-opacity:1;stroke:#ffffff;stroke-width:1.67110562;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
d="m 12.168819,283.58398 -1.990075,-4.80764"
id="path6470"
inkscape:connector-curvature="0" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.3 KiB