16 changed files with 244 additions and 59 deletions
@ -1 +1,40 @@ |
|||||
<p>about works!</p> |
|
||||
|
<div class="component-about container"> |
||||
|
<div class="row"> |
||||
|
<div class="col-10 mx-auto"> |
||||
|
<p> <b>DSLAK</b> è un progetto che nasce nel 2010 da un'idea di Carmine De Rosa, sviluppatore ed amministratore di sistema in ambiente Unix/Linux, dopo aver completato gli studi in ambito elettronico approfondisce le proprie conoscenze informatiche presso l'Università di Salerno dove insieme ad un gruppo di appassionati di haking fonda HCSSLUG (Linux Users Group dell'Università di Salerno) e ed il relativo HackLab con il quale realizza numerosi progetti in ambito OpenSource, basati sulla ricerca e sulla sperimentazione in ambito tecnologico. </p> |
||||
|
|
||||
|
<p> Nel 2006 si avvicina alle arti digitali e nel 2009, incuriosito dapprima dall'aspetto tecnico ma senza tralasciare quello scenico e concettuale, inizia ad approfondire le propie conoscenze nell'ambito della new-media art e delle installazioni interattive, studiando le soluzioni adottate da artisti affermati e sviluppando varie soluzioni alternative che utilizzano però un approccio più sostenibile, efficiente e soprattutto open. </p> |
||||
|
|
||||
|
<p> Nel 2011 realizza le sue prime installazioni interattive e ad oggi è alla continua ricerca di soluzioni creative. </p> |
||||
|
|
||||
|
<p> <b>DSLAK</b> ha ad oggi all'attivo numerosi progetti, come workshops sull'utilizzo di sensori e microcontrollori nel campo dell'interattività e delle arti digitali, installazioni interattive e performances live frutto della sperimentazione e della ricerca continua, oltre alle collaborazioni con diversi artisti nazionali ed internazionali. </p> |
||||
|
|
||||
|
|
||||
|
<div class="about-links pt-4 pb-5"> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="https://www.facebook.com/dslakMediaArts"> |
||||
|
<span class="icon icon-facebook"></span> |
||||
|
<div class="label">dslakMediaArts</div> |
||||
|
</a> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/c/Dslak"> |
||||
|
<span class="icon icon-youtube"></span> |
||||
|
<div class="label">dslak</div> |
||||
|
</a> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="https://vimeo.com/dslak"> |
||||
|
<span class="icon icon-vimeo"></span> |
||||
|
<div class="label">dslak</div> |
||||
|
</a> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="https://twitter.com/dslak_"> |
||||
|
<span class="icon icon-twitter"></span> |
||||
|
<div class="label">dslak_</div> |
||||
|
</a> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="tel:+393391805849"> |
||||
|
<span class="icon icon-phone"></span> |
||||
|
<div class="label">+39 339 1805849</div> |
||||
|
</a> |
||||
|
<a class="link" target="_blank" rel="noopener noreferrer" href="mailto:dslaknma@gmail.com"> |
||||
|
<span class="icon icon-envelope"></span> |
||||
|
<div class="label">dslaknma@gmail.com</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
@ -0,0 +1,48 @@ |
|||||
|
@import "../../assets/scss/variables"; |
||||
|
|
||||
|
.component-about { |
||||
|
padding-top: 160px; |
||||
|
font-size: $font-18; |
||||
|
z-index: 0; |
||||
|
|
||||
|
.about-links { |
||||
|
color: $black; |
||||
|
|
||||
|
.link { |
||||
|
display: flex; |
||||
|
text-decoration: none; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
line-height: 35px; |
||||
|
width: 200px; |
||||
|
transition: transform .3s; |
||||
|
|
||||
|
|
||||
|
.icon { |
||||
|
display: inline-block; |
||||
|
font-size: 15px; |
||||
|
padding: 5px; |
||||
|
margin: 5px; |
||||
|
background: $dark-gray; |
||||
|
border-radius: 2px; |
||||
|
color: $white; |
||||
|
height: 25px; |
||||
|
width: 25px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.label { |
||||
|
display: inline-block; |
||||
|
color: $dark-gray; |
||||
|
font-size: $font-16; |
||||
|
padding-left: 5px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
&:hover { |
||||
|
transform: scale(1.1); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
@ -1 +1,43 @@ |
|||||
<p>portfolio works!</p> |
<p>portfolio works!</p> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
<br> |
||||
|
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
@ -0,0 +1,72 @@ |
|||||
|
@font-face { |
||||
|
font-family: 'icomoon'; |
||||
|
src: url('../fonts/icomoon.eot?9ti7zb'); |
||||
|
src: url('../fonts/icomoon.eot?9ti7zb#iefix') format('embedded-opentype'), |
||||
|
url('../fonts/icomoon.ttf?9ti7zb') format('truetype'), |
||||
|
url('../fonts/icomoon.woff?9ti7zb') format('woff'), |
||||
|
url('../fonts/icomoon.svg?9ti7zb#icomoon') format('svg'); |
||||
|
font-weight: normal; |
||||
|
font-style: normal; |
||||
|
font-display: block; |
||||
|
} |
||||
|
|
||||
|
[class^="icon-"], [class*=" icon-"] { |
||||
|
/* use !important to prevent issues with browser extensions that change fonts */ |
||||
|
font-family: 'icomoon' !important; |
||||
|
speak: never; |
||||
|
font-style: normal; |
||||
|
font-weight: normal; |
||||
|
font-variant: normal; |
||||
|
text-transform: none; |
||||
|
line-height: 1; |
||||
|
|
||||
|
/* Better Font Rendering =========== */ |
||||
|
-webkit-font-smoothing: antialiased; |
||||
|
-moz-osx-font-smoothing: grayscale; |
||||
|
} |
||||
|
|
||||
|
.icon-envelope-o:before { |
||||
|
content: "\f003"; |
||||
|
} |
||||
|
.icon-twitter-square:before { |
||||
|
content: "\f081"; |
||||
|
} |
||||
|
.icon-facebook-square:before { |
||||
|
content: "\f082"; |
||||
|
} |
||||
|
.icon-phone:before { |
||||
|
content: "\f095"; |
||||
|
} |
||||
|
.icon-phone-square:before { |
||||
|
content: "\f098"; |
||||
|
} |
||||
|
.icon-twitter:before { |
||||
|
content: "\f099"; |
||||
|
} |
||||
|
.icon-facebook:before { |
||||
|
content: "\f09a"; |
||||
|
} |
||||
|
.icon-facebook-f:before { |
||||
|
content: "\f09a"; |
||||
|
} |
||||
|
.icon-envelope:before { |
||||
|
content: "\f0e0"; |
||||
|
} |
||||
|
.icon-youtube-square:before { |
||||
|
content: "\f166"; |
||||
|
} |
||||
|
.icon-youtube:before { |
||||
|
content: "\f167"; |
||||
|
} |
||||
|
.icon-vimeo-square:before { |
||||
|
content: "\f194"; |
||||
|
} |
||||
|
.icon-git-square:before { |
||||
|
content: "\f1d2"; |
||||
|
} |
||||
|
.icon-git:before { |
||||
|
content: "\f1d3"; |
||||
|
} |
||||
|
.icon-vimeo:before { |
||||
|
content: "\f27d"; |
||||
|
} |
@ -1,3 +1,7 @@ |
|||||
@import "./variables"; |
@import "./variables"; |
||||
@import "./fonts"; |
@import "./fonts"; |
||||
|
@import "./icons"; |
||||
@import "./global"; |
@import "./global"; |
||||
|
|
||||
|
|
||||
|
@import "node_modules/bootstrap/scss/bootstrap-grid"; |
||||
|
Loading…
Reference in new issue