albinotonnina / albinotonnina.com Goto Github PK

View Code? Open in Web Editor NEW

2.6K 76.0 512.0 28.16 MB

source-code

Home Page: http://www.albinotonnina.com

License: Other

JavaScript 88.32% CSS 6.30% HTML 5.38%

portfolio-website scrolling webpack vanilla-javascript javascript css animatecss albinotonnina

albinotonnina.com's People

Contributors

Stargazers

Watchers

Forkers

sandeshdamkondwar joonaskuld liznelsoncaskey csantamaria jidylle hoangloi anetcnc mgiacomini noistommy abhinav90 bioavatar neelaryan rishia nullnotfound claudiopetrini mirkods cordellyee kingstenbanh alexander-friedrich lev-veshnyakov yuedayu hardikamal wpconsulate kkkometo leevioo anitbt ktdilsiz vadimk kbuhiire aniketlad16 jaydevs foamfly niikwartey kprabha25 iamjosephstalin awvis mayankyadav123 bryant1410 nitishya pageart animeshgupta harrypotter0 garrettcadams imskojs tylert88 dbrandydude kashishkumawat mibshara ackul as8297 litson-95 wmundev luludada alibakhshi94 klevyr hasibweb rafaelgus dancrossover bedomohamed hglovacki akshat122 bhushan23 darshankumar89 pkouvel vinitchuri medmans developer-vortex raajsurvade ravichandra480 anayarojo daaef palashgupta98 bbrajkovic alexgood1 mudrapatel5 0xneox haroldh2003 devops-user-007 todun ranjithnfn makoto-sasahara avalon1214 dhruvs007 anthonysego kumarkanil diasluan kyzero666 mzangeneh tpal94 m3lissaeg shouri14 vinhnguyen0301 eskayamadeus orygal momadejunior jadenguyen7 neron-x5 amit-bhadra boradparas masum-abdullah1786

albinotonnina.com's Issues

Unable to launch using the readme commands

Hi,
Am I missing something as there seems to be a huge void between the read me and actual installation as I'm not able to successfully even get to running the downloaded project? Any help is appreciated.

Thanks

npm run dev throws :

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

configuration has an unknown property 'mode'. These properties are valid:
object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }
For typos: please correct them.
For loader options: webpack 2 no longer allows custom properties in configuration.
Loaders should be updated to allow passing options via loader options in module.rules.
Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
plugins: [
new webpack.LoaderOptionsPlugin({
// test: /.xxx$/, // may apply this only for some modules
options: {
mode: ...
}
})
]
npm ERR! code ELIFECYCLE
npm ERR! errno 1

[Feature Proposal] Audio to the Subtitles based on Scroll

Audio to the Subtitles Feature Proposal

Description

Based on the scroll, as the srt(subtitles appear, an audio reading that subtitle will run in background)

Assignees

@shravan20

Background

Using Audio Element and its DOM API, we can implement this into the application without any performance hinderance

Tests

Unit testing will also be taken care and completed using existing Test Library used for the same.

landscape layout on show, in portrait mode

Weird subtitle, maybe forgotten accidentally?

Or maybe just to give the impression of something is going wrong. Because afterwards we see the error screen.

{
"start": "6001",
"end": "6003",
"text": "dskf sdkjf98sy d9f8u"
}

Mishandling of pages when the zoom levels are changed.

When I changed the zoom levels, the pages misbehaved.
OS: Ubuntu 20.04.2.
Browser: Google Chrome 89.0.4389.82 (Official Build) (64-bit)

According to the new render, it ends here:

Can I derive my work off this repo?

Two things I've noticed:

Your site says has a public repository on GitHub.
You've Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International license.

Which I think conflicts? Because I want to derive.

What are your final thoughts?

There's a problem

There's a problem, this website is too cool

remove vignette in mobile

website breaks. scrolling too fast.

This site is incredible

Just wanted to say that haha. Wow! That is all. Will close.

extra space between scenes in safari osx, resize method solves.

Timing issue?

Dont know how to open this site.

Hello sir, I'm new to web development. I want to open your website in my environment. But don't know how to I cloned it and tried to open index.html but it just shows the html part not the original website.

It would be really helpfull if you teach me how to open the original format of the website. I use VS code.

fix rotation on iphone

grunt serve:dist error #2

After implementing the workaround from Issue #1, I am getting a new issue that I'm unfamiliar with. Google and SO have been less than helpful.

Here's the error:

Looking for Modernizr references
Warning: Can't find your Modernizr development build at app/bower_components/modernizr/modernizr.js
          grunt-modernizr needs this path to avoid false positives

          Update your gruntfile via the modernizr.devFile config option
          See https://github.com/doctyper/grunt-modernizr#devfile-string for more details

          Use --force to continue.

grunt serve:dist error

Hi! First of all, let me say that this looks amazing. I can't wait to play with it and figure out how you were able to make it.

I did run into a problem, however, when I was trying to run grunt serve:dist

If you are able, please let me know your thoughts. Thanks!!

Running "sass:dist" (sass) task
Error: Invalid CSS after "": expected keyframes selector (e.g. 10%), was "0"
               on line 25 of tmp/animation.scss
     Use --trace for backtrace.
File "dist/styles/animation.css" created.
Warning: Use --force to continue.

There is no animation.scss in the tmp folder now, so I'm not sure what this error is referring to exactly.

Edit: Just found this in dist\animation.css

body:before {
  white-space: pre;
  font-family: monospace;
  content: "Error: Invalid CSS after \"\": expected keyframes selector (e.g. 10%), was \"0\"\A         on line 25 of tmp/animation.scss\A \A 20: \A 21: \A 22: #scene1 { -skrollr-animation-name: scene1; }\A 23: \A 24: @-skrollr-keyframes scene1 {\A 25:   #{$scene_01_begin} {\A 26:     top: 0%;\A 27:   }\A 28:   #{$scene_01_end - 500} {\A 29:     top: 0%;\A 30:   }"; }

Here's a bit more info from the backtrace:

/*
Error: Invalid CSS after "": expected keyframes selector (e.g. 10%), was "0"
        on line 25 of tmp/animation.scss

20: 
21: 
22: #scene1 { -skrollr-animation-name: scene1; }
23: 
24: @-skrollr-keyframes scene1 {
25:   #{$scene_01_begin} {
26:     top: 0%;
27:   }
28:   #{$scene_01_end - 500} {
29:     top: 0%;
30:   }

Backtrace:
tmp/animation.scss:25
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/scss/parser.rb:1165:in `expected'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/scss/parser.rb:1101:in `expected'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/scss/parser.rb:1081:in `expr!'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/scss/static_parser.rb:46:in `parse_keyframes_selector'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:412:in `visit_rule'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:36:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:158:in `block in visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:79:in `block in with_base'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:115:in `with_frame'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:79:in `with_base'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:158:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:501:in `block (2 levels) in visit_directive'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:501:in `map'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:501:in `block in visit_directive'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:179:in `with_environment'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:500:in `visit_directive'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:36:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:158:in `block in visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:79:in `block in with_base'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:115:in `with_frame'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/stack.rb:79:in `with_base'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:158:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:52:in `block in visit_children'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:52:in `map'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:52:in `visit_children'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:167:in `block in visit_children'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:179:in `with_environment'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:166:in `visit_children'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:36:in `block in visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:186:in `visit_root'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/base.rb:36:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:157:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/visitors/perform.rb:8:in `visit'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/root_node.rb:36:in `css_tree'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/tree/root_node.rb:29:in `render_with_sourcemap'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/engine.rb:368:in `_render_with_sourcemap'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/engine.rb:285:in `render_with_sourcemap'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/exec/sass_scss.rb:407:in `run'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/exec/sass_scss.rb:63:in `process_result'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/exec/base.rb:52:in `parse'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/lib/sass/exec/base.rb:19:in `parse!'
C:/Ruby22-x64/lib/ruby/gems/2.2.0/gems/sass-3.4.13/bin/sass:13:in `<top (required)>'
C:/Ruby22-x64/bin/sass:23:in `load'
C:/Ruby22-x64/bin/sass:23:in `<main>'
*/

I want to derive from your work. Is it permitted by the license ?

Hey,
I want to make a derivate of your code to make my personal non-commercial portfolio.
Is it permitted by the license?
Thanks in advance,

Not Working

The Source code no run

Are you thinking to add documentation?

Things are all over the place. Since it is in vanilla js, it's little too much to comprehend 😅

firefox osx, scene 5, vimeo video is not resized correctly

error during npm install in kali linux

root@SK:~/Desktop/MyWebsite/albinotonnina.com-master# npm install

[email protected] install /root/Desktop/MyWebsite/albinotonnina.com-master/node_modules/phantomjs-prebuilt
node install.js

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

npm ERR! file sh
npm ERR! path sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn sh
npm ERR! [email protected] install: node install.js
npm ERR! spawn sh ENOENT
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2017-10-06T17_35_58_309Z-debug.log
root@SK:~/Desktop/MyWebsite/albinotonnina.com-master#

Which Compiler I have to use to run this script

I tried to use yarn but those you mentioned commands are not working in that.