From 5d8742c117b580d156147dbbf3023811f329bd93 Mon Sep 17 00:00:00 2001 From: Ray Date: Mon, 1 Nov 2021 10:04:50 +0100 Subject: Review formatting --- common/main.css | 165 +++++++++++++++++++++++++++----------------------------- 1 file changed, 78 insertions(+), 87 deletions(-) (limited to 'common') diff --git a/common/main.css b/common/main.css index 6e341ca..7b25fd1 100644 --- a/common/main.css +++ b/common/main.css @@ -6,7 +6,7 @@ url('font/acme_7_wide_xtnd.ttf') format('truetype'); font-weight: normal; font-style: normal; - font-size-adjust:0.49; + font-size-adjust:0.49; } ::-webkit-scrollbar { width: 10px; height: 10px; } @@ -17,105 +17,96 @@ ::-webkit-scrollbar-thumb:vertical { height: 50px; background-color: #000000; } ::-webkit-scrollbar-thumb:horizontal { width: 50px; background-color: #000000; } -*{padding:0px; margin:0px; font-family: grixel_acme_7_wide_xtnd, Courier New, Verdana, Arial; line-height:24px;} -body{background-color:#f5f5f5;} -a{text-decoration: none; color:black;} -p a:hover{text-decoration: none; color:gray;} -h1{font-family: Courier New, Verdana, Arial; font-weight: bold; font-size: 18px; line-height:24px;} -h2{font-family: Courier New, Verdana, Arial; font-weight: bold; font-size: 18px; line-height:24px;} +* { padding:0px; margin:0px; font-family: grixel_acme_7_wide_xtnd, Courier New, Verdana, Arial; line-height:24px; } +body { background-color:#f5f5f5; } +a {text-decoration: none; color:black; } +p a:hover{text-decoration: none; color:gray; } +h1 { font-family: Courier New, Verdana, Arial; font-weight: bold; font-size: 18px; line-height:24px; } +h2 { font-family: Courier New, Verdana, Arial; font-weight: bold; font-size: 18px; line-height:24px; } -.page{width:880px; margin:0 auto;} +.page { width:880px; margin:0 auto; } -.header{width:100%; float:left; position:relative; height:128px; font-size:10pt; margin-top:40px; margin-left:10px;} -.content{font-size:8pt; width:840px; padding:10px; padding-top:30px; float:left; position:relative; padding-bottom:50px;} -.footer{width:820px; float:left; position:relative; border-top:1px solid black; text-align: right; height:40px; padding-top:10px;} -.footer p a{color:#aaaaaa;} -.footer p a:hover{color:#444;} -.footer p{ font-size:6pt; color:#aaaaaa; margin-top:-8px; } -.simplelink{ font-weight: bold; color: #ff6060; } +.header { width:100%; float:left; position:relative; height:128px; font-size:10pt; margin-top:40px; margin-left:10px; } +.content { font-size:8pt; width:840px; padding:10px; padding-top:30px; float:left; position:relative; } +.footer { width:820px; float:left; position:relative; border-top:1px solid black; text-align: right; height:40px; padding-top:10px; } +.footer p a {color:#aaaaaa; } +.footer p a:hover {color:#444; } +.footer p { font-size:6pt; color:#aaaaaa; margin-top:-8px; } +.simplelink { font-weight: bold; color: #ff6060; } /* font change for better reading... */ -.content p, .content a, .content p strong, .content strong, .content .downloadText{font-family: Courier New, Verdana, Arial!important; font-size: medium; line-height: 200%; } +.content p, .content a, .content p strong, .content strong, .content .downloadText { font-family: Courier New, Verdana, Arial!important; font-size: medium; line-height: 200%; } .downloadButtonInstaller { font-size: x-small; } -.list, .list strong {font-family: Courier New, Verdana, Arial!important; font-size: medium; line-height: 200%; } +.list, .list strong { font-family: Courier New, Verdana, Arial!important; font-size: medium; line-height: 200%; } #logo{width:128px; height:128px; float:left; position:relative; background-image:url(img/raylib_logo.png);} .menu{width:auto; height:40px; text-align:right; right:0px; left:15px; bottom:0px; position:relative; float:left; margin-left:0px; margin-top:-3px; border-bottom:1px solid black; overflow:hidden;} .menu a{height: 40px; padding:0px 20px; color:black; font-size:12pt; float:left; position:relative; top: 4px; transition:top 0.1s ease-in-out;} .menu a:hover{padding:0px 20px; top:0px;} - -#active{ - height: 40px; - padding:0px 20px; color:#707070; font-size:12pt; float:left; position:relative; - margin-top: 0px; -} - -.menu a:hover, #active{ - background: rgb(254,255,255); - background: linear-gradient(to bottom, rgba(245,245,245,1) 0%,rgba(224,224,224,1) 100%); -} - -#social{ width:440px; height:50px; position:relative; float:right; margin-right:8px; margin-top:20px; margin-bottom:20px; } -#social a:hover{ background-position: 0 -36px;} -#youtube{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_youtube.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#handmade{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_handmade.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#twitch{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_twitch.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#redbubble{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_redbubble.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#patreon{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_patreon.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#itchio{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_itchio.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#reddit{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_reddit.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#freenode{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_freenode_irc.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#gitter{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_gitter.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#twitter{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_twitter.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#github{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_github.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#kofi{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_kofi.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -#discord{ width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_discord.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0;} -.list{margin-top:10px; margin-left:30px; display: inline-block} - -#licensebox{ width:808px; height:400px; border:12px solid; border-color:#d0d0d0; background-color:#e4e4e4;} -#licensebox p{ font-size:12px; margin-top: 15px; margin-left: 10px;} -.licensepoint{ margin-left: 25px!important;} - -.downloadText{width:420px; height:40px; float:left; position:relative; margin-left:40px;} -.downloadButton{width:220px; height:35px; float:left; position: relative; cursor:pointer; font-weight: bold; line-height:35px; text-align: center; border-width:5px!important;} -.downloadButtonInstaller{width:460px; height:35px; position: relative; margin: auto auto; margin-top:20px!important; cursor:pointer; font-weight: bold; line-height:35px; text-align: center; border-width:5px!important;} -#btngit{background-color:#e1e1e1; color:#5c5a5a; border:4px solid #898888;} -#btngit:hover{background-color:#bedce8; color:#417794; border:4px solid #5d9cbd;} -#btnlib{background-color:#e1e1e1; color:#5c5a5a; border:4px solid #898888; margin-top: 15px;} -#btnlib:hover{background-color:#f0d6d6; color:#c55757; border:4px solid #e66666; margin-top: 15px;} -#btnmac{font-weight: normal; cursor:default; background-color:#f0f0f0; color:#5c5a5a; border:4px solid #d3d3d3;} -#newVersion{background-color:#f0d6d6; color:#e55757; border:1px solid #f66666; margin-top: 15px; margin-left: -5px; width:100%; height:30px; position: relative; margin: auto auto; line-height:30px; text-align: center;} -#raylib13{position:relative; background-color:#222222; color:#f5f5f5; width:100vw; left:calc(-52vw + 50%); padding:30px; text-align:center; margin: 10px;} - -#basicgrid{width:580px; margin-left:60px; float:left; position:relative; text-align: center} -#advgrid{width:560px; margin-left:70px; float:left; position:relative; text-align: center} -.exampleBox{cursor:pointer; margin:15px 20px; width:54px; padding-right:2px; height:56px; border:4px solid black; display:inline-block; text-align: right; font-weight: bold; vertical-align: bottom;} -.exampleBox .in{display: table-cell; vertical-align: bottom; width:52px; height:56px;} - -.specialBox{cursor:pointer; vertical-align: bottom; color:#818181; width:56px; height:58px; padding-right:2px; padding-top:4px; padding-left:4px; margin:15px 20px; display:inline-block; border:1px solid #b9b9b9; text-align:right;} -.specialBox .in{display: table-cell; vertical-align: bottom; width:52px; height:52px; border:1px solid #b9b9b9; margin-top:-5px;} -.specialBox:hover{ color: black; border:1px solid black; } -.specialBox .in:hover{ color: black; border:1px solid black; } -.boxintext{margin-bottom: 3px; margin-right: 2px; line-height:10px; font-size:6pt;} -.boxintextex{margin-bottom: 3px; margin-right: -2px; line-height:10px; font-size:6pt; width:54px!important; height:53px!important; font-weight: normal!important;} -.boxtodo{margin-bottom: 13px; margin-right: 7px;} - -.help{ font-size:8px; margin-left: 25px; } -#paypalbox{ width:200px; height:50px; border:12px solid; border-color:#d0d0d0; background-color:#e4e4e4; margin:0 auto; } +#active { height: 40px; padding:0px 20px; color:#707070; font-size:12pt; float:left; position:relative; margin-top: 0px; } +.menu a:hover, #active { background: rgb(254,255,255); background: linear-gradient(to bottom, rgba(245,245,245,1) 0%,rgba(224,224,224,1) 100%); } + +#social { width:440px; height:50px; position:relative; float:right; margin-right:8px; margin-top:20px; margin-bottom:20px; } +#social a:hover { background-position: 0 -36px; } +#youtube { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_youtube.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#handmade { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_handmade.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#twitch { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_twitch.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#redbubble { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_redbubble.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#patreon { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_patreon.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#itchio { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_itchio.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#reddit { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_reddit.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#freenode { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_freenode_irc.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#gitter { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_gitter.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#twitter { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_twitter.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#github { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_github.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#kofi { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_kofi.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +#discord { width:36px; height:36px; float:left; position:relative; background-image: url(img/icon_discord.png); cursor: pointer; background-repeat:no-repeat; background-position: 0 0; } +.list { margin-top:10px; margin-left:30px; display: inline-block; } + +#licensebox { width:808px; height:400px; border:12px solid; border-color:#d0d0d0; background-color:#e4e4e4; } +#licensebox p { font-size:12px; margin-top: 15px; margin-left: 10px; } +.licensepoint { margin-left: 25px!important; } + +.downloadText { width:420px; height:40px; float:left; position:relative; margin-left:40px; } +.downloadButton { width:220px; height:35px; float:left; position: relative; cursor:pointer; font-weight: bold; line-height:35px; text-align: center; border-width:5px!important; } +.downloadButtonInstaller { width:460px; height:35px; position: relative; margin: auto auto; margin-top:20px!important; cursor:pointer; font-weight: bold; line-height:35px; text-align: center; border-width:5px!important; } +#btngit { background-color:#e1e1e1; color:#5c5a5a; border:4px solid #898888; } +#btngit:hover { background-color:#bedce8; color:#417794; border:4px solid #5d9cbd; } +#btnlib { background-color:#e1e1e1; color:#5c5a5a; border:4px solid #898888; margin-top: 15px; } +#btnlib:hover { background-color:#f0d6d6; color:#c55757; border:4px solid #e66666; margin-top: 15px; } +#btnmac { font-weight: normal; cursor:default; background-color:#f0f0f0; color:#5c5a5a; border:4px solid #d3d3d3; } +#newVersion { background-color:#f0d6d6; color:#e55757; border:1px solid #f66666; margin-top: 15px; margin-left: -5px; width:100%; height:30px; position: relative; margin: auto auto; line-height:30px; text-align: center; } +#raylib13 { position:relative; background-color:#222222; color:#f5f5f5; width:100vw; left:calc(-52vw + 50%); padding:30px; text-align:center; margin: 10px; } + +#basicgrid { width:580px; margin-left:60px; float:left; position:relative; text-align: center; } +#advgrid { width:560px; margin-left:70px; float:left; position:relative; text-align: center; } +.exampleBox { cursor:pointer; margin:15px 20px; width:54px; padding-right:2px; height:56px; border:4px solid black; display:inline-block; text-align: right; font-weight: bold; vertical-align: bottom; } +.exampleBox .in { display: table-cell; vertical-align: bottom; width:52px; height:56px; } + +.specialBox { cursor:pointer; vertical-align: bottom; color:#818181; width:56px; height:58px; padding-right:2px; padding-top:4px; padding-left:4px; margin:15px 20px; display:inline-block; border:1px solid #b9b9b9; text-align:right; } +.specialBox .in { display: table-cell; vertical-align: bottom; width:52px; height:52px; border:1px solid #b9b9b9; margin-top:-5px; } +.specialBox:hover { color: black; border:1px solid black; } +.specialBox .in:hover { color: black; border:1px solid black; } +.boxintext { margin-bottom: 3px; margin-right: 2px; line-height:10px; font-size:6pt; } +.boxintextex { margin-bottom: 3px; margin-right: -2px; line-height:10px; font-size:6pt; width:54px!important; height:53px!important; font-weight: normal!important; } +.boxtodo { margin-bottom: 13px; margin-right: 7px; } + +.help { font-size:8px; margin-left: 25px; } +#paypalbox { width:200px; height:50px; border:12px solid; border-color:#d0d0d0; background-color:#e4e4e4; margin:0 auto; } #paypalform input { margin-top: 12px; margin-left: 50px; } -#wiki{ color: maroon; } +#wiki { color: maroon; } -#itchioframe{ display:block; text-align:center; } +#itchioframe { display:block; text-align:center; } -.icon{ margin-right: 2px; } -#platforms>a>img{ border: 6px solid #888888; transition: all .2s ease; } -#platforms>a>img:hover{ border: 6px solid #111111; } +.icon { margin-right: 2px; } +#platforms>a>img { border: 6px solid #888888; transition: all .2s ease; } +#platforms>a>img:hover { border: 6px solid #111111; } -#bindings>a>img{ border: 6px solid #888888; transition: all .2s ease; } -#bindings>a>img:hover{ border: 6px solid #111111; } +#bindings>a>img { border: 6px solid #888888; transition: all .2s ease; } +#bindings>a>img:hover { border: 6px solid #111111; } -#extralibs>a>img{ transition: all .2s ease; } -#extralibs>a>img:hover{ filter: contrast(200%); } +#extralibs>a>img { transition: all .2s ease; } +#extralibs>a>img:hover { filter: contrast(200%); } -#raylibtech>a>img{ transition: all .2s ease; } -#raylibtech>a>img:hover{ filter: contrast(180%); } +#raylibtech>a>img { transition: all .2s ease; } +#raylibtech>a>img:hover { filter: contrast(180%); } -- cgit v1.2.3