Skip to content

Commit a61a372

Browse files
hakimelhakimel
committed
use nesting for fragment styles
1 parent a3a2ad0 commit a61a372

2 files changed

Lines changed: 62 additions & 63 deletions

File tree

‎css/reveal.css‎

Lines changed: 31 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -51,70 +51,67 @@ body {
5151
visibility: hidden;
5252
-webkit-transition: all 0.2s ease;
5353
transition: all 0.2s ease; }
54-
55-
.reveal .slides section .fragment.visible {
56-
opacity: 1;
57-
visibility: visible; }
54+
.reveal .slides section .fragment.visible {
55+
opacity: 1;
56+
visibility: visible; }
5857

5958
.reveal .slides section .fragment.grow {
6059
opacity: 1;
6160
visibility: visible; }
62-
63-
.reveal .slides section .fragment.grow.visible {
64-
-webkit-transform: scale(1.3);
65-
-ms-transform: scale(1.3);
66-
transform: scale(1.3); }
61+
.reveal .slides section .fragment.grow.visible {
62+
-webkit-transform: scale(1.3);
63+
-ms-transform: scale(1.3);
64+
transform: scale(1.3); }
6765

6866
.reveal .slides section .fragment.shrink {
6967
opacity: 1;
7068
visibility: visible; }
71-
72-
.reveal .slides section .fragment.shrink.visible {
73-
-webkit-transform: scale(0.7);
74-
-ms-transform: scale(0.7);
75-
transform: scale(0.7); }
69+
.reveal .slides section .fragment.shrink.visible {
70+
-webkit-transform: scale(0.7);
71+
-ms-transform: scale(0.7);
72+
transform: scale(0.7); }
7673

7774
.reveal .slides section .fragment.zoom-in {
7875
-webkit-transform: scale(0.1);
7976
-ms-transform: scale(0.1);
8077
transform: scale(0.1); }
81-
82-
.reveal .slides section .fragment.zoom-in.visible {
83-
-webkit-transform: scale(1);
84-
-ms-transform: scale(1);
85-
transform: scale(1); }
78+
.reveal .slides section .fragment.zoom-in.visible {
79+
-webkit-transform: scale(1);
80+
-ms-transform: scale(1);
81+
transform: scale(1); }
8682

8783
.reveal .slides section .fragment.roll-in {
8884
-webkit-transform: rotateX(90deg);
8985
transform: rotateX(90deg); }
90-
91-
.reveal .slides section .fragment.roll-in.visible {
92-
-webkit-transform: rotateX(0);
93-
transform: rotateX(0); }
86+
.reveal .slides section .fragment.roll-in.visible {
87+
-webkit-transform: rotateX(0);
88+
transform: rotateX(0); }
9489

9590
.reveal .slides section .fragment.fade-out {
9691
opacity: 1;
9792
visibility: visible; }
98-
99-
.reveal .slides section .fragment.fade-out.visible {
100-
opacity: 0;
101-
visibility: hidden; }
93+
.reveal .slides section .fragment.fade-out.visible {
94+
opacity: 0;
95+
visibility: hidden; }
10296

10397
.reveal .slides section .fragment.semi-fade-out {
10498
opacity: 1;
10599
visibility: visible; }
100+
.reveal .slides section .fragment.semi-fade-out.visible {
101+
opacity: 0.5;
102+
visibility: visible; }
106103

107-
.reveal .slides section .fragment.semi-fade-out.visible {
108-
opacity: 0.5;
109-
visibility: visible; }
104+
.reveal .slides section .fragment.strike {
105+
opacity: 1; }
106+
.reveal .slides section .fragment.strike.visible {
107+
text-decoration: line-through; }
110108

111109
.reveal .slides section .fragment.current-visible {
112110
opacity: 0;
113111
visibility: hidden; }
114-
115-
.reveal .slides section .fragment.current-visible.current-fragment {
116-
opacity: 1;
117-
visibility: visible; }
112+
.reveal .slides section .fragment.current-visible.current-fragment {
113+
opacity: 1;
114+
visibility: visible; }
118115

119116
.reveal .slides section .fragment.highlight-red, .reveal .slides section .fragment.highlight-current-red, .reveal .slides section .fragment.highlight-green, .reveal .slides section .fragment.highlight-current-green, .reveal .slides section .fragment.highlight-blue, .reveal .slides section .fragment.highlight-current-blue {
120117
opacity: 1;
@@ -138,12 +135,6 @@ body {
138135
.reveal .slides section .fragment.highlight-current-blue.current-fragment {
139136
color: #1b91ff; }
140137

141-
.reveal .slides section .fragment.strike {
142-
opacity: 1; }
143-
144-
.reveal .slides section .fragment.strike.visible {
145-
text-decoration: line-through; }
146-
147138
/*********************************************
148139
* DEFAULT ELEMENT STYLES
149140
*********************************************/

‎css/reveal.scss‎

Lines changed: 31 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -78,69 +78,84 @@ body {
7878
opacity: 0;
7979
visibility: hidden;
8080
transition: all .2s ease;
81-
}
82-
.reveal .slides section .fragment.visible {
81+
82+
&.visible {
8383
opacity: 1;
8484
visibility: visible;
8585
}
86+
}
8687

8788
.reveal .slides section .fragment.grow {
8889
opacity: 1;
8990
visibility: visible;
90-
}
91-
.reveal .slides section .fragment.grow.visible {
91+
92+
&.visible {
9293
transform: scale( 1.3 );
9394
}
95+
}
9496

9597
.reveal .slides section .fragment.shrink {
9698
opacity: 1;
9799
visibility: visible;
98-
}
99-
.reveal .slides section .fragment.shrink.visible {
100+
101+
&.visible {
100102
transform: scale( 0.7 );
101103
}
104+
}
102105

103106
.reveal .slides section .fragment.zoom-in {
104107
transform: scale( 0.1 );
105-
}
106108

107-
.reveal .slides section .fragment.zoom-in.visible {
109+
&.visible {
108110
transform: scale( 1 );
109111
}
112+
}
110113

111114
.reveal .slides section .fragment.roll-in {
112115
transform: rotateX( 90deg );
113-
}
114-
.reveal .slides section .fragment.roll-in.visible {
116+
117+
&.visible {
115118
transform: rotateX( 0 );
116119
}
120+
}
117121

118122
.reveal .slides section .fragment.fade-out {
119123
opacity: 1;
120124
visibility: visible;
121-
}
122-
.reveal .slides section .fragment.fade-out.visible {
125+
126+
&.visible {
123127
opacity: 0;
124128
visibility: hidden;
125129
}
130+
}
126131

127132
.reveal .slides section .fragment.semi-fade-out {
128133
opacity: 1;
129134
visibility: visible;
130-
}
131-
.reveal .slides section .fragment.semi-fade-out.visible {
135+
136+
&.visible {
132137
opacity: 0.5;
133138
visibility: visible;
134139
}
140+
}
141+
142+
.reveal .slides section .fragment.strike {
143+
opacity: 1;
144+
145+
&.visible {
146+
text-decoration: line-through;
147+
}
148+
}
135149

136150
.reveal .slides section .fragment.current-visible {
137151
opacity: 0;
138152
visibility: hidden;
139-
}
140-
.reveal .slides section .fragment.current-visible.current-fragment {
153+
154+
&.current-fragment {
141155
opacity: 1;
142156
visibility: visible;
143157
}
158+
}
144159

145160
.reveal .slides section .fragment.highlight-red,
146161
.reveal .slides section .fragment.highlight-current-red,
@@ -171,13 +186,6 @@ body {
171186
color: #1b91ff;
172187
}
173188

174-
.reveal .slides section .fragment.strike {
175-
opacity: 1;
176-
}
177-
.reveal .slides section .fragment.strike.visible {
178-
text-decoration: line-through;
179-
}
180-
181189

182190
/*********************************************
183191
* DEFAULT ELEMENT STYLES

0 commit comments

Comments
 (0)