diff --git a/README.md b/README.md index 60f55e53..24e48020 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,10 @@ -# Project Name +# Project JO Gommiswald -Replace this readme with your own information about your project. - -Start by briefly describing the assignment in a sentence or two. Keep it short and to the point. +It's the webpage of our Skiclub. We train kids in skiing and we use the webpage mainly for organization with the parents. ## The problem - -Describe how you approached to problem, and what tools and techniques you used to solve it. How did you plan? What technologies did you use? If you had more time, what would be next? +The tab 'Termine' is supposed to be interactive and with some links, but I havn't been able to do that yet. +Also, I would like to add a registration form in 'Kontakt' and of course the real adresses. ## View it live diff --git a/code/images/clublied.mp3 b/code/images/clublied.mp3 new file mode 100644 index 00000000..4096b59c Binary files /dev/null and b/code/images/clublied.mp3 differ diff --git a/code/images/gruppe.jpeg b/code/images/gruppe.jpeg new file mode 100644 index 00000000..a892f771 Binary files /dev/null and b/code/images/gruppe.jpeg differ diff --git a/code/images/jerome.jpeg b/code/images/jerome.jpeg new file mode 100644 index 00000000..cca813c6 Binary files /dev/null and b/code/images/jerome.jpeg differ diff --git a/code/images/jo.jpeg b/code/images/jo.jpeg new file mode 100644 index 00000000..153c7635 Binary files /dev/null and b/code/images/jo.jpeg differ diff --git a/code/images/lisa.jpeg b/code/images/lisa.jpeg new file mode 100644 index 00000000..7ee348f7 Binary files /dev/null and b/code/images/lisa.jpeg differ diff --git a/code/images/piccolo.jpeg b/code/images/piccolo.jpeg new file mode 100644 index 00000000..5c938282 Binary files /dev/null and b/code/images/piccolo.jpeg differ diff --git a/code/images/turnen.jpeg b/code/images/turnen.jpeg new file mode 100644 index 00000000..450aba79 Binary files /dev/null and b/code/images/turnen.jpeg differ diff --git a/code/images/urs.jpeg b/code/images/urs.jpeg new file mode 100644 index 00000000..3dfc9bf2 Binary files /dev/null and b/code/images/urs.jpeg differ diff --git a/code/index.html b/code/index.html index b990bed9..077722eb 100644 --- a/code/index.html +++ b/code/index.html @@ -4,18 +4,35 @@ - Project Name - - + JO Gommiswald + + - -

Hello there! 👋🏼

+ +
+

JO GOMMISWALD

+
+
+

Die JO Gommiswald vermittelt den Kindern im Alter von 4 - 15 Jahren die Freude am Schneesport. + Wir bieten Ski und Snowboard als Breiten- und Rennsport sowie ein Konditionstraining an. + Von 4 - 7 Jahren gehen die Kinder in die Piccolo. Ab 7 Jahren gehören sie der JO an.

+
+ \ No newline at end of file diff --git a/code/jo.html b/code/jo.html new file mode 100644 index 00000000..4ea3bd31 --- /dev/null +++ b/code/jo.html @@ -0,0 +1,46 @@ + + + + + + + JO Gommiswald + + + + + +
+

JO

+
+
+ +

Die JO unterteilt sich in folgende Gruppen:

+ Ski Fungruppe: Teilnahme an den Trainings-, sowie am LinthCUP- und Clubrennen

+ Ski Funracegruppe: Teilnahme an den Trainings, an allen LinthCUP- und Clubrennen

+ Ski Renngruppe: Teilnahme an den Trainings, Lizenz- oder Animationsrennen, inklusive LinthCUP- und Clubrennen, + Teilnahme am Trainingslager im Herbst und an den Trainingsweekends erwünscht

+ Snowboard: Für Kinder, die selbständig Snowboardfahren können und weiter an ihrer Fahrtechnik arbeiten möchten

+
+
+

+ Ansprechsperson:
Urs Kaufmann

+
+ + + \ No newline at end of file diff --git a/code/kontakt.html b/code/kontakt.html new file mode 100644 index 00000000..a373e40f --- /dev/null +++ b/code/kontakt.html @@ -0,0 +1,50 @@ + + + + + + + JO Gommiswald + + + + + +
+

Kontakt

+
+
+
+

Urs Kaufmann

+ MAIL +

Telefon: *****

+
+
+

Jérôme Stillhard

+ MAIL +

Telefon: *****

+
+
+

Lisa Mattes

+ MAIL +

Telefon: *****

+
+
+ + + \ No newline at end of file diff --git a/code/piccolo.html b/code/piccolo.html new file mode 100644 index 00000000..742e062a --- /dev/null +++ b/code/piccolo.html @@ -0,0 +1,49 @@ + + + + + + + JO Gommiswald + + + + + +
+

Piccolo

+
+
+ +

Das Piccoloteam gibt den Kindern die Gelegenheit, + den spielerischen Umgang mit den Skis zu üben. + Dieses Angebot gilt für alle, ob Anfänger oder kleine Rennfahrer, + auch für Nichtmitglieder des Skiclub.

+

Das Piccolo-Lied, gesungen von der 2. Klasse von Mirco Büsser in Eschenbach

+ +

+
+
+

+ Ansprechsperson:
Jérôme Stillhard

+
+ + + \ No newline at end of file diff --git a/code/style.css b/code/style.css index 313a9df6..0043f183 100644 --- a/code/style.css +++ b/code/style.css @@ -1,5 +1,125 @@ -/* Here in the css file you'll write your styling. make sure to link the css file to the html file. If it's linked correctly you should see a light blue background. */ - body { - background-color: lightblue; + font-family: 'Roboto', Verdana, Calibri, sans-serif; + font-size: 14px; + margin: 0; +} + +h1, h2 { + font-family: 'Segoe UI', Verdana, Calibri, sans-serif; + font-size: 50px; + text-align: center; + margin: 0; +} + +a.black:link, a.black:visited { + color: black; + text-decoration: underline; +} +a.white:link, a.white:visited { + color: whitesmoke; + text-decoration: none; +} + +#titel { + background-image: url(./images/gruppe.jpeg); + background-size: cover; + height: 600px; +} +h1 { + color: rgb(22, 22, 76); + padding: 15px; +} + +header { + background-color: rgb(38, 62, 168); + padding: 10px; +} +h2 { + color: whitesmoke; +} + +nav { + padding-top: 20px; + padding-right: 40px; + background-color: rgb(38, 62, 168); + text-align: right; + word-spacing: 8px; + font-size: 16px; +} +.arrow { + border: solid whitesmoke; + border-width: 0 1px 1px 0; + display: inline-block; + padding: 3px; + transform: rotate(45deg); + -webkit-transform: rotate(45deg); +} + +.drop { + border: none; } +.dropdown { + position: relative; + display: inline-block; +} +.dropdown-content { + display: none; + position: absolute; + min-width: 100px; + text-align: center; + background-color: rgb(38, 62, 168); + width: 100%; + z-index: 1; +} +.dropdown-content a { + font-size: 16px; +} +.dropdown:hover .dropdown-content { + display: block; +} + +.about { + margin-left: 100px; + margin-right: 100px; +} +.about img { + width: 100%; +} + +.coach { + display: flex; + margin: 30px 100px; +} +.coach img { + float: right; + object-fit: cover; + border-radius: 50%; +} + +table { + width: 100%; + border-collapse: collapse; +} +th, td { + font-size: 18px; + text-align: left; + padding: 40px; + border-bottom: solid black; +} + +.kontakt { + display: flex; + height: 500px; +} +.name { + display: flex; + flex-direction: column; + padding: 50px; +} + +footer { + background-color: rgb(38, 62, 168); + color: whitesmoke; + margin: 0; + padding: 7px; +} \ No newline at end of file diff --git a/code/termine.html b/code/termine.html new file mode 100644 index 00000000..e841707a --- /dev/null +++ b/code/termine.html @@ -0,0 +1,67 @@ + + + + + + + JO Gommiswald + + + + + +
+

Termine

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EventAnmeldungRanglisteFotos
Weekend SöldenUrs Kaufmannkeinelink
Linth Cup GommiswaldUrs Kaufmannverfügbarlink
ClubrennenLisa Mattesverfügbarlink
Abschluss-BrätelnLisa Matteskeinelink
+
+ + + \ No newline at end of file diff --git a/code/turnen.html b/code/turnen.html new file mode 100644 index 00000000..e53cdb00 --- /dev/null +++ b/code/turnen.html @@ -0,0 +1,44 @@ + + + + + + + JO Gommiswald + + + + + +
+

Turnen

+
+
+ +

Am Donnerstag Abend von 18.15 - 20.00 Uhr findet das Konditionstraining statt. + Im Sommer-Halbjahr sind wir draussen auf dem roten Platz, im + Winter-Habljahr drinnen in der Halle. +

+
+
+

+ Ansprechsperson:
Lisa Mattes

+
+ + + \ No newline at end of file