Webbserverprogrammering 1

Källkod

Följande filer och mappar finns under mappen webbserverprogrammering.
Mappar visas till vänster och filer till höger. Klicka på en fil eller mapp för att öppna nedan eller visa dess innehåll.

webbserverprogrammering/style/

1 filer

stylesheet.css

stylesheet.css

220 lines ASCII Unix (LF)

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600&display=swap');


/* ------------------- general ------------------- */
html {
 scroll-behavior: smooth;
}

body{
 margin: 0;
 padding: 0;
 background: #FFFFFF;
 font-family: "Open Sans", sans-serif;
}

h1 {
 font-weight: normal;
 font-size: 2.25em;
 margin: 1.1em 0;
 text-align: center;
}



/* adjust this & overall disposition of everything later */
header#top, div#content {
 /*margin: 0 auto;
 width: 960px;*/
 padding: 0 3em;
}

/* footer */
footer#footer {
 text-align: center;
 font-weight: bold;
 /*border: 1px solid black;*/
 margin: 5.5em 0 1.5em 0;
}

#large-title {
 /*font-size: 4.5em;*/
 margin: 0.2em 0 0.4em 0;
 text-align: left;
 font-size: calc(100vw/21);
}


div#content {
 padding-bottom: 1em;
}

/* always show scrollbar to the right  */
body { overflow-y: scroll; }


/* a links
-------------------------------------------------------- 
*/
a {
 color: black;
}
a:hover {
 color: firebrick;
}


/* navigation menu
-------------------------------------------------------- 
*/
nav.navmenu {
 padding: 0.75em;
}
nav.navmenu a {
 color: black;
 padding: 0.7em;
 text-decoration: none;
 transition: 0.3s all;
 margin: 0 1em 0 0;
 border-bottom: 1px solid transparent; /* ??????? */
}
nav.navmenu a:hover {
 border-bottom: 2px solid firebrick;
}



/* Misc classes
-------------------------------------------------------- 
*/
.right {float:right;}
.left {float:left;}
.lighter {
 font-weight: lighter;
}

/* highlight current choice in navigation menu
--------------------------------------------------------
*/
body#start a#start-,
body#reflections a#reflections-,
body#exercises a#exercises-,
body#projects a#projects-,
body#viewsource a#viewsource- {
 border-bottom: 2px solid firebrick;
 color: #000;
}


/* PAGE SPECIFIC */

.arrow-right {
 width: 0;
 height: 0;
 border: 3.5px solid transparent;
 /*border-left: 12px solid #333333;*/
 border-left: 8px solid firebrick;
 transform: translateY(-0.15em);
 display: inline-block;
 margin-right: 0.5em;
 transform-origin: 25% 50%;
 transition: 0.3s transform;
}

.exercise-theme:hover {
 background: #f5f5f5;
 border-radius: 10px;
}

.exercise-theme {
 padding: 0.7em;
 padding-bottom: 0;
 margin: 0.5em;
 cursor: pointer;
 user-select: none;
}
.exercise-theme h3 {
 font-weight: normal;
 margin: 0;
 position: relative;
 top: 2px;
}
.exercise-subs {
 margin-top: 1.2em;
 transition: all 0.3s;
 opacity: 0;
 min-height: 0;
 max-height: 0;
 overflow: hidden;
}
.exercise-subs.shown {
 opacity: 1;
 min-height: 10px;
 max-height: 999px;
}
.sub-link {
 padding: 0.4em;
 display: inline-block;
 margin-right: 1em;
 margin: 0 1em 1em 0;
 border-radius: 0.3em;
 box-shadow: 1px 1px 5px 0px #a7a7a7;
 transition: 0.2s box-shadow;
 text-decoration: none;
 position: relative;
 top: 3px;
 left: 3px;
}
.sub-link:hover {
 box-shadow: 1px 1px 8px -1px #a7a7a7;
}
.project-sub-link {
 padding: 0.9em;
    font-size: 1.2em;
    margin-top: 1em;
}


#directory-path a, #directory-list a {
 text-decoration: none;
 line-height: 28px;
}
#directory-path {
 font-size: 1.2em;
 font-weight: bold;
 margin-bottom: 0;
}
#directory-count {
 font-size: 0.8em;
 margin-top: 0.2em;
}


#directory-list {
 overflow: hidden;
 margin: 1em;
}
#directories-container {
 font-weight: bold;
 margin-right: 3em;
 /*min-width: 9%;*/
 max-width: 30%;
 /*min-height: 10px;  if there is no height, width always becomes 0 */
 float: left;
}
#files-container {
 float: left;
}
#files-container a {
 /*border: 1px solid #222;*/
 border-radius: 0.3em;
 padding: 0.45em;
 margin: 0.4em 1.2em 0.6em 0.4em;
 display: inline-block;
 box-shadow: 1px 1px 3px 0px #999;
 transition: all 0.5s;
}
#files-container a:hover {
 box-shadow: 1px 1px 5px 0px #888;
}