Skip to content

Commit 2823039

Browse files
chris0steinchris0stein
committed
Adding and Styling Sessions page
This was based on the work we did in class on 12.8 with a student project.
1 parent 85808ce commit 2823039

File tree

3 files changed

+151
-2
lines changed

3 files changed

+151
-2
lines changed

‎sass/layout/_layout.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414

1515
//this examply only has two pages but you would have these too
1616
// @import "speakers";
17-
// @import "sessions";
17+
@import "sessions";
1818
@import "schedule";
1919
// @import "video";
2020
// @import "createdby";

‎sass/layout/_sessions.scss

+149
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
/*---------------------- session page --------------------------*/
2+
3+
4+
#session{
5+
6+
7+
// ==========================================
8+
// MIDTERM CSS
9+
// ==========================================
10+
11+
//paste midterm here
12+
.workshop_creative_writing,.workshop_fine_arts,.workshop_performing_arts,.workshop_media_arts{
13+
width: 100%;
14+
float: left;
15+
margin-bottom: 4%;
16+
}
17+
.workshop_creative_writing h3,.workshop_fine_arts h3,.workshop_performing_arts h3,.workshop_media_arts h3{
18+
width: 100%;
19+
float: left;
20+
text-align: center;
21+
color: orangered;
22+
margin-top: 2%;
23+
background: orangered;
24+
color: #fff;
25+
}
26+
27+
.workshop_creative_writing h4,.workshop_fine_arts h4,.workshop_performing_arts h4,.workshop_media_arts h4{
28+
width: 100%;
29+
float: left;
30+
margin: 2% 0;
31+
}
32+
33+
.track1 {
34+
width: 100%;
35+
float: left;
36+
background-color: #d4b278;
37+
padding-bottom: 2%;
38+
padding-left: 3%;
39+
padding-right: 3%;
40+
}
41+
42+
.track2{
43+
width: 100%;
44+
float: left;
45+
background-color: #d5ae69;
46+
padding-bottom: 2%;
47+
padding-left: 3%;
48+
padding-right: 3%;
49+
}
50+
51+
52+
.track3{
53+
width: 100%;
54+
float: left;
55+
background-color:#d4a85c;
56+
padding-bottom: 2%;
57+
padding-left: 3%;
58+
padding-right: 3%;
59+
}
60+
61+
.track4{
62+
width: 100%;
63+
float: left;
64+
background-color: #d19d42;
65+
padding-bottom: 2%;
66+
padding-left: 3%;
67+
padding-right: 3%;
68+
}
69+
70+
.presenter{
71+
text-decoration: underline;
72+
font-size: 85%;
73+
font-style: italic;
74+
font-weight: bold;
75+
}
76+
77+
78+
// ==========================================
79+
// SMALL LAYOUT
80+
// ==========================================
81+
@include respond-to(small){
82+
83+
84+
85+
}
86+
//end small
87+
88+
89+
90+
// ==========================================
91+
// MEDIUM LAYOUT
92+
// ==========================================
93+
@include respond-to(medium){
94+
95+
.track1, .track2, .track3, .track4{
96+
@include cols(1,2);
97+
background-color: transparent;
98+
99+
h4{
100+
color:skyblue;
101+
}
102+
}
103+
.track3{
104+
clear:both;
105+
}
106+
107+
.track1, .track4{
108+
// background-color: #fff;
109+
}
110+
111+
}
112+
//end small
113+
114+
115+
116+
117+
// ==========================================
118+
// LARGE LAYOUT
119+
// ==========================================
120+
@include respond-to(large){
121+
122+
.workshop_creative_writing, .workshop_fine_arts, .workshop_performing_arts, .workshop_media_arts{
123+
@include cols(1,2);
124+
}
125+
126+
.track1, .track2, .track3, .track4{
127+
@include no-cols;
128+
}
129+
130+
}
131+
//end Large
132+
133+
134+
// ==========================================
135+
// x-LARGE LAYOUT
136+
// ==========================================
137+
@include respond-to(x-large){
138+
139+
.track1, .track2, .track3, .track4{
140+
@include cols(1,2);
141+
}
142+
143+
}
144+
//end Large
145+
146+
147+
148+
}
149+
//end session

‎sessions.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<link rel="stylesheet" href="css/style.css">
1111
</head>
1212

13-
<body id="sessions">
13+
<body id="session">
1414
<a id="top"></a>
1515
<div id="menuButton">
1616
<div class="menu">

0 commit comments

Comments
 (0)