apitech
/
Rocket.Chat
mirror of https://github.com/RocketChat/Rocket.Chat
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #1 from rcaferati/master

Browse Source 
Refactored and reorganised entire css/less files and logic.
pull/5/head
rcaferati 10 years ago
parent 1f072dfa6a 3040906335
commit e03d2b44cc
7 changed files with 613 additions and 751 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 22
      client/lib/flexTab.coffee
  2. 176
      client/lib/modal.coffee
  3. 1030
      client/stylesheets/base.less
  4. 102
      client/stylesheets/utils/_keyframes.import.less
  5. 28
      client/stylesheets/utils/_reset.import.less
  6. 2
      client/views/login/services.html
  7. 4
      client/views/modal.html

22
client/lib/flexTab.coffee
Unescape View File

@ -1,13 +1,13 @@
@FlexTab = (->
check = ->
$flex = $("section.flex-tab")
if $flex.length
$search = $flex.find ".search-form"
if $search.length
$siblings = $search.siblings("a")
if $siblings.length
width = ($siblings.outerWidth() + $siblings.css("marginLeft").replace("px","") * 2) * $siblings.length + 1
$search.css
width: "calc(100% - #{width}px)"
check: check
check = ->
$flex = $("section.flex-tab")
if $flex.length
$search = $flex.find ".search-form"
if $search.length
$siblings = $search.siblings("a")
if $siblings.length
width = ($siblings.outerWidth() + $siblings.css("marginLeft").replace("px","") * 2) * $siblings.length + 1
$search.css
width: "calc(100% - #{width}px)"
check: check
)()

176
client/lib/modal.coffee
Unescape View File

@ -1,102 +1,102 @@
@Modal = (->
self = {}
win = $(window)
self = {}
win = $(window)
#mistérios da vida c.483: Pq a self.$window diz ter 100% da janela via css mas na verdade ocupa menos de 100% da tela?
#isso impede que o retorno da janela ao normal quando não mais necessária a classe fluid. (comportamento dançante)
#mistérios da vida c.483: Pq a self.$window diz ter 100% da janela via css mas na verdade ocupa menos de 100% da tela?
#isso impede que o retorno da janela ao normal quando não mais necessária a classe fluid. (comportamento dançante)
focus = ->
if self.$modal
input = self.$modal.find "input[type='text']"
input.get(0).focus() if input.length
keydown = (e) ->
k = e.which
if k is 27
e.preventDefault()
e.stopImmediatePropagation()
close()
focus = ->
if self.$modal
input = self.$modal.find "input[type='text']"
input.get(0).focus() if input.length
keydown = (e) ->
k = e.which
if k is 27
e.preventDefault()
e.stopImmediatePropagation()
close()
check = ->
if self.$modal and self.$modal.length
if win.height() < self.$window.outerHeight() + (win.height() * 0.10)
unless self.$modal.hasClass("fluid")
self.$modal.addClass("fluid")
#else
#if self.$modal.hasClass("fluid")
#self.$modal.removeClass("fluid")
check = ->
if self.$modal and self.$modal.length
if win.height() < self.$window.outerHeight() + (win.height() * 0.10)
unless self.$modal.hasClass("fluid")
self.$modal.addClass("fluid")
#else
#if self.$modal.hasClass("fluid")
#self.$modal.removeClass("fluid")
open = (template, params) ->
params = params or {}
Rocket.animeBack self.$modal, ->
focus()
self.opened = 1
startListening() if params.listening
setContent template, params.data if template?
self.$modal.addClass "opened"
self.$modal.removeClass "fluid"
setTimeout ->
focus()
,200
open = (template, params) ->
params = params or {}
Rocket.animeBack self.$modal, ->
focus()
self.opened = 1
startListening() if params.listening
setContent template, params.data if template?
self.$modal.addClass "opened"
self.$modal.removeClass "fluid"
setTimeout ->
focus()
,200
close = ->
self.$modal.addClass "closed"
win.unbind("keydown.modal")
# acionar no on-complete da animação
setTimeout ->
self.opened = 0
stopListening()
self.$modal.removeClass "opened closed"
, 300
close = ->
self.$modal.addClass "closed"
win.unbind("keydown.modal")
# acionar no on-complete da animação
setTimeout ->
self.opened = 0
stopListening()
self.$modal.removeClass "opened closed"
, 300
setContent = (template, data) ->
self.$main.empty()
if template
if data
Blaze.renderWithData template, data, self.$main.get(0)
else
Blaze.render template, self.$main.get(0)
checkFooter()
check()
setContent = (template, data) ->
self.$main.empty()
if template
if data
Blaze.renderWithData template, data, self.$main.get(0)
else
Blaze.render template, self.$main.get(0)
checkFooter()
check()
checkFooter = ->
if self.$footer and self.$footer.length
buttons = self.$footer.find "button"
buttons.each ->
btn = $(@)
if btn.html().match /fechar/ig
btn.click (e) ->
e.preventDefault()
close()
checkFooter = ->
if self.$footer and self.$footer.length
buttons = self.$footer.find "button"
buttons.each ->
btn = $(@)
if btn.html().match /fechar/ig
btn.click (e) ->
e.preventDefault()
close()
startListening = ->
stopListening()
self.interval = setInterval ->
check()
, 100
startListening = ->
stopListening()
self.interval = setInterval ->
check()
, 100
stopListening = ->
clearInterval self.interval if self.interval
stopListening = ->
clearInterval self.interval if self.interval
init = ($modal, params) ->
self.params = params or {}
self.opened = 0
self.initialized = 0
self.$modal = if $modal.length then $modal else $(".kncty-modal")
if self.$modal.length
self.initialized = 0
self.$window = self.$modal.find ".-modal"
self.$main = self.$modal.find "main"
self.$close = self.$modal.find "header > .close"
self.$footer = self.$modal.find "footer"
self.$close.unbind("click").click close
win.unbind("resize.modal").bind "resize.modal", check
win.unbind("keydown.modal").bind "keydown.modal", (e) ->
keydown(e)
init = ($modal, params) ->
self.params = params or {}
self.opened = 0
self.initialized = 0
self.$modal = if $modal.length then $modal else $(".rocket-modal")
if self.$modal.length
self.initialized = 0
self.$window = self.$modal.find ".modal"
self.$main = self.$modal.find "main"
self.$close = self.$modal.find "header > .close"
self.$footer = self.$modal.find "footer"
self.$close.unbind("click").click close
win.unbind("resize.modal").bind "resize.modal", check
win.unbind("keydown.modal").bind "keydown.modal", (e) ->
keydown(e)
init: init
open: open
close: close
focus: focus
setContent: setContent
init: init
open: open
close: close
focus: focus
setContent: setContent
)()

1030
client/stylesheets/dashboard.less → client/stylesheets/base.less
View File

File diff suppressed because it is too large Load Diff

102
client/stylesheets/utils/_keyframes.import.less vendored
Unescape View File

@ -20,3 +20,105 @@
99% { opacity: 0; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@-webkit-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@-moz-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@-o-keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@keyframes highlight {
0% {
background: #ffff99;
}
100% {
background: none;
}
}
@keyframes modalEnter {
0% {
opacity: 0;
visibility: hidden;
}
1% {
opacity: 0;
visibility: visible;
.transform(translateY(-150px));
}
100% {
opacity: 1;
visibility: visible;
.transform(translateY(0));
}
}
@-webkit-keyframes modalEnter {
0% {
opacity: 0;
visibility: hidden;
}
1% {
opacity: 0;
visibility: visible;
-webkit-transform: translateY(-150px);
}
100% {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
}
}
@keyframes modalExit {
0% {
opacity: 1;
visibility: visible;
}
99% {
opacity: 0;
visibility: visible;
.transform(translateY(150px));
}
100% {
opacity: 0;
visibility: hidden;
}
}
@-webkit-keyframes modalExit {
0% {
opacity: 1;
visibility: visible;
}
99% {
opacity: 0;
visibility: visible;
-webkit-transform: translateY(150px);
}
100% {
opacity: 0;
visibility: hidden;
}
}

28
client/stylesheets/utils/_reset.import.less vendored
Unescape View File

@ -15,33 +15,33 @@ article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
display: block;
}
body {
line-height: 1;
line-height: 1;
}
ol, ul {
list-style: none;
list-style: none;
}
blockquote, q {
quotes: none;
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
}

2
client/views/login/services.html
Unescape View File

@ -1,6 +1,6 @@
<template name='loginServices'>
{{#if hasLoginServices}}
<div class="external-login">
<div class="social-login">
<h3>{{_ "loginServices.login_with"}}</h3>
{{#each loginService}}
<button type="button" class="button external-login {{service}}"><span>{{displayName}}</span></button>

4
client/views/modal.html
Unescape View File

@ -1,8 +1,8 @@
<template name="modal">
<section id="{{this.id}}" class="kncty-modal {{this.class}}" tabindex="-1" role="dialog" aria-hidden="true">
<section id="{{this.id}}" class="rocket-modal {{this.class}}" tabindex="-1" role="dialog" aria-hidden="true">
<div class="wrapper">
<div class="window">
<form id="{{this.id}}-form" class="-modal form-horizontal">
<form id="{{this.id}}-form" class="modal form-horizontal">
<header>
<h3>{{this.title}}</h3>
<span class="close"><i class="fa fa-close"></i></span>

Write Preview
Loading…
Cancel
Save