Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
C
converse.js
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
converse.js
Commits
fa30f936
Commit
fa30f936
authored
Mar 11, 2018
by
JC Brand
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Use sass for the theme css
parent
bfc30818
Changes
3
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
516 additions
and
157 deletions
+516
-157
Makefile
Makefile
+4
-1
css/theme.css
css/theme.css
+134
-156
sass/theme.scss
sass/theme.scss
+378
-0
No files found.
Makefile
View file @
fa30f936
...
@@ -128,7 +128,7 @@ clean:
...
@@ -128,7 +128,7 @@ clean:
rm
css/
*
.map
rm
css/
*
.map
.PHONY
:
dev
.PHONY
:
dev
dev
:
gems
node_modules
dev
:
.bundle
node_modules
########################################################################
########################################################################
## Builds
## Builds
...
@@ -148,6 +148,9 @@ css/converse.css:: gems sass
...
@@ -148,6 +148,9 @@ css/converse.css:: gems sass
css/fonts.css
::
dev sass
css/fonts.css
::
dev sass
$(SASS)
-I
$(BOURBON)
sass/only-fonts.scss
$@
$(SASS)
-I
$(BOURBON)
sass/only-fonts.scss
$@
css/theme.css
::
dev sass
$(SASS)
-I
$(BOOTSTRAP)
sass/theme.scss
$@
css/%.min.css
::
css/%.css
css/%.min.css
::
css/%.css
make dev
make dev
$(CLEANCSS)
$<
>
$@
$(CLEANCSS)
$<
>
$@
...
...
css/theme.css
View file @
fa30f936
html
{
width
:
100%
;
height
:
100%
;
}
body
{
body
{
width
:
100%
;
width
:
100%
;
height
:
100%
;
height
:
100%
;
font-family
:
"Lora"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-family
:
"Lora"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
color
:
#ffffff
;
color
:
#ffffff
;
background-color
:
#211018
;
background-color
:
#211018
;
}
webkit-tap-highlight-color
:
rgba
(
255
,
255
,
255
,
0.2
);
}
body
.brand-heading
{
body
.brand-heading
{
margin
:
auto
;
margin
:
auto
;
font-size
:
6em
;
font-size
:
6em
;
font-weight
:
bold
;
font-weight
:
bold
;
}
}
body
.brand-heading
.icon-conversejs
{
font-size
:
0.88em
;
}
body
.brand-heading
.icon-conversejs
{
font-size
:
0.88em
;
}
html
{
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
width
:
100%
;
height
:
100%
;
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
0
35px
;
margin
:
0
0
35px
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-weight
:
700
;
font-weight
:
700
;
letter-spacing
:
1px
;
letter-spacing
:
1px
;
}
}
p
{
p
{
margin
:
0
0
25px
;
margin
:
0
0
25px
;
font-size
:
18px
;
font-size
:
18px
;
line-height
:
1.5
;
line-height
:
1.5
;
}
}
@media
(
min-width
:
767px
)
{
@media
(
min-width
:
767px
)
{
p
{
p
{
margin
:
0
0
35px
;
margin
:
0
0
35px
;
font-size
:
20px
;
font-size
:
20px
;
line-height
:
1.6
;
line-height
:
1.6
;
}
}
}
}
a
{
a
{
color
:
#82B397
;
color
:
#82B397
;
-webkit-transition
:
all
0.2s
ease-in-out
;
-webkit-transition
:
all
0.2s
ease-in-out
;
-moz-transition
:
all
0.2s
ease-in-out
;
-moz-transition
:
all
0.2s
ease-in-out
;
transition
:
all
0.2s
ease-in-out
;
transition
:
all
0.2s
ease-in-out
;
}
}
a
:hover
,
a
:hover
,
a
:focus
{
a
:focus
{
text-decoration
:
none
;
text-decoration
:
none
;
color
:
#00aaff
;
color
:
#00aaff
;
}
}
.converse-bg
{
.converse-bg
{
position
:
relative
;
position
:
relative
;
height
:
100vh
;
height
:
100vh
;
text-align
:
center
;
text-align
:
center
;
color
:
#fff
;
color
:
#fff
;
}
}
.light
{
.light
{
font-weight
:
400
;
font-weight
:
400
;
}
}
.navbar
{
.navbar
{
margin-bottom
:
0
;
margin-bottom
:
0
;
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0.3
);
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0.3
);
text-transform
:
uppercase
;
text-transform
:
uppercase
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
background-color
:
#211018
;
background-color
:
#211018
;
}
}
.navbar-brand
{
.navbar-brand
{
font-weight
:
700
;
font-weight
:
700
;
}
}
.navbar-brand
:focus
{
.navbar-brand
:focus
{
outline
:
none
;
outline
:
none
;
}
}
.navbar-custom
a
{
.navbar-custom
a
{
color
:
#ffffff
;
color
:
#ffffff
;
}
}
.navbar-custom
.nav
li
a
{
.navbar-custom
.nav
li
a
{
-webkit-transition
:
background
0.3s
ease-in-out
;
-webkit-transition
:
background
0.3s
ease-in-out
;
-moz-transition
:
background
0.3s
ease-in-out
;
-moz-transition
:
background
0.3s
ease-in-out
;
transition
:
background
0.3s
ease-in-out
;
transition
:
background
0.3s
ease-in-out
;
}
}
.navbar-custom
.nav
li
a
:hover
,
.navbar-custom
.nav
li
a
:hover
,
.navbar-custom
.nav
li
a
:focus
,
.navbar-custom
.nav
li
a
:focus
,
.navbar-custom
.nav
li
.active
{
.navbar-custom
.nav
li
.active
{
outline
:
none
;
outline
:
none
;
background-color
:
rgba
(
255
,
255
,
255
,
0.2
);
background-color
:
rgba
(
255
,
255
,
255
,
0.2
);
}
}
.navbar-toggle
{
.navbar-toggle
{
padding
:
4px
6px
;
padding
:
4px
6px
;
font-size
:
16px
;
font-size
:
16px
;
color
:
#ffffff
;
color
:
#ffffff
;
}
}
.navbar-toggle
:focus
,
.navbar-toggle
:focus
,
.navbar-toggle
:active
{
.navbar-toggle
:active
{
outline
:
none
;
outline
:
none
;
}
}
@media
(
min-width
:
767px
)
{
@media
(
min-width
:
767px
)
{
.navbar
{
.navbar
{
padding
:
20px
0
;
padding
:
20px
0
;
...
@@ -109,70 +96,63 @@ a:focus {
...
@@ -109,70 +96,63 @@ a:focus {
background
:
transparent
;
background
:
transparent
;
-webkit-transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
-webkit-transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
-moz-transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
-moz-transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
transition
:
background
0.5s
ease-in-out
,
padding
0.5s
ease-in-out
;
}
}
.top-nav-collapse
{
.top-nav-collapse
{
padding
:
0
;
padding
:
0
;
background-color
:
#211018
;
background-color
:
#211018
;
}
}
.navbar-custom.top-nav-collapse
{
.navbar-custom.top-nav-collapse
{
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0.3
);
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0.3
);
}
}
}
}
@media
(
max-width
:
480px
)
{
@media
(
max-width
:
480px
)
{
.navbar
{
.navbar
{
display
:
none
;
display
:
none
;
}
}
}
}
.features-section
,
.features-section
,
.outro
,
.outro
,
.intro
{
.intro
{
width
:
100%
;
width
:
100%
;
padding
:
100px
0
;
padding
:
100px
0
;
text-align
:
center
;
text-align
:
center
;
color
:
#fff
;
color
:
#fff
;
}
}
.intro
{
.intro
{
background
:
url(images/header.jpg)
no-repeat
bottom
center
scroll
;
background
:
url(images/header.jpg)
no-repeat
bottom
center
scroll
;
background-color
:
#211018
;
background-color
:
#211018
;
-webkit-background-size
:
cover
;
-webkit-background-size
:
cover
;
-moz-background-size
:
cover
;
-moz-background-size
:
cover
;
background-size
:
cover
;
background-size
:
cover
;
-o-background-size
:
cover
;
-o-background-size
:
cover
;
}
}
.features-section
{
.features-section
{
background
:
url(
'images/bgtr.svg')
top
right
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/overlay.png')
,
linear-gradient
(
45deg
,
#85505f
,
#384955
,
#655361
);
background
:
url(
"images/bgtr.svg")
top
right
no-repeat
,
url("images/bgbl.svg")
bottom
left
no-repeat
,
url("images/bgbl.svg")
bottom
left
no-repeat
,
url("images/overlay.png")
,
linear-gradient
(
45deg
,
#85505f
,
#384955
,
#655361
);
}
}
.features-section
a
{
.features-section
a
{
color
:
#82B397
;
color
:
#82B397
;
}
}
.outro
{
.outro
{
background
:
url(
'images/bgtr.svg')
top
right
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/overlay.png')
,
linear-gradient
(
45deg
,
#384955
,
#655361
,
#85505f
);
background
:
url(
"images/bgtr.svg")
top
right
no-repeat
,
url("images/bgbl.svg")
bottom
left
no-repeat
,
url("images/overlay.png")
,
linear-gradient
(
45deg
,
#384955
,
#655361
,
#85505f
);
}
}
.brand-heading
{
.brand-heading
{
font-size
:
2em
;
font-size
:
2em
;
text-align
:
center
;
text-align
:
center
;
margin-top
:
2.5em
;
margin-top
:
2.5em
;
}
}
.brand-heading-embedded
{
.brand-heading-embedded
{
margin-top
:
1.5em
;
margin-top
:
1.5em
;
}
}
.intro-text
{
.intro-text
{
font-size
:
18px
;
font-size
:
18px
;
}
}
@media
(
min-width
:
767px
)
{
@media
(
min-width
:
767px
)
{
.intro
{
.intro
{
height
:
100%
;
height
:
100%
;
padding
:
0
;
padding
:
0
;
}
}
.brand-heading
{
.brand-heading
{
font-size
:
80px
;
font-size
:
80px
;
}
}
.intro-text
{
.intro-text
{
font-size
:
25px
;
font-size
:
25px
;
}
}
}
}
.btn-circle
{
.btn-circle
{
width
:
70px
;
width
:
70px
;
height
:
70px
;
height
:
70px
;
...
@@ -185,20 +165,20 @@ a:focus {
...
@@ -185,20 +165,20 @@ a:focus {
background
:
transparent
;
background
:
transparent
;
-webkit-transition
:
background
0.3s
ease-in-out
;
-webkit-transition
:
background
0.3s
ease-in-out
;
-moz-transition
:
background
0.3s
ease-in-out
;
-moz-transition
:
background
0.3s
ease-in-out
;
transition
:
background
0.3s
ease-in-out
;
transition
:
background
0.3s
ease-in-out
;
}
}
.btn-circle
:hover
,
.btn-circle
:hover
,
.btn-circle
:focus
{
.btn-circle
:focus
{
outline
:
none
;
outline
:
none
;
color
:
#ffffff
;
color
:
#ffffff
;
background
:
rgba
(
255
,
255
,
255
,
0.1
);
background
:
rgba
(
255
,
255
,
255
,
0.1
);
}
}
.page-scroll
.btn-circle
i
.animated
{
.page-scroll
.btn-circle
i
.animated
{
-webkit-transition-property
:
-webkit-transform
;
-webkit-transition-property
:
-webkit-transform
;
-webkit-transition-duration
:
1s
;
-webkit-transition-duration
:
1s
;
-moz-transition-property
:
-moz-transform
;
-moz-transition-property
:
-moz-transform
;
-moz-transition-duration
:
1s
;
-moz-transition-duration
:
1s
;
}
}
.page-scroll
.btn-circle
:hover
i
.animated
{
.page-scroll
.btn-circle
:hover
i
.animated
{
-webkit-animation-name
:
pulse
;
-webkit-animation-name
:
pulse
;
-moz-animation-name
:
pulse
;
-moz-animation-name
:
pulse
;
...
@@ -207,8 +187,8 @@ a:focus {
...
@@ -207,8 +187,8 @@ a:focus {
-webkit-animation-iteration-count
:
infinite
;
-webkit-animation-iteration-count
:
infinite
;
-moz-animation-iteration-count
:
infinite
;
-moz-animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
-webkit-animation-timing-function
:
linear
;
-moz-animation-timing-function
:
linear
;
-moz-animation-timing-function
:
linear
;
}
}
/*
/*
@-webkit-keyframes pulse {
@-webkit-keyframes pulse {
0 {
0 {
...
@@ -240,64 +220,58 @@ a:focus {
...
@@ -240,64 +220,58 @@ a:focus {
}
}
*/
*/
.content-section
{
.content-section
{
padding-top
:
100px
;
padding-top
:
100px
;
}
}
.donate-section
{
.donate-section
{
width
:
100%
;
width
:
100%
;
padding
:
50px
0
;
padding
:
50px
0
;
color
:
#ffffff
;
color
:
#ffffff
;
background-color
:
#211018
;
background-color
:
#211018
;
}
}
.donate-section
p
.bitcoin-header
{
.donate-section
p
.bitcoin-header
{
margin
:
0
0
5px
;
margin
:
0
0
5px
;
}
}
@media
(
min-width
:
767px
)
{
@media
(
min-width
:
767px
)
{
.content-section
{
.content-section
{
padding-top
:
150px
;
padding-top
:
150px
;
padding-bottom
:
50px
;
padding-bottom
:
50px
;
}
}
.donate-section
{
.donate-section
{
padding
:
100px
0
;
padding
:
100px
0
;
}
}
}
}
.banner-social-buttons
{
.banner-social-buttons
{
padding-top
:
3em
;
padding-top
:
3em
;
}
}
::-moz-selection
{
::-moz-selection
{
text-shadow
:
none
;
text-shadow
:
none
;
background
:
#fcfcfc
;
background
:
#fcfcfc
;
background
:
rgba
(
255
,
255
,
255
,
0.2
);
background
:
rgba
(
255
,
255
,
255
,
0.2
);
}
}
::selection
{
::selection
{
text-shadow
:
none
;
text-shadow
:
none
;
background
:
#fcfcfc
;
background
:
#fcfcfc
;
background
:
rgba
(
255
,
255
,
255
,
0.2
);
background
:
rgba
(
255
,
255
,
255
,
0.2
);
}
}
img
::selection
{
img
::selection
{
background
:
transparent
;
background
:
transparent
;
}
}
img
::-moz-selection
{
img
::-moz-selection
{
background
:
transparent
;
background
:
transparent
;
}
}
body
{
webkit-tap-highlight-color
:
rgba
(
255
,
255
,
255
,
0.2
);
}
ul
.contact
,
ul
.contact
,
ul
.integration
,
ul
.integration
,
ul
.screencasts
,
ul
.screencasts
,
ul
.features
{
ul
.features
{
text-align
:
left
;
text-align
:
left
;
font-size
:
19px
;
font-size
:
19px
;
}
}
.feature-icon
{
.feature-icon
{
display
:
inline-block
;
display
:
inline-block
;
position
:
relative
;
position
:
relative
;
padding-bottom
:
5em
;
padding-bottom
:
5em
;
margin-bottom
:
2.75em
;
margin-bottom
:
2.75em
;
cursor
:
default
;
cursor
:
default
;
color
:
#fff
;
color
:
#fff
;
}
}
.feature-icon
.fa
{
.feature-icon
.fa
{
display
:
inline-block
;
display
:
inline-block
;
width
:
2em
;
width
:
2em
;
height
:
2em
;
height
:
2em
;
...
@@ -305,8 +279,8 @@ ul.features {
...
@@ -305,8 +279,8 @@ ul.features {
border-radius
:
100%
;
border-radius
:
100%
;
box-shadow
:
inset
0
0
0
1px
white
;
box-shadow
:
inset
0
0
0
1px
white
;
color
:
white
;
color
:
white
;
line-height
:
2.1em
;
line-height
:
2.1em
;
}
}
.feature-icon
:before
{
.feature-icon
:before
{
content
:
''
;
content
:
''
;
background
:
white
;
background
:
white
;
...
@@ -317,8 +291,8 @@ ul.features {
...
@@ -317,8 +291,8 @@ ul.features {
width
:
0.65em
;
width
:
0.65em
;
height
:
0.65em
;
height
:
0.65em
;
display
:
block
;
display
:
block
;
border-radius
:
100%
;
border-radius
:
100%
;
}
}
.feature-icon
:after
{
.feature-icon
:after
{
content
:
''
;
content
:
''
;
position
:
absolute
;
position
:
absolute
;
...
@@ -327,35 +301,39 @@ ul.features {
...
@@ -327,35 +301,39 @@ ul.features {
width
:
1px
;
width
:
1px
;
height
:
4.35em
;
height
:
4.35em
;
background
:
white
;
background
:
white
;
margin-left
:
-0.5px
;
margin-left
:
-0.5px
;
}
}
.row
{
.row
{
margin-left
:
0
;
margin-left
:
0
;
margin-right
:
0
;
margin-right
:
0
;
}
}
.mastodon
{
.mastodon
{
width
:
4em
;
width
:
4em
;
height
:
4em
;
height
:
4em
;
margin-top
:
0.9em
;
margin-top
:
0.9em
;
}
}
.sponsors
{
.sponsors
{
clear
:
both
;
clear
:
both
;
font-size
:
1.4em
;
font-size
:
1.4em
;
padding
:
2em
0
6em
0
;
padding
:
2em
0
6em
0
;
}
}
.sponsors
h2
{
.sponsors
h2
{
text-align
:
center
;
text-align
:
center
;
}
}
.sponsors
ul
{
.sponsors
ul
{
margin
:
0
0
1em
0
;
margin
:
0
0
1em
0
;
}
}
.sponsors
ul
li
{
.sponsors
ul
li
{
margin
:
1em
0
;
margin
:
1em
0
;
list-style
:
none
;
list-style
:
none
;
}
}
.sponsors-text
{
.sponsors-text
{
text-align
:
left
;
text-align
:
left
;
padding
:
0
0
2em
0
;
padding
:
0
0
2em
0
;
}
}
@media
(
max-width
:
767.98px
)
{
.intro
{
padding
:
0
;
height
:
100vh
;
}
}
/*# sourceMappingURL=theme.css.map */
sass/theme.scss
0 → 100644
View file @
fa30f936
@import
"bootstrap/scss/functions"
;
@import
"bootstrap/scss/variables"
;
@import
"bootstrap/scss/mixins"
;
html
{
width
:
100%
;
height
:
100%
;
}
body
{
width
:
100%
;
height
:
100%
;
font-family
:
"Lora"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
color
:
#ffffff
;
background-color
:
#211018
;
webkit-tap-highlight-color
:
rgba
(
255
,
255
,
255
,
0
.2
);
.brand-heading
{
margin
:
auto
;
font-size
:
6em
;
font-weight
:
bold
;
}
.brand-heading
.icon-conversejs
{
font-size
:
0
.88em
;
}
}
h1
,
h2
,
h3
,
h4
,
h5
,
h6
{
margin
:
0
0
35px
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-weight
:
700
;
letter-spacing
:
1px
;
}
p
{
margin
:
0
0
25px
;
font-size
:
18px
;
line-height
:
1
.5
;
}
@media
(
min-width
:
767px
)
{
p
{
margin
:
0
0
35px
;
font-size
:
20px
;
line-height
:
1
.6
;
}
}
a
{
color
:
#82B397
;
-webkit-transition
:
all
0
.2s
ease-in-out
;
-moz-transition
:
all
0
.2s
ease-in-out
;
transition
:
all
0
.2s
ease-in-out
;
}
a
:hover
,
a
:focus
{
text-decoration
:
none
;
color
:
#00aaff
;
}
.converse-bg
{
position
:
relative
;
height
:
100vh
;
text-align
:
center
;
color
:
#fff
;
}
.light
{
font-weight
:
400
;
}
.navbar
{
margin-bottom
:
0
;
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0
.3
);
text-transform
:
uppercase
;
font-family
:
"Montserrat"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
background-color
:
#211018
;
}
.navbar-brand
{
font-weight
:
700
;
}
.navbar-brand
:focus
{
outline
:
none
;
}
.navbar-custom
a
{
color
:
#ffffff
;
}
.navbar-custom
.nav
li
a
{
-webkit-transition
:
background
0
.3s
ease-in-out
;
-moz-transition
:
background
0
.3s
ease-in-out
;
transition
:
background
0
.3s
ease-in-out
;
}
.navbar-custom
.nav
li
a
:hover
,
.navbar-custom
.nav
li
a
:focus
,
.navbar-custom
.nav
li
.active
{
outline
:
none
;
background-color
:
rgba
(
255
,
255
,
255
,
0
.2
);
}
.navbar-toggle
{
padding
:
4px
6px
;
font-size
:
16px
;
color
:
#ffffff
;
}
.navbar-toggle
:focus
,
.navbar-toggle
:active
{
outline
:
none
;
}
@media
(
min-width
:
767px
)
{
.navbar
{
padding
:
20px
0
;
border-bottom
:
none
;
letter-spacing
:
1px
;
background
:
transparent
;
-webkit-transition
:
background
0
.5s
ease-in-out
,
padding
0
.5s
ease-in-out
;
-moz-transition
:
background
0
.5s
ease-in-out
,
padding
0
.5s
ease-in-out
;
transition
:
background
0
.5s
ease-in-out
,
padding
0
.5s
ease-in-out
;
}
.top-nav-collapse
{
padding
:
0
;
background-color
:
#211018
;
}
.navbar-custom.top-nav-collapse
{
border-bottom
:
1px
solid
rgba
(
255
,
255
,
255
,
0
.3
);
}
}
@media
(
max-width
:
480px
)
{
.navbar
{
display
:
none
;
}
}
.features-section
,
.outro
,
.intro
{
width
:
100%
;
padding
:
100px
0
;
text-align
:
center
;
color
:
#fff
;
}
.intro
{
background
:
url(images/header.jpg)
no-repeat
bottom
center
scroll
;
background-color
:
#211018
;
-webkit-background-size
:
cover
;
-moz-background-size
:
cover
;
background-size
:
cover
;
-o-background-size
:
cover
;
}
.features-section
{
background
:
url('images/bgtr.svg')
top
right
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/overlay.png')
,
linear-gradient
(
45deg
,
#85505f
,
#384955
,
#655361
);
}
.features-section
a
{
color
:
#82B397
;
}
.outro
{
background
:
url('images/bgtr.svg')
top
right
no-repeat
,
url('images/bgbl.svg')
bottom
left
no-repeat
,
url('images/overlay.png')
,
linear-gradient
(
45deg
,
#384955
,
#655361
,
#85505f
);
}
.brand-heading
{
font-size
:
2em
;
text-align
:
center
;
margin-top
:
2
.5em
;
}
.brand-heading-embedded
{
margin-top
:
1
.5em
;
}
.intro-text
{
font-size
:
18px
;
}
@media
(
min-width
:
767px
)
{
.intro
{
height
:
100%
;
padding
:
0
;
}
.brand-heading
{
font-size
:
80px
;
}
.intro-text
{
font-size
:
25px
;
}
}
.btn-circle
{
width
:
70px
;
height
:
70px
;
margin-top
:
15px
;
padding
:
7px
16px
;
border
:
2px
solid
#ffffff
;
border-radius
:
35px
;
font-size
:
40px
;
color
:
#ffffff
;
background
:
transparent
;
-webkit-transition
:
background
0
.3s
ease-in-out
;
-moz-transition
:
background
0
.3s
ease-in-out
;
transition
:
background
0
.3s
ease-in-out
;
}
.btn-circle
:hover
,
.btn-circle
:focus
{
outline
:
none
;
color
:
#ffffff
;
background
:
rgba
(
255
,
255
,
255
,
0
.1
);
}
.page-scroll
.btn-circle
i
.animated
{
-webkit-transition-property
:
-
webkit-transform
;
-webkit-transition-duration
:
1s
;
-moz-transition-property
:
-
moz-transform
;
-moz-transition-duration
:
1s
;
}
.page-scroll
.btn-circle
:hover
i
.animated
{
-webkit-animation-name
:
pulse
;
-moz-animation-name
:
pulse
;
-webkit-animation-duration
:
1
.5s
;
-moz-animation-duration
:
1
.5s
;
-webkit-animation-iteration-count
:
infinite
;
-moz-animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
-moz-animation-timing-function
:
linear
;
}
/*
@-webkit-keyframes pulse {
0 {
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@-moz-keyframes pulse {
0 {
-moz-transform: scale(1);
transform: scale(1);
}
50% {
-moz-transform: scale(1.2);
transform: scale(1.2);
}
100% {
-moz-transform: scale(1);
transform: scale(1);
}
}
*/
.content-section
{
padding-top
:
100px
;
}
.donate-section
{
width
:
100%
;
padding
:
50px
0
;
color
:
#ffffff
;
background-color
:
#211018
;
}
.donate-section
p
.bitcoin-header
{
margin
:
0
0
5px
;
}
@media
(
min-width
:
767px
)
{
.content-section
{
padding-top
:
150px
;
padding-bottom
:
50px
;
}
.donate-section
{
padding
:
100px
0
;
}
}
.banner-social-buttons
{
padding-top
:
3em
;
}
::-moz-selection
{
text-shadow
:
none
;
background
:
#fcfcfc
;
background
:
rgba
(
255
,
255
,
255
,
0
.2
);
}
::selection
{
text-shadow
:
none
;
background
:
#fcfcfc
;
background
:
rgba
(
255
,
255
,
255
,
0
.2
);
}
img
:
:
selection
{
background
:
transparent
;
}
img
:
:-
moz-selection
{
background
:
transparent
;
}
ul
.contact
,
ul
.integration
,
ul
.screencasts
,
ul
.features
{
text-align
:
left
;
font-size
:
19px
;
}
.feature-icon
{
display
:
inline-block
;
position
:
relative
;
padding-bottom
:
5em
;
margin-bottom
:
2
.75em
;
cursor
:
default
;
color
:
#fff
;
.fa
{
display
:
inline-block
;
width
:
2em
;
height
:
2em
;
font-size
:
4em
;
border-radius
:
100%
;
box-shadow
:
inset
0
0
0
1px
white
;
color
:
white
;
line-height
:
2
.1em
;
}
}
.feature-icon
:before
{
content
:
''
;
background
:
white
;
position
:
absolute
;
bottom
:
0
;
left
:
50%
;
margin-left
:
-0
.325em
;
width
:
0
.65em
;
height
:
0
.65em
;
display
:
block
;
border-radius
:
100%
;
}
.feature-icon
:after
{
content
:
''
;
position
:
absolute
;
left
:
50%
;
bottom
:
0
.65em
;
width
:
1px
;
height
:
4
.35em
;
background
:
white
;
margin-left
:
-0
.5px
;
}
.row
{
margin-left
:
0
;
margin-right
:
0
;
}
.mastodon
{
width
:
4em
;
height
:
4em
;
margin-top
:
0
.9em
;
}
.sponsors
{
clear
:
both
;
font-size
:
1
.4em
;
padding
:
2em
0
6em
0
;
}
.sponsors
h2
{
text-align
:
center
;
}
.sponsors
ul
{
margin
:
0
0
1em
0
;
}
.sponsors
ul
li
{
margin
:
1em
0
;
list-style
:
none
;
}
.sponsors-text
{
text-align
:
left
;
padding
:
0
0
2em
0
;
}
@include
media-breakpoint-down
(
sm
)
{
.intro
{
padding
:
0
;
height
:
100vh
;
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment