View sourcecode

The following files exists in this folder. Click to view.

ramverksida.html

97 lines UTF-8 Unix (LF)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
  <title>Olivers Erfarenheter</title>

  <!-- CSS  -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
  <link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
</head>
<body>
  <nav class="purple darken-4" role="navigation">
    <div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">Oliver Sigurdson</a>
    </div>
  </nav>
  <div class="section no-pad-bot" id="index-banner">
    <div class="container">
      <br><br>
      <h1 class="header center black-text">Olivers Projekt</h1>
      <div class="row center">
        <h5 class="header col s12 light">Nedan finns en länk till min hemsida, där man kan hitta mina projekt.</h5>
      </div>
      <div class="row center">
        <a href="https://als070926os.hemsida.eu/" id="download-button" class="btn-large waves-effect waves-light black">Gå till hemsida</a>
      </div>
      <br><br>

    </div>
  </div>


  <div class="container">
    <div class="section">

      <!--   Icon Section   -->
      <div class="row">
        <div class="col s12 m4">
          <div class="icon-block">
            <h2 class="center light-blue-text"><i class="material-icons">flash_on</i></h2>
            <h5 class="center">Snabba laddtider</h5>

            <p class="light">Sidan är optimerad till hög nivå för att kunna ladda snabbt, så att du slipper vänta även om bandbredden har mer att önska. Bilden såväl som bakgrunden är uppladdade i WEBP-format, vilket gör att deras storlekar, och därmed laddtiderna, anpassas.</p>
          </div>
        </div>

        <div class="col s12 m4">
          <div class="icon-block">
            <h2 class="center light-blue-text"><i class="material-icons">group</i></h2>
            <h5 class="center">Responsiv design</h5>

            <p class="light">Sidan är byggd med responsivitet i åtanke, och den kan visas på alla olika storlekar på skärmar. Du kan ta upp den på datorn, telefonen, surfplattan, eller en fyrtio år gammal tjock-TV. Inga texter försvinner, alla knappar är synliga, och blodtrycket håller sig nere.</p>
          </div>
        </div>

        <div class="col s12 m4">
          <div class="icon-block">
            <h2 class="center light-blue-text"><i class="material-icons">settings</i></h2>
            <h5 class="center">Tydliga element</h5>

            <p class="light">Elementen på sidan är stora och tydliga, och det finns inte massa onödiga delar som tar upp uppmärksamhet och plats. Det du behöver se ligger antagligen mitt på skärmen, tillräckligt stort för att inte vara något problem.</p>
          </div>
        </div>
      </div>

    </div>
    <br><br>
  </div>

  <footer class="page-footer orange">
    <div class="container">
      <div class="row">
        <div class="col l6 s12">
          <h5 class="white-text">Vem är jag?</h5>
          <p class="grey-text text-lighten-4">Jag är en elev på teknikprogrammet som håller på att lära mig att bygga hemsidor. Än så länge har jag lärt mig att skriva kod i HTML, CSS, och nu håller jag på att lära mig JavaScript för att kunna lägga till funktionalitet på mina sidor.</p>


        </div>
      </div>
    </div>
    <div class="footer-copyright">
      <div class="container">
      Gjord med <a class="orange-text text-lighten-3" href="http://materializecss.com">Materialize</a>
      </div>
    </div>
  </footer>


  <!--  Scripts-->
  <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <script src="js/materialize.js"></script>
  <script src="js/init.js"></script>

  </body>
</html>