Alerts
Table of contents
Evaluation
#1 - Main Website
None
#2 - Extensions
Screenshot
Elements
- Image
- Links
- Text
Typography
- font-family:
Cantarell, 'Droid Sans', Ubuntu, 'DejaVu Sans', Arial, sans-serif
- font-size:
14px
Colors
- background-color:
#ccf
- text-color:
#2e3436
- border-color:
#2121214d
Spacing
- margin-bottom:
1em
- line-height:
1.6
- min-height:
42px
- display:
block
- padding:
0.5em
- margin:
0 auto
- padding-left:
72px
- background-position:
16px center
- border:
1px solid
- box-sizing:
content-box
Screenshot
Elements
- Links
- Text
Typography
- font-family:
Cantarell, 'Droid Sans', Ubuntu, 'DejaVu Sans', Arial, sans-serif
- font-size:
14px
Colors
- background-color:
#eeeeec
- text-color:
#555555
- border-color:
#babdb6
Spacing
- border:
1px solid
- border-radius:
8px
- box-shadow:
0 1px 3px rgb(0 0 0 / 10%)
- padding:
20px
- margin:
20px 4px 4px 4px
- line-height:
1.6
#3 - Events Portal
Screenshot
Elements
- Image
- Text
Typography
- font-family:
'Helvetica Neue', Helvetica, Verdana, Arial, sans-serif
- font-size:
13px
Colors
- background-color:
#edf3fd
- border-color:
#007cac
- text-color:
#777777
Spacing
- padding:
10px
- margin-bottom:
18px
- line-height:
normal
- display:
flex
- border-radius:
2px
- line-height:
18.5705px
- border:
1px solid
Screenshot
Elements
- Text
- Image
- Link
Typography
- font-family:
'Roboto', sans-serif
- font-size:
14px
Colors
- background:
#edf3fd
- header-text-color:
#0099cc
- text-color:
#777777
- border-color:
rgb(0, 153, 204)
Spacing
- border:
1px solid #09c
- border-width:
1px
- border-style:
solid
- box-sizing:
border-box
- margin-bottom:
1rem
- padding:
10px
- width:
100
- border-radius:
2px
- line-height:
18.5705px
- align-items:
center
- display:
flex
Screenshot
Elements
- Text
Typography
- font-family:
'Roboto', sans-serif
- font-size:
18px
- header-font-size:
21.6px
Colors
- background:
#edf3fd
- text-color:
#777777
- header-color:
#cb6d04
- border-color:
rgb(0, 153, 204)
Spacing
- border:
1px solid #09c
- border-width:
1px
- border-style:
solid
- padding:
10px
- width:
100%
- margin-top:
0
- margin-bottom:
0em
- line-height:
18.5705px
Screenshot
Elements
- Image
- Link
- Text
Typography
- font-family:
'Roboto', sans-serif
- font-size:
14px
Colors
- background:
#edf3fd
- header-text-color:
#0099cc
- text-color:
#555555
- border-color:
rgb(0, 153, 204)
Spacing
- border:
1px solid #09c
- border-width:
1px
- border-style:
solid
- margin-bottom:
1rem
- padding:
10px
- border-radius:
2px
- align-items:
center
- line-height:
18.5705px
Screenshot
Elements
- Text
- Image
Typography
- font-family:
'Roboto', sans-serif
- font-size:
16.8px
- font-size:
14px
Colors
- background-color:
#f2dede
- border: 1px solid
#c00
- text-color:
#777
Spacing
- padding:
10px
- margin-bottom:
18px
- line-height:
normal
- display:
flex
- max-width:
800px
- border-radius:
2px
- align-self:
center
#4 - Planet
Screenshot
Elements
- Image
- Link
- Text
Typography
- font-family:
Source Sans Pro,Cantarell,Droid Sans,Ubuntu,DejaVu Sans,Arial,sans-serif
- font-size:
12px
Colors
- background:
#4cae4c
- color:
#ffffff
- background-image:
linear-gradient(to bottom, #73d216 0%, #4cae4c 100%)
- border-color:
#555753
Spacing
- padding:
0 10px
- box-sizing:
border-box
- line-height:
1.42857
- text-align:
center
- display:
inline-block
- margin:
0 0 10px
- border:
1px solid
#5 - Discourse
Screenshot
Elements
- Image
- Text
Typography
- font-family:
Source Sans Pro,Cantarell,Droid Sans,Ubuntu,DejaVu Sans,Arial,sans-serif
- font-size:
15.008px
Colors
- background:
#052e3d
- color:
#ddd
Spacing
- padding:
0.5em 1em
- z-index:
2
- margin-bottom:
1em
- max-height:
250px
- overflow:
auto
- line-height:
1.4
#6 - Developer Center
Screenshot
Elements
- Image
- Text
Typography
- font-family:
Cantarell, -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif
- font-size:
14.625px
Colors
- border-left-color:
#00c852
- background:
#18181a
- text-color:
#ffffffcc
- box-shadow:
0 0.2rem 0.5rem rgb(0 0 0 / 5%), 0 0 0.0625rem rgb(0 0 0 / 10%)
Spacing
- border-left:
0.2rem solid
- margin:
1rem auto
- padding:
0 0.5rem 0.5rem
- line-height:
1.5
Screenshot
Elements
- Image
- Link
- Text
Typography
- font-family:
Source Sans Pro,Cantarell,Droid Sans,Ubuntu,DejaVu Sans,Arial,sans-serif
- font-size:
12px
Colors
- background:
#4cae4c
- text-color:
#ffffffcc
- background-image:
linear-gradient(to bottom, #73d216 0%, #4cae4c 100%)
- border-color:
#555753
Spacing
- padding:
0 10px
- box-sizing:
border-box
- line-height:
1.42857
- text-align:
center
- display:
inline-block
- margin:
0 0 10px
- border:
1px solid
Screenshot
Elements
- Image
- Link
- Text
Typography
- font-family:
font-family: Cantarell, -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif
- font-size:
0.8125rem
- font-weight:
400
Colors
- border-left-color:
#448aff
- background:
#18181a
- text-color:
#ffffffcc
- background:
#448aff 10%
Spacing
- border-left:
0.2rem solid
- margin:
1rem auto
- padding:
0 0.5rem 0.5rem
- border-radius:
0.2rem
- box-shadow:
0 0.2rem 0.5rem rgb(0 0 0 / 5%), 0 0 0.0625rem rgb(0 0 0 / 10%)
- line-height:
1.5
Screenshot
Elements
- Image
- Text
Typography
- font-family:
font-family: Cantarell, -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif
- font-size:
0.8125rem
- font-weight:
400
Colors
- border-left-color:
#00b0ff
- background:
#18181a
- background:
#00b0ff 10%
- text-color:
#ffffffcc
Spacing
- border-left:
0.2rem solid
- margin:
1rem auto
- padding:
0 0.5rem 0.5rem
- border-radius:
0.2rem
- box-shadow:
0 0.2rem 0.5rem rgb(0 0 0 / 5%), 0 0 0.0625rem rgb(0 0 0 / 10%)
- line-height:
1.5
Screenshot
Elements
- Image
- Text
Typography
- font-family:
Cantarell, -apple-system, BlinkMacSystemFont, "Helvetica", sans-serif
- font-size:
0.8125rem
- font-weight:
400
Colors
- border-left-color:
#00c852
- background:
#18181a
- background:
#00b0ff 10%
- text-color:
#ffffffcc
Spacing
- border-left:
0.2rem solid
- margin:
1rem auto
- padding:
0 0.5rem 0.5rem
- border-radius:
0.2rem
- box-shadow:
0 0.2rem 0.5rem rgb(0 0 0 / 5%), 0 0 0.0625rem rgb(0 0 0 / 10%)
- line-height:
1.5
#7 - Wiki
Screenshot
Elements
- Text
Typography
- font-family:
Source Sans Pro', sans-serif
- font-size:
13.6px
Colors
- background-color:
#eee
- text-color:
#808080
- text-color:
#0000ff
Spacing
- margin-left:
auto
- margin-right:
auto
- margin-top:
20px
- padding:
0.5em
- border-bottom:
2px solid #cccccc
- border-radius:
10px
- width:
40em
- font-family:
'Source Sans Pro', sans-serif
- line-height:
1.4
#8 - Apps
None
#9 - Forty
None
#10 - Os
None
#11 - Circle
None
#12 - Release
None
Mockups
Standard Version
Without Fixing a Min-Width.
Padding
Padding is set to 1rem on all sides and between all elements.
Edited by Pooja Patel