10 Dic

CSS3 tips

Responsive viewport units (vw, vh, and vmin)

article > section {
    column-width: 22rem;
    column-gap: 2.6rem;
                
    height: 80vh;
    width: 80vw;
        
    overflow: scroll;
}

object-fit: cover

img {
width: 200px;
height: 400px;
object-fit: cover;
}

backface-visibility

img {
  position: absolute;
animation: turn 2s infinite;
}
.donut-front {
  z-index: 5;
  backface-visibility: hidden;
}
@keyframes turn {
  to {
  transform: rotateY(360deg);
  }
}

 

REM VS EM

rem Relative to font-size of the root element
em Relative to the font-size of the element (2em means 2 times the size of the current font)

:nth-child

p:nth-child(odd) {
background: red;
}

p:nth-child(even) {
background: blue;
}

p:nth-child(3n+0) {
background: red;
}

Using a formula (an + b). Description: a represents a cycle size, n is a counter (starts at 0), and b is an offset value.

Specifying two sizes in CSS font property

font: 14px/60px

=

font-size: 14px;
line-height: 60px;

Link Utili

http://www.css3.info/

05 Dic

Configurare virtual host in MAMP per Mac

1. Host file

sudo nano -w /etc/hosts

Aggiungere questa riga

127.0.0.1    domain.test

 

2. httpd.conf

Si trova: Applications/MAMP/conf/apache/httpd.conf

DA:

# Virtual Hosts
# Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

A:

# Virtual Hosts
Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

 

3. httpd-vhosts.conf

si trova: Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

DA:

<VirtualHost *:80>
ServerAdmin webmaster@dummy-host.example.com
DocumentRoot “/Applications/MAMP/Library/docs/dummy-host.example.com”
ServerName dummy-host.example.com
ServerAlias www.dummy-host.example.com
ErrorLog “logs/dummy-host.example.com-error_log”
CustomLog “logs/dummy-host.example.com-access_log” common
</VirtualHost>

<VirtualHost *:80>
ServerAdmin webmaster@dummy-host2.example.com
DocumentRoot “/Applications/MAMP/Library/docs/dummy-host2.example.com”   ServerName dummy-host2.example.com
ErrorLog “logs/dummy-host2.example.com-error_log”
CustomLog “logs/dummy-host2.example.com-access_log” common
</VirtualHost>

A:

<VirtualHost *:8888>
DocumentRoot /Applications/MAMP/htdocs
ServerName localhost
</VirtualHost>

<VirtualHost *:8888>
DocumentRoot “/Users/user/Sites/domain”
ServerName domain.test
ServerAlias domain.test
</VirtualHost>

 

4. Test sul browser

http://domain.test:8888

 

20 Nov

How to record the screen on your Mac

To capture a screenshot of the entire display:

  • Tap Shift + Command + 3.
  • Find the picture on your Mac’s desktop.

To capture just a part of the screen on your Mac:

  • Tap Shift + Command + 4.
  • Find the picture on your Mac’s desktop

To record a video on your Mac:

  • Open QuickTime
  • Tap “File” at the top of the display.
  • Choose “New Screen recording”
  • Hit record.
  • You can record the whole screen, or click and drag your mouse cursor to record just a specific part.
23 Giu

Creare giochi con Javascript – Html5 Game Framework

https://html5gameengine.com/

https://balsamiq.com/products/mockups/

http://go.chatmapper.com/player/localpreview/index.php?jsonfile=http://go.chatmapper.com/uploads/0A1C8282B70D245C2A302C7CEF586C41/example_03/Example.json&template=CutoutPeople_black    Interessante.

https://thiscouldbebetter.neocities.org/conversation.html   Puro Javascript

http://www.masswerk.at/elizabot/     Divertiti con questa…. 😉

e naturalmente

https://unity3d.com/
http://roycekimmons.com/tools/unity3d_dialogue_generator

http://generator.acmi.net.au/storyboard/interactive
https://github.com/cyclejs/examples

Javascript Code Academy
https://www.codecademy.com/learn/javascript
https://www.khanacademy.org/computing/computer-programming/programming

http://rpgjs.com/v2/doc/?p=tuto-get_started.html

https://rpgmakermv.co/threads/how-to-learn-javascript-for-rpg-maker-mv.106/

http://canvasengine.net/

http://phaser.io/

https://www.scirra.com/

http://craftyjs.com/getting-started/

01 Giu

Regola base per DEM

  • Larghezza: 600 px, Lunghezza: la scegliete voi (meno scrolling possibile).
  • Circa metà immagine e metà testo, per i testi utilizzate font web safe.
  • Codice HTML: semplice e veloce da scaricare.
  • Mobile  larghezza attorno ai 320 px